自定义视图
1. 自定义一个带有颜色属性的view视图
/** * Created by ZhouXiaoHai on 2016/9/20. * * 自定义视图 * ①定义MyRect视图 */ public class MyRect extends View { // 继承视图 public MyRect(Context context) { super(context); } public MyRect(Context context, AttributeSet attrs) { super(context, attrs); // 通过TypedArray来获取我们定义styleable中的属性值 // R.styleable.MyRect 是我们创建的attr.xml中的下面代码中的MyRect /* <declare-styleable name="MyRect" > <attr name="rect_color" format="color"></attr> </declare-styleable> * */ TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MyRect); // 通过属性来定义颜色 MyRect_rect_color 是指的 declare-styleable标签name和attr的name组合 int color = ta.getColor(R.styleable.MyRect_rect_color, 0xffff0000); // 改变这个视图的颜色 this.setBackgroundColor(color); // 回收资源 ta.recycle(); } }
<?xml version="1.0" encoding="utf-8"?> <!-- 在values中创建 attrs.xml 这里的MyRect可以任意设置,不需要和MyRect类名字一样 --> <resources> <declare-styleable name="MyRect" > <!-- 定义属性 format有很选择,要根据实际情况--> <attr name="rect_color" format="color"></attr> </declare-styleable> </resources>
使用我们定义的MyRect视图
<?xml version="1.0" encoding="utf-8"?> <!-- xmlns:chengzhier 可以自己设置了,才会有下面的chengzhier:rect_color属性 --> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:chengzhier="http://schemas.android.com/apk/res-auto" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:weightSum="1"> <!-- chengzhier:rect_color就是我们自己定义的 --> <com.aaa.chengzhier.MyRect android:layout_width="100dp" android:layout_height="100dp" android:layout_weight="0.15" chengzhier:rect_color="#ff0000ff" /> </LinearLayout>
效果:
2. 自定义一个点击换色的按钮控件
① 在drawable目录下面添加两张按钮的北京2图片, ba1.jpg,ba2.jpg
② 在drawable目录下面创建button_skin.xml文件
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 当按钮未点击时用ba1.jpg --> <item android:state_pressed="false" android:drawable="@drawable/ba1"></item> <!-- 当按钮点击时用ba2.jpg --> <item android:state_pressed="true" android:drawable="@drawable/ba2"></item> <!-- 按钮还有很多的状态 可以自己看看 --> </selector>
③定义的按钮,使用背景
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:weightSum="1"> <!-- 使用按钮的时候,背景直接用定义的 button_skin --> <Button android:background="@drawable/button_skin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button" android:id="@+id/button" /> </LinearLayout>
④ 效果
没有点击的按钮
点击中的按钮
3. 制作一个旋转的正方形视图
RotatingRect.java
public class RotatingRect extends View { //继承视图 public RotatingRect(Context context) { super(context); this.initProperties(); } public RotatingRect(Context context, AttributeSet attrs) { super(context, attrs); this.initProperties(); } public RotatingRect(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); this.initProperties(); } private void initProperties() { this.p = new Paint(); // new一个画笔 p.setColor(Color.RED); // 设置为红色 } // 重写draw方法,View会自动的调用这个方法 @Override public void draw(Canvas canvas) { super.draw(canvas); canvas.translate(200, 200); // 距离左边200 上面200 canvas.rotate(this.degrees, 50, 50); // 转动角度 和 在哪里转动 canvas.drawRect(0, 0, 100, 100, this.p); // 绘制一个正方形 this.degrees ++; // 使这个 view 无效, 应用程序会在次查看这个view是否绘制,如果没有就在绘制一次(执行draw方法) this.invalidate(); } private Paint p; private int degrees = 0; }
在xml文件视图中使用
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:weightSum="1"> <com.aaa.chengzhier.RotatingRect android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout>
效果:
红色的方形一直在转动.