Android 自定义组件 方法篇

声明:本文简述Android应用开发中,自定义组件的实现方式,参考和查阅部分资料,整理而成。

参考资料:

Android 手把手教您自定义ViewGroup:http://blog.csdn.net/lmj623565791/article/details/38339817

Android自定义控件:http://blog.163.com/ppy2790@126/blog/static/103242241201382210910473/

Android自定义控件开发入门:http://blog.csdn.net/sunmc1204953974/article/details/38456791

一、准备知识

1、View、ViewGroup

View是一个抽象的视图对象(虽然这个类不是抽象的),它定义了一个视图所需具有的属性和基本操作方法。

职责:1、根据测量模式和父容器(ViewGroup)给出的建议的宽和高,计算出自己的宽和高;2、在父容器(ViewGroup)为其指定的区域内绘制自己的形态。

ViewGroup本质上也是一个View,它相当于一个放置View的容器,这个容器的属性可以通过XML布局文件进行配置,比如:宽度(layout_width)、高度(layout_height)、对齐方式(layout_gravity)等。

职责:1、给容器内的childView(View)计算出建议的宽和高和测量模式(为什么只是建议呢,别忘了childView宽和高可以设置为wrap_content,这样只有childView才能计算出自己的宽和高);2、决定childView的位置。


这种灵活的View层次结构可以形成非常复杂的UI布局,开发者可据此设计、开发非常精致的UI界面。

2、ViewGroup和LayoutParams之间的关系

大家可以回忆一下,当在LinearLayout中写childView的时候,可以写layout_gravity,layout_weight属性;在RelativeLayout中的childView有layout_centerInParent属性,却没有layout_gravity,layout_weight,这是为什么呢?这是因为每个ViewGroup需要指定一个LayoutParams,用于确定支持childView支持哪些属性,比如LinearLayout指定LinearLayout.LayoutParams等。如果大家去看LinearLayout的源码,会发现其内部定义了LinearLayout.LayoutParams,在此类中,你可以发现weight和gravity的身影。

3、View的3种测量模式

上面提到了ViewGroup会为childView指定测量模式,下面简单介绍下三种测量模式:

EXACTLY=1:表示设置了精确的值,一般当childView设置其宽、高为精确值、match_parent时,ViewGroup会将其设置为EXACTLY;(父对象要求子对象必须严格按照它给定的值来约束自己)

AT_MOST=2:表示子布局被限制在一个最大值内,一般当childView设置其宽、高为wrap_content时,ViewGroup会将其设置为AT_MOST;(子对象可以自行选择给定范围内的值)

UNSPECIFIED=0:表示子布局想要多大就多大,一般出现在AadapterView的item的heightMode中、ScrollView的childView的heightMode中;此种模式比较少见。(父对象没有强制要求子对象必须遵循哪些约束)

二、原理介绍

2.1、View结构原理

Android系统的视图结构的设计也采用了组合模式,即View作为所有图形的基类,Viewgroup对View继承扩展为视图容器类。

View定义了绘图的基本操作
基本操作由三个函数完成:measure()、layout()、draw(),其内部又分别包含了onMeasure()、onLayout()、onDraw()三个子方法。具体操作如下:
2.1.1、measure操作
     measure操作主要用于计算视图的大小,即视图的宽度和长度。在view中定义为final类型,要求子类不能修改。measure()函数中又会调用下面的函数:
     (1)onMeasure(),视图大小的将在这里最终确定,也就是说measure只是对onMeasure的一个包装,子类可以覆写onMeasure()方法实现自己的计算视图大小的方式,并通过setMeasuredDimension(width, height)保存计算结果。

2.1.2、layout操作
     layout操作用于设置视图在屏幕中显示的位置。在view中定义为final类型,要求子类不能修改。layout()函数中有两个基本操作:
     (1)setFrame(l,t,r,b),l,t,r,b即子视图在父视图中的具体位置,该函数用于将这些参数保存起来;
     (2)onLayout(),在View中这个函数什么都不会做,提供该函数主要是为viewGroup类型布局子视图用的;

