好记性不如烂博客,古人诚不欺我。
作为 花里胡哨系列的第一篇
,聊点五毛钱的,之所以写这个自定义系列文章,主要还是希望大家,也包括自己,以后能在面对产品脑洞和炫酷的设计时,能说一句不要问我能不能实现,就问你想不想要
。同时也想把自己在这方面所知道的,走过的路以及踩过的坑和大家分享一下。
我们先来写一个最简单的自定义 View
,我觉得只要接触过 Android
开发,哪怕就一个月,也知道要写一个类继承 View
,对吧,我们来看看:
public class CircleView extends View {
}
这个时候 AS
会报错,傻子也知道根据提示,快捷键然后那么一回车,就变成了这样:
public class CircleView extends View {
public CircleView(Context context) {
super(context);
}
public CircleView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
}
我最开始接触的时候,当时心想,什么嘛,什么都没做,就要添加 4
个构造方法,最后一个构造方法名还是灰色的,好吧,不知道问度娘,它来帮你搞定,一番左查右查,就有了下面的解释:
public class CircleView extends View {
//如果此自定义View是在Java代码里面new的,则调用第一构造函数
public CircleView(Context context) {
super(context);
}
//如果View是在.xml里声明的,则调用第二个构造函数,自定义属性是从AttributeSet参数传进来的
public CircleView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
//不会自动调用,一般是在第二个构造函数里主动调用,如View有style属性时
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
//API21之后才使用,不会自动调用,一般是在第二个构造函数里主动调用,如View有style属性时
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
}
看过了解释后,可能有的人就疑问了,我的项目里不是这样写的呀,好像是这样的:
public class CircleView extends View {
//如果此自定义View是在Java代码里面new的,则调用第一构造函数
public CircleView(Context context) {
this(context, null);
}
//如果View是在.xml里声明的,则调用第二个构造函数,自定义属性是从AttributeSet参数传进来的
public CircleView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
//不会自动调用,一般是在第二个构造函数里主动调用,如View有style属性时
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
}
这边来说明一下,4 个参数的构造函数就不考虑了,别问,问就是不考虑,原因上面也解释了。现在看一下 3 个参数的构造函数。
在 3 个参构造函数中,第 3 个参数是默认的 Style
,,这里的默认的 Style
是指它在当前 Application
或 Activity
所用的 Theme
中的默认 Style
,且只有在明确调用的时候才会生效。有一点需要注意的,即使你在 View
中使用了 Style
这个属性也不会调用 3 个参数的构造函数,所调用的依旧是 2 个参数的构造函数。
由于 3 个参数的构造函数第 3 个参数一般不用,所以暂不考虑。那么我们需要关注的就是前两个构造函数了。
1
参的构造函数:你在类中new
这个自定义View
的时候调用。2
参构造函数:你在xml
文件中声明后,使用时会调用。
前面罗里吧嗦的说了一堆有的没的,不如直接来写一个最简单的自定义 View
来感受一下,代码很简单,创建 Paint
对象并初始化,同时在 onDraw()
方法中绘制你想要的自定义 View
:
public class CircleView extends View {
private Paint mPaint;
//如果此自定义View是在Java代码里面new的,则调用第一构造函数
public CircleView(Context context) {
this(context, null, 0);
}
//如果View是在.xml里声明的,则调用第二个构造函数,自定义属性是从AttributeSet参数传进来的
public CircleView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
//不会自动调用,一般是在第二个构造函数里主动调用,如View有style属性时
public CircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mPaint = new Paint();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//绘制一个圆
canvas.drawCircle(300,300,200,mPaint);
}
}
同时,我们在 xml
中 声明该自定义 View
:
<com.kww.bells_and_whistles.view.CircleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
现在我们运行后看一下效果:
可以看到我们画了一个黑色的圆,还不错。如果我这个时候和你说,朋友,你已经会了自定义 View
,可以尽情的玩耍了,你肯定会给我一个白眼。
哈哈,确实,这是一个最简单的自定义 View
,但是,这其中有一些概念,是我们不知道的,比如说 Paint
是什么,然后 onDraw()
方法又是什么,drawCircle()
方法里面的参数都是什么含义,这些东西,如果我们是刚接触的话,肯定一无所知。
既然是第一篇,说到这就可以了,我认为,不能一上来就下猛药对吧,还是要讲究循序渐进的,让你对自定义 View
有个印象就行了,看完之后,有种 “哦,这就是自定义View
”的感觉就行了。
最后
在接下来的文章中,我会继续以简单通俗的方式给你带来自定义 View
的方方面面,毕竟,我们的目的是在产品和设计面前,腰杆子挺直,面对花里胡哨的效果,有种云淡风轻(zhuang bi
)的状态。