本文實例為大家分享了Android自定義view制作抽獎轉盤的具體代碼,供大家參考,具體內容如下
效果圖
TurntableActivity
package com.bawei.myapplication.turntable;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.MotionEvent;import android.view.View;import android.view.animation.RotateAnimation;import com.bawei.myapplication.R;import com.bawei.myapplication.turntable.CustomTurntableView;/** * 轉盤 * @author hasee */public class TurntableActivity extends AppCompatActivity { CustomTurntableView customTurntableView; boolean isTouchInSide = false; float mDownX, mDownY; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_turntable); initView(); } private void initView() { customTurntableView = findViewById(R.id.custom);// findViewById(R.id.custom_inside).setOnClickListener(new View.OnClickListener() {// @Override// public void onClick(View v) {// float degrees = (float)(720 + Math.random() * 1000);// RotateAnimation rotateAnimation = new RotateAnimation(0, -degrees, 450, 450);// rotateAnimation.setDuration(5000);// rotateAnimation.setFillAfter(true);// customCircleView.startAnimation(rotateAnimation);// }// }); findViewById(R.id.custom_inside).setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { if (event.getAction() == MotionEvent.ACTION_DOWN && event.getX() > 200 && event.getX() < 300 && event.getY() > 200 && event.getY() < 300) { isTouchInSide = true; mDownX = event.getX(); mDownY = event.getY(); return true; }else if(event.getAction() == MotionEvent.ACTION_MOVE && ( event.getX() < mDownX -10 || event.getX() > mDownX + 10 || event.getY() < mDownY -10 || event.getY() > mDownY + 10) ){ isTouchInSide = false; } else if (event.getAction() == MotionEvent.ACTION_UP && event.getX() > mDownX -10 && event.getX() < mDownX + 10 && event.getY() > mDownY -10 && event.getY() < mDownY + 10 && isTouchInSide) { float degrees = (float) (720 + Math.random() * 1000); RotateAnimation rotateAnimation = new RotateAnimation(0, -degrees, 250, 250); rotateAnimation.setDuration(5000); rotateAnimation.setFillAfter(true); customTurntableView.startAnimation(rotateAnimation); } isTouchInSide = false; return false; } }); }}
對應的布局
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/ll" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <com.bawei.myapplication.turntable.CustomTurntableView android:id="@+id/custom" android:layout_width="wrap_content" android:layout_height="500dp" /> <com.bawei.myapplication.turntable.CustomTurntableInsideView android:id="@+id/custom_inside" android:layout_width="wrap_content" android:layout_height="500dp" app:text="開始" android:background="#3300ff00" /></RelativeLayout>
自定義CustomTurntableView繼承view
package com.bawei.myapplication.turntable;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Path;import android.graphics.RectF;import android.support.annotation.Nullable;import android.util.AttributeSet;import android.view.View;/** * 這里是畫轉盤的 * @author hasee */public class CustomTurntableView extends View{ Paint mPaint; int mCircleCount = 6; float mStartAngle = 0; RectF rectF; public CustomTurntableView(Context context) { super(context); init(); } public CustomTurntableView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); init(); } private void init(){ mPaint = new Paint(); mPaint.setColor(Color.BLUE); mPaint.setStrokeWidth(10); mPaint.setTextSize(60); mPaint.setStyle(Paint.Style.FILL); rectF = new RectF(); rectF.top = 100; rectF.left = 100; rectF.right = 400; rectF.bottom = 400; } String[] textColor = {"一 等 獎","二 等 獎","三 等 獎","四 等 獎","五 等 獎","六 等 獎"}; @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); for(int i = 0; i < mCircleCount; i++){ //按角標單雙號設置扇形顏色, if(i % 2 == 0 ){ mPaint.setColor(Color.BLUE); }else{ mPaint.setColor(Color.GREEN); } canvas.drawArc(rectF, mStartAngle, 60, true, mPaint); //設置轉盤上的文字 mPaint.setColor(Color.BLACK); mPaint.setTextSize(20); Path path = new Path(); path.addArc(rectF,mStartAngle+20,60); canvas.drawTextOnPath(textColor[i],path,-10,40,mPaint); mStartAngle += 60; } }}
自定義CustomTurntableInsideView繼承view
package com.bawei.myapplication.turntable;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.RectF;import android.support.annotation.Nullable;import android.util.AttributeSet;import android.view.View;import com.bawei.myapplication.R;/** * 轉盤中間開始按鈕和指針 * @author hasee */public class CustomTurntableInsideView extends View { /** * 畫筆 */ Paint mPaint; RectF mRectF; String mStr; public CustomTurntableInsideView(Context context) { super(context); init(); } public CustomTurntableInsideView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); //自定義屬性,如何添加自定義屬性如下(考點) //第一步:在values文件夾下創建attrs.xml //第二步:詳見attrs.xml文件內部 //第三步:在所在的布局文件的根layout中添加xmlns:app="http://schemas.android.com/apk/res-auto" //第四步:在布局文件的控件中添加app:"你在attrs中設置的attr name"="你的值" //第五步:調用下面這句話,最后的為R.styleable.你在attrs中設置的declare-styleable name TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CustomTurntableView); //第六步:調用下面這句話,根據你在attrs中設置的format,選擇getXXX方法, //入參為 R.styleable. 加上 你在attrs中設置的declare-styleable name 加上 _ 加上 你在attrs中設置的attr name mStr = typedArray.getString(R.styleable.CustomTurntableView_text); init(); } private void init() { //以下注釋請看CustomBingView里面 mPaint = new Paint(); mPaint.setColor(Color.RED); mPaint.setStrokeWidth(10); mPaint.setTextSize(20); mPaint.setStyle(Paint.Style.FILL); mRectF = new RectF(); mRectF.top = 50; mRectF.bottom = 300; mRectF.right = 300; mRectF.left = 200; } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec);// setMeasuredDimension(300, 300); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //設置畫筆顏色為黑色, mPaint.setColor(Color.BLACK); //畫出指針,用一個扇形,然后蓋住后面補分來簡單表示 canvas.drawArc(mRectF, 60, 60, true, mPaint); mPaint.setColor(Color.RED); //畫一個紅色的圓形,就是中間的大按鈕 canvas.drawCircle(250, 250, 50, mPaint); mPaint.setColor(Color.BLACK); //添加按鈕上的文字 canvas.drawText(mStr, 230, 260, mPaint); //畫三角,第一步,創建路徑// Path path = new Path(); //第二步,moveTo第一個頂點// path.moveTo(300, 300); //后續相繼lineTo其他頂點// path.lineTo(300, 400);// path.lineTo(400, 400); //閉合// path.close();// 畫// canvas.drawPath(path, mPaint); }}
自定義屬性attrs.xml
<?xml version="1.0" encoding="utf-8"?><resources> <!-- name為想要調用這個屬性的類名即可 --> <declare-styleable name="CustomTurntableView"> <!-- name為屬性的名字,可以隨意起,只要符合規則看得懂 --> <!-- format為屬性內容的類型 --> <attr name="text" format="string"></attr> </declare-styleable></resources>
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持VEVB武林網
新聞熱點
疑難解答