2.1.3、draw操作
     draw操作利用前两部得到的参数,将视图显示在屏幕上,到这里也就完成了整个的视图绘制工作。子类也不应该修改该方法,因为其内部定义了绘图的基本操作:
     (1)绘制背景;
     (2)如果要视图显示渐变框,这里会做一些准备工作;
     (3)绘制视图本身,即调用onDraw()函数。在view中onDraw()是个空函数,也就是说具体的视图都要覆写该函数来实现自己的显示(比如TextView在这里实现了绘制文字的过程)。而对于ViewGroup则不需要实现该函数,因为作为容器是“没有内容“的,其包含了多个子view,而子View已经实现了自己的绘制方法,因此只需要告诉子view绘制自己就可以了,也就是下面的dispatchDraw()方法;
     (4)绘制子视图,即dispatchDraw()函数。在view中这是个空函数,具体的视图不需要实现该方法,它是专门为容器类准备的,也就是容器类必须实现该方法;
     (5)如果需要(应用程序调用了setVerticalFadingEdge或者setHorizontalFadingEdge),开始绘制渐变框;
     (6)绘制滚动条;
      从上面可以看出自定义View需要最少覆写onMeasure()和onDraw()两个方法。

2.2、View类的构造方法

创建自定义控件的3种主要实现方式:
1)继承已有的控件来实现自定义控件: 主要是当要实现的控件和已有的控件在很多方面比较类似, 通过对已有控件的扩展来满足要求。
2)通过继承一个布局文件实现自定义控件,一般来说做组合控件时可以通过这个方式来实现。
    注意此时不用onDraw方法,在构造广告中通过inflater加载自定义控件的布局文件,再addView(view),自定义控件的图形界面就加载进来了。
3)通过继承view类来实现自定义控件,使用GDI绘制出组件界面,一般无法通过上述两种方式来实现时用该方式。

View( Context context)
Simple constructor to use when creating a view from code.
View( Context context,  AttributeSet attrs)
Constructor that is called when inflating a view from XML.
View( Context context,  AttributeSet attrs, int defStyle)
Perform inflation from XML and apply a class-specific base style.

2.3、给自定义View增加属性

2.3.1、在res/values 文件下定义一个attrs.xml 文件。

    <?xml version="1.0" encoding="utf-8"?>  
    <resources>  
        <declare-styleable name="MyView">  
            <attr name="textColor" format="color" />  
            <attr name="textSize" format="dimension" />  
        </declare-styleable>  
    </resources>  

2.3.2、在 MyView.java 代码编写如下,其中下面的构造方法是重点,我们获取定义的属性 R.sytleable.MyView_textColor, 获取方法中后面通常设定默认值( float textSize = a.getDimension(R.styleable.MyView_textSize, 36 ); )  防止我们在 xml 文件中没有定义.从而使用默认值!

MyView 就是定义在<declare-styleable name="MyView "></declare-styleable> 里的 名字,获取里面属性用 名字_ 属性 连接起来就可以.TypedArray 通常最后调用 .recycle() 方法,为了保持以后使用该属性一致性!

    public MyView(Context context,AttributeSet attrs)  
        {  
            super(context,attrs);  
            mPaint = new Paint();  
              
            TypedArray a = context.obtainStyledAttributes(attrs,  
                    R.styleable.MyView);  
              
            int textColor = a.getColor(R.styleable.MyView_textColor,  
                    0XFFFFFFFF);  
            float textSize = a.getDimension(R.styleable.MyView_textSize, 36);  
              
            mPaint.setTextSize(textSize);  
            mPaint.setColor(textColor);  
              
            a.recycle();  
        }  
