文档章节

自定义控件原理详解(控件、画图)

martin_dudu
 martin_dudu
发布于 2016/01/23 11:24
字数 691
阅读 154
收藏 11

思路:

1.先了解继承View实现自定义控件原理

2.深入探究涉及到的方法

3.通过SwitchButton实例进行分析

输入图片说明

第一步:原理

自定义View控件,首先确定控件的大小范围onMeasure()来实现;【控件大小范围

@Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        setMeasuredDimension(switchBitMapWidth, switchBitMapHeight);
    }

事件处理需要重写onTouchEvent();【滑动处理

public boolean onTouchEvent(MotionEvent event) {
        if (isFocusable()) {
            int action = event.getAction();
            switch (action) {
                case MotionEvent.ACTION_DOWN:
                    isSliding = true;
                    currentX = (int) event.getX();
                    break;

                case MotionEvent.ACTION_MOVE:
                    currentX = (int) event.getX();
                    Log.i("currentX", currentX + "");

                    break;
                case MotionEvent.ACTION_UP:
                    isSliding = false;
                    int bgCenter = switchBitMapWidth / 2;
                    boolean state = currentX > bgCenter;
                    if (state != currentState && mChangedListener != null) {
                        mChangedListener.onToggleStateChanged(state, this);
                    }
                    currentState = state;
                    break;
                default:
                    break;
            }
            invalidate();
        }
        return true;
    }

再就是重写方法onDraw()绘制控件显示什么图片;【图片绘制

 protected void onDraw(Canvas canvas) {
        if (isSliding) {
            canvas.drawBitmap(slideBitMap, 0, 0, null);
            int dis = currentX - slideBitMapWidth / 2;
            if (dis < 0) {
                dis = 0;
            } else if (dis > switchBitMapWidth - slideBitMapWidth) {
                dis = switchBitMapWidth - slideBitMapWidth;
            }
           
            if (dis < (switchBitMapWidth - slideBitMapWidth) / 2) {
               
                canvas.drawBitmap(switchOffBitMap, dis, 0, null);
            } else {
                
                canvas.drawBitmap(switchOnBitMap, dis, 0, null);
            }
        } else {
            if (currentState) {
                canvas.drawBitmap(slideBitMap, 0, 0, null);
                canvas.drawBitmap(switchOnBitMap, switchBitMapWidth - slideBitMapWidth, 0, null);
            } else {
                canvas.drawBitmap(slideBitMap, 0, 0, null);
                canvas.drawBitmap(switchOffBitMap, 0, 0, null);
            }
        }
        super.onDraw(canvas);
    }

onTouchEvent()方法控制的就是一个状态的变化,是否在滑动【isSliding】、当前状态【currentState】 onDraw()方法实现的是就是在滑动状态时,显示什么图片;在滑动结束的时候,显示什么图片。 所以我们需要知道手指滑动时候的坐标、滑到什么位置,画什么图,所以你需要知道view的坐标。 输入图片说明

但是这并没有什么卵用,所以你还需要知道event.getX()出来表示的是那块坐标距离。

坐标系

详细就点这

你在我里面滑来滑去,我才知道,你滑到什么位置,我显示什么图片么!(getX()是控件内的坐标)。 这样来看自定义控件就这么回事啊。

但是为了深入了解一下敌人内部,就看了一下Canvas的各种方法。【取代所有的图片资源,Canvas直接画,如果简单的话(比如规则图形:圆,半圆,圆角矩形,直接画更快)

参考了这篇博客画一个小黄人

在上面博客理解的时候碰到的问题就是画矩形时候的坐标,代表的含义:

  RectF rect = new RectF();

画矩形时,各参数的意义

知道这个就好理解了。自己可以画自己喜欢的。

####参考资料 1.自定义控件原理解析

http://www.cnblogs.com/zhangs1986/p/3776386.html

http://www.cnblogs.com/jww-love-study/p/5114028.html

http://www.cnblogs.com/0616--ataozhijia/p/4003380.html

2.motionevent.getX()详解

http://blog.csdn.net/ztp800201/article/details/17218067

