Android之 控件的绘制

控件的绘制

1. View 和 ViewGroup

2. View --> 功能性的，TextView ，ImageView

3. ViewGroup --> 管理View，LinearLayout，Relativelayout

4. measure--->onMeasure-->layout--->onLayout-->draw--->onDraw

5. draw,onDraw : 决定控件长什么样子

6. draw : 画背景

7. onDraw :

下面举个例子来看一下怎么画三角形：（多边形同理）

先定义一个类继承View，实现里面的所有构造函数

初始化颜料和线段：

private Path path=new Path();
private Paint paint=new Paint();

定义一个方法对path和paint进行设置图形参数

private void init()
{
    //三角形三个点确定一个形状
    path.moveTo(150, 20);//起始点
    path.lineTo(30, 120);//连接第二个点
    path.lineTo(280,120);//连接第三个点
    path.lineTo(150, 20);//连接第一个点
    
    paint.setColor(Color.RED); //图形颜色
    paint.setAntiAlias(true); //去锯齿
    paint.setStyle(Style.STROKE); //画空心
    paint.setStrokeWidth(3); //空心外围宽度
    paint.setAlpha(150);//设置颜色透明度0——255之间
    
    
}

重写onDraw(Canvas canvas)方法，画图形

@Override
protected void onDraw(Canvas canvas)
{
    //画多边形（三角形）
    canvas.drawPath(path, paint);
    
    
}

就这样，图形就画完成了，在布局中使用：

    <com.cca.drawdemo.DrawView
    android:id="@+id/draw"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
  />

绘制可点击的进度条

先定义一个类继承Button

实现里面的构造函数，定义一个方法设置进度条，并重写onDraw()方法

public class ProgressButton extends Button
{
    private int progress;
    private Drawable drawable;

    public ProgressButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        drawable=context.getResources().getDrawable(R.drawable.progress_btn_normal);
        
    }

    public ProgressButton(Context context) {
        super(context);
        drawable=context.getResources().getDrawable(R.drawable.progress_btn_normal);
        
    }
    
    public void setProgress(int progress){
        this.progress=progress;
        
        //UI更新
        invalidate();
    }
    
    @Override
    protected void onDraw(Canvas canvas)
    {
        super.onDraw(canvas);
        //背景
        //进度条
        
        int right=(int) (getMeasuredWidth()*progress/100f+0.5f);
        
        //1、设置形状
        //drawable.setBounds(left, top, right, bottom)
        drawable.setBounds(0, 0, right, getMeasuredHeight());
        
        //2、画到canvas上
        drawable.draw(canvas);
        
    }

}

在主函数中使用异步加载Asyn，在这里获得进度更新的数据，推送到主线程中更新UI

    public class MainActivity extends Activity
    {
    
        private ProgressButton  progressbut;
    
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            
            progressbut = (ProgressButton) findViewById(R.id.progress);
            AsyncTask<Void, Integer, Void> task=new AsyncTask<Void, Integer, Void>(){
                @Override
                protected Void doInBackground(Void... params)
                {
                    //执行在子线程中
                    for(int i=0;i<=100;i++){
                        try
                        {
                            Thread.sleep(200);
                        }
                        catch (InterruptedException e)
                        {
                            
                            e.printStackTrace();
                        }
                        //将进度推送出去
                        publishProgress(i);
                    }
                    return null;
                }   
                @Override
                protected void onProgressUpdate(Integer... values)
                {
                    super.onProgressUpdate(values);
                    
                    Integer progress=values[0];
                    progressbut.setProgress(progress);
                    progressbut.setText(progress+"%");
                    progressbut.setTextColor(Color.WHITE);
                }
            };
            task.execute();
            
        }
    }

使用时的布局：

      <com.cca.drawdemo.ProgressButton 
      android:id="@+id/progress"
      android:background="@drawable/progress_bg"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"/>