MyView.java  MyView控件全部代码如下:

    package com.android.tutor;  
    import android.content.Context;  
    import android.content.res.TypedArray;  
    import android.graphics.Canvas;  
    import android.graphics.Color;  
    import android.graphics.Paint;  
    import android.graphics.Rect;  
    import android.graphics.Paint.Style;  
    import android.util.AttributeSet;  
    import android.view.View;  
    public class MyView extends View {  
        private Paint mPaint;  
        private Context mContext;  
        private static final String mString = "Welcome to Mr Wei's blog";  
          
        public MyView(Context context) {  
            super(context);  
            mPaint = new Paint();  
        }  
        public MyView(Context context,AttributeSet attrs)  
        {  
            super(context,attrs);  
            mPaint = new Paint();  
              
            TypedArray a = context.obtainStyledAttributes(attrs,  
                    R.styleable.MyView);  
              
            int textColor = a.getColor(R.styleable.MyView_textColor,  
                    0XFFFFFFFF);  
            float textSize = a.getDimension(R.styleable.MyView_textSize, 36);  
              
            mPaint.setTextSize(textSize);  
            mPaint.setColor(textColor);  
              
            a.recycle();  
        }  
        @Override  
        protected void onDraw(Canvas canvas) {  
            // TODO Auto-generated method stub  
            super.onDraw(canvas);  
            //设置填充  
            mPaint.setStyle(Style.FILL);  
              
            //画一个矩形,前俩个是矩形左上角坐标,后面俩个是右下角坐标  
            canvas.drawRect(new Rect(10, 10, 100, 100), mPaint);  
              
            mPaint.setColor(Color.BLUE);  
            //绘制文字  
            canvas.drawText(mString, 10, 110, mPaint);  
        }  
    }  
2.3.3、将自定义的 MyView 加入布局 main.xml 文件中,并且使用自定义属性,自定义属性必须加上:

    " xmlns:test ="http://schemas.android.com/apk/res/com.android.tutor"  ,test是自定义属性的前缀, com.android.tutor 是包名.

main.xml 全部代码如下:

    <?xml   
    version="1.0" encoding="utf-8"?>  
    <LinearLayout   
    xmlns:android="http://schemas.android.com/apk/res/android"  
                    
    xmlns:test="http://schemas.android.com/apk/res/com.android.tutor"  
        android:orientation="vertical"  
        android:layout_width="fill_parent"  
        android:layout_height="fill_parent"  
        >  
    <TextView    
        android:layout_width="fill_parent"   
        android:layout_height="wrap_content"   
        android:text="@string/hello"  
        />  
    <com.android.tutor.MyView  
        android:layout_width="fill_parent"   
        android:layout_height="fill_parent"   
        test:textSize="20px"  
        test:textColor="#fff"  
    />  
    </LinearLayout>  

三、方法介绍

3.1、自定义控件的实现方式:

3.1.1、第一种:需要在原生控件的基本功能上进行扩展,这个时候只需要继承并对控件进行扩展。如,一种可以让TextView中的文字闪光的控件。

3.1.2、第二种:需要几个控件的组合功能,一般是自定义布局,可以用一个类继承一个布局,这个布局中包含多个控件。

3.1.3、第三种:以上两种不能解决,则独立绘制新的控件,直接从View或ViewGroup开始绘制。如,一种水波(地震波)报警动画

3.1、开发自定义控件的步骤:

  • 了解View的工作原理 
  • 编写继承自View的子类
  • 为自定义View类增加属性 
  • 绘制控件 
  • 响应用户消息 
  • 自定义回调函数