Canvas使用详解

http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2012/1212/703.html

http://blog.csdn.net/qinjuning/article/details/6936783

http://www.jianshu.com/p/e1bc10e75b6d

View坐标系

http://blog.csdn.net/lvxiangan/article/details/19971509

http://blog.csdn.net/jason0539/article/details/42743531

矩形坐标的含义

http://blog.csdn.net/chengyingzhilian/article/details/7452082

© 著作权归作者所有

martin_dudu
粉丝 0
博文 5
码字总数 2027
作品 0
程序员
私信 提问
加载中

评论(1)

lzg1990
lzg1990
000
Android入门第十四篇之画图

本文来自http://blog.csdn.net/hellogv/ ,引用必须注明出处! 常用控件说了不少,现在说说手机开发中也常用到的画图。要掌握Android的画图,首先就要了解一下,基本用到的图形接口: 1.Bitm...

晨曦之光
2012/03/14
657
0
软件开发者技术交流大会总结篇

软件开发者技术交流活动,是黑房子社区组织的第一期技术交流活动,经验不足,宣传力度不够,很多人由于没能看到通知错过了本次活动。报名人数34人,实到现场28人。后期我们将继续组织类似的技...

济南工作网
2013/12/10
1K
15
View 绘制体系知识梳理(8) - obtainStyledAttributes 详解

一、基本概念 1.1 资源 使用文件来描述各种资源,包括字符串、颜色、主题、布局等等。资源分为两个部分,及 值 和 属性。 1.1.1 属性 在开发的过程中,如果需要为自定义声明一个新的属性,那...

泽毛
2018/03/29
0
0
iOS第三方星级视图控件——HCSStarRatingView

iOS第三方星级视图控件——HCSStarRatingView HCStarRatingView是一款十分小巧的星级视图控件,其通过原生画图的方式来渲染星级视图页面,同时,其也支持开发者对星级图片的自定义操作。 HC...

珲少
2016/07/06
365
0
Web开发系列 - GIS

Google Maps JQuery Maps google map是怎样工作的 Google Maps API编程资源大全 google map限制地图缩放级别和显示范围 WebGIS近来学习小结,GoogleMap影像在线矢量化简述 google map v3 ap...

长征2号
2017/08/09
0
0

没有更多内容

加载失败,请刷新页面

加载更多

4.01、Linux异常

1、无法连接虚拟设备ide1:0,因为主机上没有响应的设备 解决方法:找到“虚拟机” —— 打开“虚拟机设置” —— 单击“CD/DVD(IDE)”,右侧选中“使用ISO映像文件”,然后选中自己的镜像,重启...

静以修身2025
25分钟前
1
0
不允许有匹配 "[xX][mM][lL]" 的处理指令目标

Bug解决方案:org.xml.sax.SAXParseException; lineNumber: 1; columnNumber: 8; 不允许有匹配 "[xX][mM][lL]" 的处理指令目标 Caused by: org.xml.sax.SAXParseException; lineNumber: 1; c......

我叫小糖主
29分钟前
1
0
Mysql InnoDB 行锁和表锁介绍

mysql 的 InnoDB引擎支持行锁,与Oracle不同,mysql的行锁是通过索引加载的,即是行锁是加在索引响应的行上的,要是对应的SQL语句没有走索引,则会全表扫描,行锁则无法实现,取而代之的是表...

嘴角轻扬30
29分钟前
2
0
springboot+jpa 错误信息org.springframework.beans.factory.BeanCreationException

报错信息 org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'entityManagerFactory' defined in class path resource [org/springframework/boot/a......

冥焱
47分钟前
1
0
威胁快报|新兴挖矿团伙借助shodan作恶,非web应用安全再鸣警钟

近日,阿里云安全发现了一个使用未授权访问漏洞部署恶意Docker镜像进行挖矿的僵尸网络团伙。我们给这一团伙取名为Xulu,因为该团伙使用这个字符串作为挖矿时的用户名。 Xulu并不是第一个攻击...

迷你芊宝宝
54分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部