系统自带的View有时候满足不了设计的要求，所以这时候往往都需要我们自定义View控件，实现方法如下：
新建一个自定义类（例如MyView）并继承自View，添加构造函数，自定义View的属性，重写onDraw，onMesure函数，下面一个一个来分析。
1、构造函数
三个构造函数分别为
public MyView(Context context){}public MyView(Context context, AttributeSet attrs){}<pre name="code" class="java">public MyView(Context context, AttributeSet attrs, int defStyle){}第二个，在xml布局文件中定义自己创建的View时，那么第二个参数便会将在xml里面设定好的属性传递给构造函数，也就是说，在xml布局里面声明自己的View时，就会用到第二个构造函数。（此函数较为常用）
第三个，这第三个函数系统是不会默认调用的，而是由我们自己来显式调用，defStyle这个参数即是样式，可以是一个style资源。
2、自定义View的属性
自定义属性需要在values文件下面建一个attrs.xml，其内容为，标签declare-styleable的name为所定义属性的所属控件（例如MyView），标签attr声明自定义View的属性名name及属性的类型format。以下是常用的属性类型和使用格式：
(1)字符串format="string" myview:text="Hello"
(2)颜色format="color" myview:textColor="#ffffff"
(3)尺寸大小format="dimension" myview:textSize="0dp"
(4)引用format="reference" myview:background="@drawable/资源ID"
(5)整形format="integer" myview:intNum="10"
3、重写onDraw和onMesure函数
在onDraw中，其参数为Canvas对象，可以用来绘制图像单元，从而达到自定义UI界面的效果
需要画什么东西都是给Canvas处理，例如矩形，圆形，线条等形状。
怎么画都是给Paint处理，例如形状的颜色，样式等。
在onMesure中，有两个值，分别是widthMeasureSpec和heightMeasureSpec，代表了控件的宽和高，即绘制的时候，View控件占用的宽度和高度。
4、另外再谈下其它关键的一些类
TypedArray类，与Context类的obtainStyledAttributes函数一起使用，通过obtainStyledAttributes来获取一个TypedArray类的对象，然后用此对象来对属性进行一些设置，例如
text = typedArray.getString(R.styleable.MyView_text);最后要调用typedArray.recycle();
接下来我们以一个demo来看看效果，首先是我们自定义的类，继承自View
我在构造函数中加入了一个线程，以此来一直更新时间信息
MyView.java
public class MyView extends View implements Runnable{
private Paint mPaint;
private String text; //文本内容
private float textSize; //文本大小
private int textColor; //文本颜色
private Handler handler;
private Rect mBound;
public MyView(Context context){
super(context);
}
//使用第二个构造函数，因为需要在xml布局中设置View
public MyView(Context context, AttributeSet attrs){
super(context, attrs);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyView); //用TypedArray来获取各个属性
text = typedArray.getString(R.styleable.MyView_text); //获取文本信息
textSize = typedArray.getDimensionPixelSize(R.styleable.MyView_textSize, (int) TypedValue.applyDimension( //获取文本大小
TypedValue.COMPLEX_UNIT_SP, 16, getResources().getDisplayMetrics()));
textColor = typedArray.getColor(R.styleable.MyView_textColor, Color.BLACK); //获取文本颜色
typedArray.recycle();
handler = new Handler() {
public void handleMessage(Message msg){
text = (String)msg.obj;
}
};
new Thread(this).start();
}
@Override
public void run(){
try {
while (true){
SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss"); //设置适配日期
String str = simpleDateFormat.format(new Date()); //给日期传值
handler.sendMessage(handler.obtainMessage(100, str));
postInvalidate(); //用此方法来更新activity
Thread.sleep(500);
}
}catch (InterruptedException e){
e.printStackTrace();
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
@Override
protected void onDraw(Canvas canvas){
super.onDraw(canvas);
mPaint = new Paint();
mBound = new Rect();
//获得绘制文本的宽和高
mPaint.setTextSize(textSize);
mPaint.getTextBounds(text, 0, text.length(), mBound);
//设置矩形颜色
mPaint.setColor(Color.YELLOW);
//画矩形,前两个是矩形左上角坐标,后两个是右下角坐标
canvas.drawRect(new Rect(0, 0, getMeasuredWidth(), getMeasuredHeight()), mPaint);
//设置文本颜色
mPaint.setColor(Color.RED);
canvas.drawText(text, getWidth() / 2 - mBound.width() / 2, getHeight() / 2 + mBound.height() / 2, mPaint); //让文本位于矩形中间
}
}
设置了文本，颜色，尺寸等属性
attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="MyView">
<attr name="text" format="string"/>
<attr name="textColor" format="color"/>
<attr name="textSize" format="dimension"/>
</declare-styleable>
</resources>布局文件
设置控件的位置位于中心
为了使控件能够移动，必须加上android:clickable="true"
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:myview="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.example.cheng.myapplication.MyView
android:id="@+id/num"
android:layout_width="300dp"
android:layout_height="50dp"
myview:textColor="#ff0000"
android:clickable="true"
android:layout_centerInParent="true"
myview:textSize="20sp"/>
</RelativeLayout>主Activity的java代码，移动控件主要在这里实现,参照了网上的例子，理解其实现原理与计算方式，自己的理解都在后面加了注释说明
设置一个Touch监听，通过手指的移动来控制控件的移动
MainActivity.java
public class MainActivity extends Activity implements View.OnTouchListener{
private int screenWidth;
private int screenHeight;
private int lastX;
private int lastY;
private MyView myView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
screenWidth = displayMetrics.widthPixels; //得到屏幕的宽度
screenHeight = displayMetrics.heightPixels - 50; //得到屏幕的高度,减去50是为了排除屏幕顶部的状态栏
myView = (MyView) findViewById(R.id.num);
myView.setOnTouchListener(this);
}
@Override
public boolean onTouch(View v, MotionEvent event){
int action = event.getAction();
switch (action){
case MotionEvent.ACTION_DOWN: //手指刚触摸的事件
//得到手指刚触摸时的位置,其实就是控件的初始位置
lastX = (int) event.getRawX();
lastY = (int) event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
//手指移动后的位置减去控件初始的位置,就得到移动的距离
int dx = (int) event.getRawX() - lastX;
int dy = (int) event.getRawY() - lastY;
//控件的最终位置,由起始位置加上移动的距离得到
int left = v.getLeft() + dx;
int top = v.getTop() + dy;
int right = v.getRight() + dx;
int bottom = v.getBottom() + dy;
//判断是否超出边界
if(left < 0){
left = 0;
right = left + v.getWidth();
}
if(right > screenWidth){
right = screenWidth;
left = right - v.getWidth();
}
if(top < 0){
top = 0;
bottom = top + v.getHeight();
}
if(bottom > screenHeight){
bottom = screenHeight;
top = bottom - v.getHeight();
}
//设置其控件的最终位置
v.layout(left, top, right, bottom);
//再次得到控件的位置,便于下次拖动时使用
lastX = (int) event.getRawX();
lastY = (int) event.getRawY();
break;
}
return false;
}
}运行效果如下
初始位置
移动后的位置
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
