黑马程序员技术交流社区

标题: 【济南中心】利用ViewOverlay在手机界面上画标注 [打印本页]

作者: 大山哥哥 时间: 2016-10-31 22:33
标题: 【济南中心】利用ViewOverlay在手机界面上画标注
本帖最后由大山哥哥于 2016-10-31 22:33 编辑

最近给学生用真机演示demo的时候，学生不能很好的看到手指活动的区域。正好发现Android在api18之后提供了一个ViewOverlay可以很容易的，在现有的视图上绘制内容。所以用ViewOverlay实现了一个可以根据手指轨迹画方框的demo。以供大家一块学习。下面上图：

实现起来也很简单，就是给整个布局设置触摸监听，在触摸事件中计算方框，并添加给ViewOverlay.

[AppleScript] 纯文本查看 复制代码

/*

     * 触摸事件处理

     */

    @Override

    public boolean onTouch(View v, MotionEvent event) {

        int x = (int) event.getX();

        int y = (int) event.getY();

        switch (event.getAction()) {

            case MotionEvent.ACTION_DOWN:

                Drawable current = markerAt(x, y);

                if (current == null) {

                    mTrackingMarker = addBox(v, x, y);

                    mTrackingPoint = new Point(x, y);

                } else {

                    //移除前面的方框

                    removeMarker(v, current);

                }

                break;

            case MotionEvent.ACTION_MOVE:

                if (mTrackingMarker != null) {

                    resizeBox(v, mTrackingMarker, mTrackingPoint, x, y);

                }

                break;

            case MotionEvent.ACTION_UP:

            case MotionEvent.ACTION_CANCEL:

                mTrackingMarker = null;

                mTrackingPoint = null;

                break;

        }

        return true;

    }

1. 在DOWN事件中，我们先判断是否添加了这个红框的drawable。如果没有把他创建出来并添加到Overlay中。
2. 在MOVE事件中，给边红框的大小

[AppleScript] 纯文本查看 复制代码

/*

     * 更新已经存在的方框

     */

    private void resizeBox(View v, Drawable target, Point trackingPoint, int x, int y) {

        Rect bounds = new Rect(target.getBounds());

        //如果触摸点在已经存在的点的左边更新左边位置

        //else说明在右边，更新右边的位置

        if (x < trackingPoint.x) {

            bounds.left = x;

        } else {

            bounds.right = x;

        }



        //如果新的触摸点在已经存在点的上边，更新上边的位置

        //else更新下边的位置

        if (y < trackingPoint.y) {

            bounds.top = y;

        } else {

            bounds.bottom = y;

        }



        //更新方框的边框

        target.setBounds(bounds);

        v.invalidate();

    }

到此，我们就可以在屏幕上自由的画区域的标示红框了。

下面上源码

ViewOverlay.zip

94.08 KB, 下载次数: 74

作者: 水中鸟 时间: 2016-10-31 22:45
对我来说还是太高深了~~！

作者: 橘子哥 时间: 2016-11-1 09:29
虽然看不懂，但是感觉还是很高大上

作者: baby14 时间: 2019-6-25 07:29
多谢分享

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2