自定义View——入门继承View的实例

Posted 2020-10-17 鹏达君

1.实例建造过程

1)BaseView(抽象类）

package com.myview.v3;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;

/**
 * Created by 刘鹏达 on 2017/10/15.
 */

/*
图形的变化一定是使用了线程不断的变化显示的内容，那么为了实现这个效果，通常会把改变属性设置为成员变量，
然后在内部线程类中去改变，并且把改变的属性调用其他方法从而显示。接下来，我们进行抽离和封装

抽离：
核心就是将显示方法和线程变动的参数抽离出来。

封装就是：将这些方法抽离出来封装到一个类中，从而实现

 */
public abstract class  BaseView extends View{

    private MyThread thread;

    public BaseView(Context context, AttributeSet attributeSet){
        super(context,attributeSet);
    }

    public BaseView(Context context){
        super(context);
    }

    protected void onDraw(Canvas canvas){
        if(thread==null){
            thread=new MyThread();
            thread.start();
        }else {
            drawSub(canvas);
        }
    }

    class MyThread extends Thread{
        public void run(){
            while(true){
                logic();
                postInvalidate();//刷新的方法，刷新之后调用OnDraw()方法
                try{
                    Thread.sleep(30);
                }catch (InterruptedException e){
                    e.printStackTrace();
                }

            }
        }
    }
    protected abstract void drawSub(Canvas canvas);
    protected abstract void logic();

}

 

2)书写自定义view的属性（在res文件夹的values文件夹里面建一个attrs.xml文件，其一般会在自定义view中的布局构造方法也就是两个参数的构造方法中被解析引用）

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="NumText">
        <attr name="LineNum" format="integer"></attr>
        <attr name="b" format="boolean"/>
    </declare-styleable>
</resources>

 

3)NumText（自定义view类）

package com.myview.v4;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;

import com.example.myview.R;
import com.myview.v3.BaseView;

/**
 * Created by 刘鹏达 on 2017/10/15.
 */
public class NumText extends BaseView {
   Paint paint=new Paint();
    int lineNum=0;
    float x=0;
    boolean b=false;
    public NumText(Context context, AttributeSet attributeSet){
        super(context,attributeSet);
        TypedArray ta=context.obtainStyledAttributes(attributeSet, R.styleable.NumText);
        lineNum=ta.getInt(R.styleable.NumText_LineNum,1);
        b=ta.getBoolean(R.styleable.NumText_b,false);
        ta.recycle();
    }

    public NumText(Context context){
        super(context);
    }
    @Override
    protected void drawSub(Canvas canvas) {
      for(int i=0;i<lineNum;i++){
          int textSize=30+i;
          paint.setTextSize(textSize);
          canvas.drawText("极客学院",x,textSize+textSize*i,paint);
      }
    }

    @Override
    protected void logic() {
        x+=3;
        if(x>getWidth()){
            x=-paint.measureText("极客学院");
        }
    }
}

 

 

4）引用自定义view

布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:nt="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:layout_width="match_parent">
   <com.myview.v4.NumText
       nt:LineNum="3"
       nt:b="true"
       android:layout_width="match_parent"
       android:layout_height="wrap_content" />


</LinearLayout>

 

activity：

package com.example.myview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.myview.v3.LoginView;
import com.myview.v3.MyText;
import com.myview.v4.NumText;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //setContentView(new MyView(this);这个方法也可以实现显示自定义组件，其是利用了自定义组件的组件构造函数
    }
}

 

总结：
1.自定义组件常见步骤：
1）写好该组件继承view或者其他组件
2）写好两个构造函数，一个用于布局（一般这边会用来解析属性文件），一个用于组件（当然还有三个参数的构造方法，这边先跳过）
3）写好onDraw()方法进行绘字，绘线，绘图
4）在布局文件中引入该布局，记住包名要写上，或者直接在Java中引用我们的组件

2.使用线程的组件
核心：用于该组件的是动态图。
具体步骤为：
1）写好BaseView，里面有两个方法抽象，分别是显示方法和改变参数方法
而在线程中直接调用这两个方法再重新调用ondraw()方法，而在ondraw()方法
中如果线程为空，那么实例化线程，并且启动，如果不为空，直接调用显示方法
2）写一个组件继承BaseView并且实现这两个抽象方法
3）在布局文件中引入该组件，并且显示



3.自定义属性并且使用
1）先建立一个attr.xml的自定义属性文件
2）设置命名空间（空间名为项目名，也就是manifest中的包名），然后
根据这个空间引用属性并且赋值。
3）解析得到这个属性，并且利用，一般解析是在构造方法中