自定義View實現箭頭沿圓轉動

TTMMJJ99發表於2017-11-18
//MyCircleView類
public class MyCircleView extends View{
    //當前畫筆畫圓的顏色
    private int CurrenCircleBoundColor;
    private Paint paint;
    ////從xml中獲取的顏色
    private int circleBundColor;
    private float circleBoundWidth;
    private float pivotX;
    private float pivotY;
    private float radius=130;
    private float currentDegree=0;
    private int currentSpeed=1;
    private boolean isPause=false;
    public MyCircleView(Context context) {
        super(context);
        initView(context);
    }

    public MyCircleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        initView(context);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyCircleView);
        for (int i = 0; i < typedArray.getIndexCount(); i++) {
            //就是我們自定義的屬性的資源id
            int attr = typedArray.getIndex(i);
            switch (attr){
                case R.styleable.MyCircleView_circlr_bound_color:
                    circleBundColor = typedArray.getColor(attr, Color.RED);
                    CurrenCircleBoundColor=circleBundColor;
                    break;
                case R.styleable.MyCircleView_circlr_bound_width:
                    circleBoundWidth = typedArray.getDimension(attr, 3);
                    break;

            }
        }
    }

    public MyCircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context);

    }
    private void initView(Context context){
        paint = new Paint();
    }
    public void setColor(int color){
        if (CurrenCircleBoundColor!=color){
            CurrenCircleBoundColor=color;
        }else {
            CurrenCircleBoundColor=circleBundColor;
        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paint.setAntiAlias(true);
        paint.setColor(CurrenCircleBoundColor);
        paint.setStrokeWidth(circleBoundWidth);
        paint.setStyle(Paint.Style.STROKE);
        pivotX = getWidth() / 2;
        pivotY = getHeight() / 2;
        canvas.drawCircle(pivotX,pivotY,radius,paint);
        canvas.save();
        //旋轉畫布 , 如果旋轉的的度數大的話,視覺上看著是旋轉快的
        canvas.rotate(currentDegree,pivotX,pivotY);
        //提供了一些api可以用來畫線(畫路徑)
        Path path = new Path();
        //從哪開始畫 從A開始畫
        path.moveTo(pivotX+radius,pivotY);
        //從A點畫一個直線到D點
        path.lineTo(pivotX+radius-20,pivotY-20);
        //從D點畫一個直線到B點
        path.lineTo(pivotX+radius,pivotY+20);
        //從B點畫一個直線到C點
        path.lineTo(pivotX+radius+20,pivotY-20);
        //閉合  --  從C點畫一個直線到A點
        path.close();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.BLACK);
        canvas.drawPath(path,paint);
        canvas.restore();
        //旋轉的度數一個一個度數增加,  如果乘以一個速度的話,按一個速度速度增加
        currentDegree+=1*currentSpeed;
        if (!isPause){
            invalidate();
        }
    }
    public void speed(){
        ++currentSpeed;
        if (currentSpeed>=10){
            currentSpeed=10;
            Toast.makeText(getContext(),"我比閃電還快",Toast.LENGTH_SHORT).show();
        }
    }
    public void slowDown(){
        --currentSpeed;
        if (currentSpeed<=1){
            currentSpeed=1;
        }
    }
    public void pauseOrStart(){
        //如果是開始狀態的話去重新繪製
        if (isPause){
            isPause=!isPause;
            invalidate();
        }else {
            isPause=!isPause;
        }
    }
}



//主頁面
public class MainActivity extends AppCompatActivity {
    //全域性變數
    private MyCircleView my_view;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //找控制元件
        my_view = (MyCircleView) findViewById(R.id.my_view);
    }
    public void onClick(View view){
        my_view.setColor(Color.BLUE);
    }
    public void add(View view){
        my_view.speed();
    }
    public void slow(View view){
        my_view.slowDown();
    }
    public void pauseOrStart(View view){
        my_view.pauseOrStart();
    }
}



主頁面佈局
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"

    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.lx_20170928.MainActivity">

    <Button
        android:id="@+id/set_color_btn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:onClick="onClick"
        android:text="設定顏色" />

    <Button
        android:id="@+id/add"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/set_color_btn"
        android:layout_centerHorizontal="true"
        android:onClick="add"
        android:text="加速" />

    <Button
        android:id="@+id/slow"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/add"
        android:layout_centerHorizontal="true"
        android:onClick="slow"
        android:text="減速" />

    <Button
        android:id="@+id/pause_or_start"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/slow"
        android:layout_centerHorizontal="true"
        android:onClick="pauseOrStart"
        android:text="暫定/開始" />
     <com.example.lx_20170928.MyCircleView
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:id="@+id/my_view"
         android:layout_centerInParent="true"
         app:circlr_bound_color="@color/colorAccent"
         app:circlr_bound_width="3dp"
         />


</RelativeLayout>




//在values建一個attrs.xml
<resources>
    <declare-styleable name="MyCustomCircleArrowView">
        <attr name="circlr_bound_width" format="dimension"></attr>
        <attr name="circlr_bound_color" format="color"></attr>
    </declare-styleable>
</resources>


轉自:http://blog.csdn.net/zhao__na/article/details/78123288

相關文章