Skip to content

4xes/Sketch-Android-View

Repository files navigation

Sketch-Android-View

This plugin allow you to generate Android graphics from sketch.

Demo

How to install plugin

Why this need?

  1. If you want determine click from not rectangle figures.
  2. Create complicated custom view.

What's support?

  1. Text
  2. Rectangle (Not supported, but you can convert it in vector path)
  3. Circle
  4. Vector
  5. Line
  6. Fill and border
  7. Styles
  8. Shadow (Not supported)

How to use?

  1. Change your paths in options.js
    var options = {
        template: {
            path: '/Users/{user}/Library/Application\ Support/com.bohemiancoding.sketch3/Plugins/android-custom-view.sketchplugin/Contents/Sketch/templates/ScrollView.java'
        },
        out:{
            path: '/Users/{user}/Documents/',
            packageName: 'com.example.plugin',
            viewName: 'CustomScrollView'
        }
    };
  2. Create new sketch file, add artboard with positions (0,0).
  3. Make names your shapes with '#'
  4. Select your shapes.

Screen list

  1. Plugins -> AndroidVectorView -> Generate custom view.
  2. Find you custom view in path witch your determine in (3).

Also.

  1. For default all shapes added for click listener. Default template.
  //handle clicks
  @Override public boolean onSingleTapConfirmed(MotionEvent e) {
    mPoint.x = (int) e.getX() + mScroll.x;
    mPoint.y = (int) e.getY() + mScroll.y;
    
    boolean handled = false;
    //check in all shapes
    for (int i = 0; i < mRegions.size(); i++) {
      //if touched any shape
      if (mRegions.valueAt(i).contains(mPoint.x, mPoint.y)) {
        showMessage("Click on " + mRegions.keyAt(i));
        handled = true;
      }
    }
  return handled;
  }
  1. You can determine custom template for class view and set it in options.js

About

Plugin for creation Android graphic code from .sketch

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published