圖形控件的繪製

控件的繪製

  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"/>
發佈了40 篇原創文章 · 獲贊 9 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章