自定義view 進度條

2021-09-11 11:54:59 字數 3184 閱讀 4404

廢話不多說先看效果圖

效果圖

原諒模擬器顯示的不好看,為了錄gif圖,只能用模擬器

乙個背景,乙個進度,乙個進度值顯示,進度條與文字顯示的高度是1:2,其中用到了drawroundrect用來畫帶圓角的矩形,空心與實心都是paint的屬性設定的,drawtext用來畫文字

注意點:

1.進度條進度滿進度與未滿進度,計算onewidth = mwidth / mmaxprogress(單位進度佔的寬度=總寬度/滿進度);

2.文字顯示,先計算文字的寬度,三個狀態(起始位置 <= 文字寬度 / 當前位置 +文字寬度》=寬度/之間的),分別進行計算

ondraw來畫圖了

@override

protected void ondraw(canvas canvas) else

canvas.drawroundrect(rectfm, num8, num8, mpaint);

//畫文字

//獲取文字的寬度及其高度

rect rect = new rect();

string speed = mcurrentprogress + "%";

txtpaint.gettextbounds(speed, 0, speed.length(), rect);

textheight = rect.height();

textwidth = rect.width();

if (mcurrentprogress == mmaxprogress) else else

if (x + textwidth >= mwidth) else

}}複製**

public void setprogress(int progress) 

}複製**

實際專案中,可有很多的擴充套件,但是有時候實際專案不需要把很多不需要的方法,設定屬性的方法等給寫出來,根據專案的需求去寫相關方法、屬性設定

/**

* licensed to the apache software foundation (asf) under one

* or more contributor license agreements. see the notice file

* distributed with this work for additional information

* to you under the apache license, version 2.0 (the

* "license"); you may not use this file except in compliance

* with the license. you may obtain a copy of the license at

* *

* * software distributed under the license is distributed on an

* "as is" basis, without warranties or conditions of any

* kind, either express or implied. see the license for the

* specific language governing permissions and limitations

* under the license.

*/package com.numberview;

import android.content.context;

import android.graphics.canvas;

import android.graphics.color;

import android.graphics.paint;

import android.graphics.rect;

import android.graphics.rectf;

import android.support.annotation.nullable;

import android.util.attributeset;

import android.view.view;

/** * created by wujun on 2017/9/20.

* * @author madreain

* @desc

*/public class numberview1 extends view

public numberview1(context context, @nullable attributeset attrs)

public numberview1(context context, @nullable attributeset attrs, int defstyleattr)

private void init

() @override

protected void onsizechanged(int w, int h, int oldw, int oldh)

@override

protected void ondraw(canvas canvas) else

canvas.drawroundrect(rectfm, num8, num8, mpaint);

//畫文字

//獲取文字的寬度及其高度

rect rect = new rect();

string speed = mcurrentprogress + "%";

txtpaint.gettextbounds(speed, 0, speed.length(), rect);

textheight = rect.height();

textwidth = rect.width();

if (mcurrentprogress == mmaxprogress) else else

if (x + textwidth >= mwidth) else }}

public float dp2px(float dp)

public float sp2px(float sp)

public void setprogress(int progress)

}}複製**

自定義view多寫多練

numberview github demo位址

自定義View 圓形進度條

首先在res values下建立乙個attrs資源資料夾 自定義view public class circleprogressview extends view public circleprogressview context context,attributeset attrs private...

自定義view (三) 用view圓環進度條

參考的鴻揚大神的部落格 部落格位址 做了乙個圓環進度條,感覺可以深入下,做乙個環形的餅狀圖 照著他的 敲了一遍,初步理解了,裡面給了非常詳細的注釋,主要看 步驟還是一樣 1 自定義view的屬性 2 在view的構造方法中獲得我們自定義的屬性 3 重寫onmesure 4 重寫ondraw 新建vi...

自定義進度條

自定義進度條 1 繪製底色 灰色 2 繪製進度 藍色 3 繪製最大的進度 純藍色 rectf rf new rectf 0,0,mwidth,mheight 繪製圓角矩形,背景色為畫筆顏色 mpaint.setcolor color.rgb 220,220,220 canvas.drawroundr...