您好,登錄后才能下訂單哦!
本篇內(nèi)容主要講解“Android如何實(shí)現(xiàn)簡(jiǎn)單實(shí)用的垂直進(jìn)度條”,感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“Android如何實(shí)現(xiàn)簡(jiǎn)單實(shí)用的垂直進(jìn)度條”吧!
支持屬性:
progress_radius 進(jìn)度條圓角大小
progress_border_enable 進(jìn)度條是否有邊框
progress_gradient_enable 進(jìn)度條顏色是否漸變
progress_start_color 從上到下進(jìn)度條開(kāi)始的漸變色
progress_end_color 從上到下進(jìn)度條結(jié)束的漸變色
progress_solid_color 帶邊框進(jìn)度條的背景填充色
progress_border_color 進(jìn)度條邊框的顏色
progress_border_width 進(jìn)度條邊框的寬度
有需要定義其他屬性的,可以進(jìn)行擴(kuò)充下面是效果圖
上代碼
VerticalProgress
public class VerticalProgress extends View { //進(jìn)度條圓角 private int mRadius; //進(jìn)度條是否有邊框 private boolean mBorderEnable; //是否有漸變色 private boolean mGradientEnable; //漸變色 private int mStartResId; private int mEndResId; //邊框的顏色 private int mBorderColorResId; //進(jìn)度條背景填充色 private int mProgressBgColorId; //邊框?qū)挾? private int mBorderWidth; private int mProgress = 10; private int max = 100; private int mWidth; private int mHeight; private RectF mRectF; private Paint mPaint; public VerticalProgress(Context context) { super(context); init(context, null); } public VerticalProgress(Context context, @Nullable AttributeSet attrs) { super(context, attrs); init(context, attrs); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); mWidth = getMeasuredWidth() - 1;// 寬度值 mHeight = getMeasuredHeight() - 1;// 高度值 } private void init(Context context, AttributeSet attrs) { TypedArray typedArray = null; if (attrs != null) { typedArray = context.obtainStyledAttributes(attrs, R.styleable.verticalProgress); mRadius = typedArray.getInt(R.styleable.verticalProgress_progress_radius, 0); mBorderEnable = typedArray.getBoolean(R.styleable.verticalProgress_progress_border_enable, false); mGradientEnable = typedArray.getBoolean(R.styleable.verticalProgress_progress_gradient_enable, true); mStartResId = typedArray.getResourceId(R.styleable.verticalProgress_progress_start_color, R.color.colorPrimary); mProgressBgColorId = typedArray.getResourceId(R.styleable.verticalProgress_progress_solid_color, R.color.white); mEndResId = typedArray.getResourceId(R.styleable.verticalProgress_progress_end_color, R.color.color_4EA6FD); mBorderColorResId = typedArray.getResourceId(R.styleable.verticalProgress_progress_border_color, R.color.color_4EA6FD); mBorderWidth = typedArray.getResourceId(R.styleable.verticalProgress_progress_border_width, 10); } if (typedArray != null) { typedArray.recycle(); } mRectF = new RectF(); mPaint = new Paint(); mPaint.setAntiAlias(true); } @SuppressLint("DrawAllocation") @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if (mRadius == 0) { //弧度為高度的一半 mRadius = mWidth / 2; } if (mBorderEnable) { //第一層矩形(描邊層) mRectF.set(0, 0, mWidth, mHeight); //第一層矩形顏色(進(jìn)度條描邊的顏色) mPaint.setColor(getResources().getColor(mBorderColorResId)); //畫(huà)第一層圓角矩形 canvas.drawRoundRect(mRectF, mRadius, mRadius, mPaint); //第二層矩形顏色(背景層顏色) mPaint.setColor(getResources().getColor(mProgressBgColorId)); //第二層矩形(背景層) mRectF.set(mBorderWidth, mBorderWidth, mWidth - mBorderWidth, mHeight - mBorderWidth); //畫(huà)背景層圓角矩形(蓋在描邊層之上) canvas.drawRoundRect(mRectF, mRadius, mRadius, mPaint); } if (mProgress == 0)//進(jìn)度為 0不畫(huà)進(jìn)度 return; float section = mProgress / max; //進(jìn)度層底層 mRectF.set(+8, mHeight - mProgress / 100f * mHeight + 10, mWidth - 8, mHeight - 8); if (mGradientEnable) { //漸變器 LinearGradient shader = new LinearGradient(0, 0, mWidth * section, mHeight, getResources().getColor(mStartResId), getResources().getColor(mEndResId), Shader.TileMode.CLAMP); //第三層矩形顏色(進(jìn)度漸變色) mPaint.setShader(shader); } //畫(huà)第三層(進(jìn)度層)圓角矩形(蓋在背景層之上) canvas.drawRoundRect(mRectF, mRadius, mRadius, mPaint); //清除之前傳遞的shader mPaint.setShader(null); } public void setProgress(int currentCount) { this.mProgress = currentCount > max ? max : currentCount; postInvalidate(); } }
attr.xml樣式
<declare-styleable name="verticalProgress"> <attr name="progress_radius" format="dimension" /> <attr name="progress_border_width" format="dimension" /> <attr name="progress_gradient_enable" format="boolean" /> <attr name="progress_border_enable" format="boolean" /> <attr name="progress_start_color" format="color" /> <attr name="progress_solid_color" format="color" /> <attr name="progress_end_color" format="color" /> <attr name="progress_border_color" format="boolean" /> </declare-styleable>
最后調(diào)用示例
<com.widget.VerticalProgress android:id="@+id/vp_progress" android:layout_width="20dp" android:layout_height="match_parent" app:progress_border_enable="true" app:progress_solid_color="@color/white" android:layout_centerInParent="true" />
到此,相信大家對(duì)“Android如何實(shí)現(xiàn)簡(jiǎn)單實(shí)用的垂直進(jìn)度條”有了更深的了解,不妨來(lái)實(shí)際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。