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

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)解析得到这个属性,并且利用,一般解析是在构造方法中

 

posted @ 2017-12-09 15:06  鹏达君  阅读(1095)  评论(0编辑  收藏  举报