手势自动绘制自己

Question

我在 Dolphin 浏览器上看到过。默认情况下已经创建了一些手势。他们将重新绘制自己，以便用户知道从哪里开始绘制。我注意到在 Gesture 对象中，有一个名为 toPath() 的方法。但我不知道如何使用它，我不确定我是否走在正确的轨道上。有人可以告诉我该怎么做吗？谢谢。你可以看看下面的图片。

Answer 1

首先，我建议从 SDK 示例中查看 GestureBuilder 应用程序。它完全符合您的问题（小手势缩略图）中显示的内容。

我稍微扩展了该示例，以使Gesture API 的使用更加清晰：

将以下代码添加到 GeatureBuilder 示例中的 GestureBuilderActivity 中：

@Override
protected void onListItemClick(ListView l, View v, int position, long id) {
    super.onListItemClick(l, v, position, id);

    final Intent intent = new Intent(getApplicationContext(), ShowGestureActivity.class);

    intent.putExtra(ShowGestureActivity.GESTURE_NAME_EXTRA, ((NamedGesture)v.getTag()).name);
    startActivity(intent);
}

它将启动新的测试活动ShowGestureActivity：

public class ShowGestureActivity extends Activity {
    public static final String GESTURE_NAME_EXTRA = "gesture_extra";
    private Gesture mGesture = null;
    private FrameLayout mContainer;
    private MyPathView mMyPathView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.show_gesture);

        final ArrayList<Gesture> gestures = GestureBuilderActivity.getStore()
                .getGestures(getIntent().getStringExtra(GESTURE_NAME_EXTRA));

        if (gestures.size() == 1) {
            mGesture = gestures.get(0);
        } else {
            Toast.makeText(getApplicationContext(), "No gesture available!", Toast.LENGTH_LONG).show();
        }

        mContainer = (FrameLayout) findViewById(R.id.container);
        mMyPathView = (MyPathView) findViewById(R.id.myPathView);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.show_gesture_menu, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        final int id = item.getItemId();

        if (mGesture == null) {
            return false;
        }

        switch (id) {
            case R.id.action_show_gesture_bmp:
                final Bitmap gestureBmp = mGesture.toBitmap(mContainer.getWidth(), mContainer.getHeight(),
                        getResources().getDimensionPixelSize(R.dimen.gesture_thumbnail_inset), Color.YELLOW);

                mMyPathView.setVisibility(View.GONE);
                mContainer.setBackground(new BitmapDrawable(getResources(), gestureBmp));
                return true;

            case R.id.action_show_gesture_path:
                mMyPathView.setPath(mGesture.toPath(mContainer.getWidth(), mContainer.getHeight(),
                        getResources().getDimensionPixelSize(R.dimen.gesture_thumbnail_inset), 10));
                mMyPathView.setVisibility(View.VISIBLE);
                mContainer.setBackground(null);
                return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

在onOptionsItemSelected 中，您可以看到两种Gesture 可用于绘图的方法的用法。似乎toBitmap 很清楚（GesturesBuilder 应用程序本身使用该方法在列表中显示手势缩略图）。 关于toPath：它为您提供了与Gesture 对应的路径。之后，您可以根据需要使用该路径进行绘图。上面测试活动中的MyPathView 提供了最简单的方法：

public class MyPathView extends View {
    private Paint mPaint;
    private Path mPath = null;

    public MyPathView(Context context) {
        super(context);
        init(null, 0);
    }

    public MyPathView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(attrs, 0);
    }

    public MyPathView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(attrs, defStyle);
    }

    private void init(AttributeSet attrs, int defStyle) {
        mPaint = new Paint();
        mPaint.setColor(Color.YELLOW);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(getResources().getDimensionPixelSize(R.dimen.paint_width));
    }

    public void setPath(final Path path) {
        mPath = path;
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        if (mPath != null) {
            canvas.drawPath(mPath, mPaint);
        }
    }
}

而 xml 是（只是为了使示例易于编译）：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/container">

    <com.sandrstar.testapp.test.MyPathView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/myPathView"
        android:visibility="gone"/>
</FrameLayout>

如果你想对手势绘图应用某种动画，你需要获取路径，如上所述创建自定义视图并应用一些动画方法，例如就像这里描述的一样Draw path on canvas with animation