3.2、自定义View的常用方法

  • onFinishInflate() 回调方法,当应用从XML加载该组件并用它构建界面之后调用的方法
  • onMeasure() 检测View组件及其子组件的大小时回调。
  • onLayout() 当该组件需要分配其子组件的位置、大小时回调。View类中布局发生改变时会调用的方法,这个方法是所有View、ViewGroup及其派生类都具有的方法,重载该类可以在布局发生改变时作定制处理,这在实现一些特效时非常有用。
  • onSizeChange() 当该组件的大小被改变时
  • onDraw() 当组件将要绘制它的内容时回调。View类中用于重绘的方法,这个方法是所有View、ViewGroup及其派生类都具有的方法,也是Android UI绘制最重要的方法。开发者可重载该方法,并在重载的方法内部基于参数canvas绘制自己的各种图形、图像效果。
  • onKeyDown 当按下某个键盘时
  • onKeyUp  当松开某个键盘时
  • onTrackballEvent 当发生轨迹球事件时
  • onTouchEvent 当发生触屏事件时
  • onWindowFocusChanged(boolean)  当该组件得到、失去焦点时
  • onAtrrachedToWindow() 当把该组件放入到某个窗口时
  • onDetachedFromWindow() 当把该组件从某个窗口上分离时触发的方法
  • onWindowVisibilityChanged(int): 当包含该组件的窗口的可见性发生改变时触发的方法

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
封面 1 序 2 捐助说明 5 目 录 7 第一章 View的绘图流程 12 1.1、概述 12 1.2、Activity的组成结构 13 1.3、View树的绘图流程 15 1.3.1 测量组件大小 16 1.3.2 确定子组件的位置 17 1.3.3 绘制组件 18 1.4、说点别的 22 1.5 练习作业 22 第二章 Graphics2D API 23 2.1、概述 23 2.2、Point类和PointF类 23 2.3、Rect类和RectF类 25 2.4、Bitmap类和BitmapDrawable类 32 2.5、Canvas类与Paint类 34 2.5.1 绘图概述 34 2.5.2 Paint类 34 2.5.3 Canvas类 39 2.6 练习作业 63 第三章 使用Graphics2D实现动态效果 64 3.1 概述 64 3.2 invalidate()方法 65 3.3 坐标转换 69 3.4 剪切区(Clip) 73 3.5 案例:指针走动的手表 82 3.6 练习作业 88 第四章 双缓存技术 89 4.1 双缓存 89 4.2 在屏幕上绘制曲线 90 4.3 在屏幕上绘制矩形 99 4.4 案例:绘图App 104 4.4.1 绘图属性 106 4.4.2 软件参数 108 4.4.3 绘图缓冲区 109 4.4.4 撤消操作 111 4.4.5 图形绘制 113 4.4.6 绘图区 118 4.4.7 主界面 119 4.5 练习作业 122 第五章 阴影、渐变和位图运算 123 5.1 概述 123 5.2 阴影 123 5.3 渐变 125 5.3.1 线性渐变(LinearGradient) 126 5.3.2 径向渐变(RadialGradient) 130 5.3.3 扫描渐变(SweepGradient) 135 5.3.4 位图渐变(BitmapShader) 138 5.3.5 混合渐变(ComposeShader) 140 5.3.6 渐变与Matrix 142 5.4 位图运算 143 5.4.1 PorterDuffXfermode 143 5.4.2 图层(Layer) 146 5.4.3 位图运算技巧 148 5.5 案例1:圆形头像 152 5.6 案例2:刮刮乐 156 5.7 练习作业 161 第六章 自定义组件 163 6.1 概述 163 6.2 自定义组件的基本结构 164 6.3 重写onMeasure方法 166 6.4 组件属性 175 6.4.1 属性的基本定义 175 6.4.2 读取来自style和theme中的属性 181 6.5 案例1:圆形ImageView组件 186 6.6 案例2:验证码组件CodeView 190 6.7 练习作业 202 第七章 自定义容器 204 7.1 概述 204 7.2 ViewGroup类 205 7.2.1 ViewGroup常用方法 205 7.2.2 ViewGroup的工作原理 208 7.2.3 重写onLayout()方法 213 7.3 CornerLayout布局 217 7.3.1 基本实现 217 7.3.2 内边距padding 224 7.3.3 外边距margin 228 7.3.4 自定义LayoutParams 238 7.4 案例:流式布局(FlowLayout) 246 7.5 练习作业 256 第八章 Scroller与平滑滚动 257 8.1 概述 257 8.2 认识scrollTo()和scrollBy()方法 258 8.3 Scroller类 264 8.4 平滑滚动的工作原理 271 8.5 案例:触摸滑屏 272 8.5.1 触摸滑屏的技术分析 272 8.5.2 速度跟踪器VelocityTracker 273 8.5.3 触摸滑屏的分步实现 274 8.6 练习作业 285 第九章 侧边栏 287 9.1 概述 287 9.2 使用二进制保存标识数据 289 9.2.1 位运算符 289 9.2.2 位运算的常用功能 292 9.3 继承自ViewGroup的侧边栏 293 9.4 继承自HorizontalScrollView的侧边栏 304 9.5 练习作业 312 第十章 加强版ListView 313 10.1 概述 313 10.2 ListView的基本使用 314 10.3 ListItem随手指左右滑动 318 10.4 向右滑动删除ListItem 326 10.5 滑动ListItem出现删除按钮 336 10.5.1 列表项专用容器ExtendLayout 337 10.5.2 列表项能滑出删除按钮的ListView 342 10.5.3 定义布局文件 350 10.5.4 显示ListView 351 10.6练习作业 353 案例代码说明 354

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值