Android圓形進度條-RoundProgressBar
阿新 • • 發佈：2019-01-01
RoundProgressBar
activity_welcomepublic class RoundProgressBar extends View { private Paint mPaint; private int mRoundColor; private int mRoundProgressColor; private float mRoundWidth; private int mMax; private int mTextColor; private float mTextSize; private boolean mTextIsDisplayable; private int mStyle; private static final int STROKE = 0; private static final int FILL = 1; private int mProgress = 0; public RoundProgressBar(Context context) { this(context,null); } public RoundProgressBar(Context context, AttributeSet attrs) { this(context,attrs,0); } public RoundProgressBar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); mPaint = new Paint(); //獲取自定義的屬性 TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.RoundProgressBar); mRoundColor = typedArray.getColor(R.styleable.RoundProgressBar_roundColor, Color.RED);//第二個引數均為預設值--圓的顏色 mRoundProgressColor = typedArray.getColor(R.styleable.RoundProgressBar_roundProgressColor, Color.RED);//進度條的顏色 mRoundWidth = typedArray.getDimension(R.styleable.RoundProgressBar_roundWidth, 3);//進度條的寬度 mMax = typedArray.getInteger(R.styleable.RoundProgressBar_max, 100);//進度條的最大值 mTextColor = typedArray.getColor(R.styleable.RoundProgressBar_textColor, Color.RED);//進度條的文字顏色 mTextSize = typedArray.getDimension(R.styleable.RoundProgressBar_textSize, 15);//進度條的文字大小 mTextIsDisplayable = typedArray.getBoolean(R.styleable.RoundProgressBar_textIsDisplayable, true);//進度條的百分比是否顯示 mStyle = typedArray.getInt(R.styleable.RoundProgressBar_style, 0);//--------------設定進度條是空心的 typedArray.recycle(); } //繪製 @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //第一步畫圓 int centerOfCircle = getWidth() / 2;//圓心 int radius = (int) (centerOfCircle - mRoundWidth / 2);//半徑 mPaint.setAntiAlias(true);//設定畫筆 mPaint.setColor(mRoundColor);//設定圓的顏色 mPaint.setStyle(Paint.Style.FILL);//設定圓是實心的還是空心的 mPaint.setStrokeWidth(mRoundWidth);//設定畫筆寬度 canvas.drawCircle(centerOfCircle,centerOfCircle,radius,mPaint);//畫圖 //第二步設定進度條 mPaint.setStrokeWidth(mRoundWidth);//畫筆寬度 mPaint.setColor(mRoundProgressColor);//設定進度 mPaint.setAntiAlias(true); RectF oval = new RectF(centerOfCircle - radius, centerOfCircle - radius, centerOfCircle + radius, centerOfCircle + radius); switch (mStyle) { case STROKE://進度條是空心的 mPaint.setStyle(Paint.Style.STROKE);//畫圓弧 canvas.drawArc(oval, 180, 360 * mProgress / mMax, false, mPaint);//開始的角度 break; case FILL://進度條是實心的 mPaint.setStyle(Paint.Style.FILL_AND_STROKE);//畫圓弧 if(mProgress!=0) { canvas.drawArc(oval, 180, 360 * mProgress / mMax, true, mPaint); } break; } //第三步設定字型 mPaint.setStrokeWidth(0);//畫百分比 mPaint.setTextSize(mTextSize);//字型大小 mPaint.setColor(mTextColor);//畫筆顏色 mPaint.setTypeface(Typeface.DEFAULT);//字型 mPaint.setTextAlign(Paint.Align.CENTER); float textY = centerOfCircle - (mPaint.descent() + mPaint.ascent()) / 2; if (mTextIsDisplayable) {//如果文字顯示那麼就開始寫文字 canvas.drawText("跳過", centerOfCircle, textY, mPaint); } //字型不顯示跳過顯示百分比 // int percent = (int) (((float) mProgress / (float) mMax) * 100); // float textWidth = mPaint.measureText(percent + "%"); // 判斷是否顯示進度文字 不是0，風格是空心的 // if (mTextIsDisplayable && percent != 0 && mStyle == STROKE) { // canvas.drawText(percent + "%", centerOfCircle - textWidth / 2, centerOfCircle + textWidth / 2, mPaint); // } } public int getRoundColor() { return mRoundColor; } public void setRoundColor(int roundColor) { mRoundColor = roundColor; } public int getRoundProgressColor() { return mRoundProgressColor; } public void setRoundProgressColor(int roundProgressColor) { mRoundProgressColor = roundProgressColor; } public float getRoundWidth() { return mRoundWidth; } public void setRoundWidth(float roundWidth) { mRoundWidth = roundWidth; } public int getTextColor() { return mTextColor; } public void setTextColor(int textColor) { mTextColor = textColor; } public float getTextSize() { return mTextSize; } public void setTextSize(float textSize) { mTextSize = textSize; } public synchronized int getMax() { return mMax; } public synchronized void setMax(int max) { mMax = max; } public boolean isTextIsDisplayable() { return mTextIsDisplayable; } public void setTextIsDisplayable(boolean textIsDisplayable) { mTextIsDisplayable = textIsDisplayable; } public int getStyle() { return mStyle; } public void setStyle(int style) { mStyle = style; } public synchronized int getProgress() { return mProgress; } public synchronized void setProgress(int progress) { if(progress < 0){ throw new IllegalArgumentException("progress not less than 0"); } if(progress > mMax){ mProgress=progress; } if(progress <= mMax){ mProgress = progress; postInvalidate(); } } }
一張圖片背景右上角有一個圓形進度條
WelcomeActivity:<RelativeLayout android:id="@+id/welcome_img" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@mipmap/welcome" android:layout_weight="2"> <view.RoundProgressBar android:id="@+id/progressBar" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:layout_width="37dp" android:layout_height="37dp" android:layout_marginRight="5dp" android:layout_marginTop="5dp" app:roundColor="#c7c7c7" app:roundProgressColor="#f41a29" app:roundWidth="1dp" app:textColor="#ffffff" app:textIsDisplayable="true" app:textSize="15sp" /> </RelativeLayout>
功能：當進度條滿100的時候，跳轉頁面public class WelcomeActivity extends AppCompatActivity implements View.OnClickListener{ //仿iphone帶進度的進度條，執行緒安全的View，可直接線上程中更新進度 private RoundProgressBar mRoundProgressBar; private static final String TAG = "welcome"; private int mProgress = 0; //主執行緒接收到子執行緒傳送過來的訊息 Handler handler = new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); mRoundProgressBar.setProgress(mProgress); Log.d(TAG,mRoundProgressBar.getProgress()+""); Log.d(TAG,mRoundProgressBar.getMax()+""); if (mProgress>=100){ Intent it = new Intent(WelcomeActivity.this,MainActivity.class); startActivity(it); } } }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_welcome); mRoundProgressBar = (RoundProgressBar) findViewById(R.id.progressBar); //進入歡迎介面後圓形滾動條開始滾動 initData(); //當點選滾動條上文字跳過的時候實現頁面直接跳轉 mRoundProgressBar.setOnClickListener(this); } private void initData() { //開啟子執行緒開始耗時操作 new Thread() { @Override public void run() { while (mProgress < 100) { mProgress=mProgress+2; //子執行緒給主執行緒傳送訊息更新UI handler.sendEmptyMessage(0); SystemClock.sleep(500); } } }.start(); } @Override public void onClick(View view) { switch (view.getId()){ case R.id.progressBar:{ Intent it = new Intent(WelcomeActivity.this,MainActivity.class); startActivity(it); } } } }
當點選進度條的時候直接跳轉頁面