Android自定義View實(shí)現(xiàn)圓環(huán)交替效果
下面請(qǐng)先看效果圖:
看上去是不很炫的樣子,它的實(shí)現(xiàn)上也不是很復(fù)雜,重點(diǎn)在與onDraw()方法的繪制。
首先是我們的attrs文件:
<?xml version="1.0" encoding="utf-8"?> <resources> <attr name="firstColor" format="color"/> <attr name="secondColor" format="color"/> <attr name="circleWidth" format="dimension"/> <attr name="speed" format="integer"/> <declare-styleable name="CustomView"> <attr name="firstColor" /> <attr name="secondColor" /> <attr name="circleWidth" /> <attr name="speed" /> </declare-styleable> </resources>
接下來(lái)是我們重寫(xiě)View類(lèi)的自定義View類(lèi):
public class MySelfCircleView extends View {
/*
* 第一圈顏色
*/
int firstColor;
/*
* 第二圈顏色
*/
int secondColor;
/*
* 圓的寬度
*/
int circleWidth;
/*
* 速率
*/
int speed;
/*
* 畫(huà)筆
*/
Paint mPaint;
/*
* 進(jìn)度
*/
int mProgress;
/*
* 是否切換標(biāo)志
*/
boolean isNext;
public MySelfCircleView(Context context, AttributeSet attrs,
int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray typedArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomView, defStyleAttr, 0);
int n = typedArray.getIndexCount();
for(int i=0; i<n; i++){
int attr = typedArray.getIndex(i);
switch (attr) {
case R.styleable.CustomView_firstColor:
firstColor = typedArray.getColor(attr, Color.RED);
break;
case R.styleable.CustomView_secondColor:
secondColor = typedArray.getColor(attr, Color.RED);
break;
case R.styleable.CustomView_circleWidth:
circleWidth = typedArray.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_PX, 20, getResources().getDisplayMetrics()));
break;
case R.styleable.CustomView_speed:
speed = typedArray.getInt(attr, 20);
break;
}
}
typedArray.recycle();
mPaint = new Paint();
new Thread(new Runnable() {
@Override
public void run() {
while (true) {
mProgress++;
if (mProgress == 360) {
mProgress = 0;
if (!isNext)
isNext = true;
else
isNext = false;
}
postInvalidate();
try {
Thread.sleep(speed);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
}
public MySelfCircleView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public MySelfCircleView(Context context) {
this(context, null);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int centre = getWidth() / 2; // 獲取圓心的x坐標(biāo)
int radius = centre - circleWidth / 2;// 半徑
mPaint.setStrokeWidth(circleWidth); // 設(shè)置圓環(huán)的寬度
mPaint.setAntiAlias(true); // 消除鋸齒
mPaint.setStyle(Paint.Style.STROKE); // 設(shè)置空心
RectF oval = new RectF(centre - radius, centre - radius, centre + radius, centre + radius); // 用于定義的圓弧的形狀和大小的界限
if (!isNext) {// 第一顏色的圈完整,第二顏色跑
mPaint.setColor(firstColor); // 設(shè)置圓環(huán)的顏色
canvas.drawCircle(centre, centre, radius, mPaint); // 畫(huà)出圓環(huán)
mPaint.setColor(secondColor); // 設(shè)置圓環(huán)的顏色
canvas.drawArc(oval, -90, mProgress, false, mPaint); // 根據(jù)進(jìn)度畫(huà)圓弧
} else {
mPaint.setColor(secondColor); // 設(shè)置圓環(huán)的顏色
canvas.drawCircle(centre, centre, radius, mPaint); // 畫(huà)出圓環(huán)
mPaint.setColor(firstColor); // 設(shè)置圓環(huán)的顏色
canvas.drawArc(oval, -90, mProgress, false, mPaint); // 根據(jù)進(jìn)度畫(huà)圓弧
}
}
}
最后是我們的布局文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:zhy="http://schemas.android.com/apk/res/com.example.myselfview" android:layout_width="match_parent" android:layout_height="match_parent" > <com.example.myselfview.view.MySelfCircleView android:layout_width="120dp" android:layout_height="120dp" android:layout_marginTop="20dp" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" zhy:circleWidth="15dp" zhy:firstColor="#D4F668" zhy:secondColor="#2F9DD2" zhy:speed="10" /> <com.example.myselfview.view.MySelfCircleView android:layout_width="200dp" android:layout_height="200dp" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" zhy:circleWidth="24dp" android:layout_marginBottom="40dp" zhy:firstColor="#16A3FA" zhy:secondColor="#D20F02" zhy:speed="5" /> </RelativeLayout>
總結(jié)
好了,到這里我們的效果就算大工告成,感興趣的朋友可以寫(xiě)寫(xiě)看,個(gè)人感覺(jué)自定義View需要大量的練習(xí),才能為我所用。希望本文對(duì)大家開(kāi)發(fā)Android能有所幫助。
- Android實(shí)現(xiàn)長(zhǎng)按圓環(huán)動(dòng)畫(huà)View效果的思路代碼
- Android自定義View實(shí)現(xiàn)圓環(huán)進(jìn)度條
- Android自定義View實(shí)現(xiàn)圓環(huán)帶數(shù)字百分比進(jìn)度條
- Android自定義view實(shí)現(xiàn)圓環(huán)效果實(shí)例代碼
- android自定義View實(shí)現(xiàn)圓環(huán)顏色選擇器
- Android自定義view繪制圓環(huán)占比動(dòng)畫(huà)
- Android中自定義View實(shí)現(xiàn)圓環(huán)等待及相關(guān)的音量調(diào)節(jié)效果
- Android自定義View之酷炫數(shù)字圓環(huán)
- Android開(kāi)發(fā)筆記之:在ImageView上繪制圓環(huán)的實(shí)現(xiàn)方法
- Android自定義view實(shí)現(xiàn)半圓環(huán)效果
相關(guān)文章
Android編程判斷當(dāng)前指定App是否在前臺(tái)的方法
這篇文章主要介紹了Android編程判斷當(dāng)前指定App是否在前臺(tái)的方法,涉及Android針對(duì)進(jìn)程操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
Flutter實(shí)現(xiàn)仿微信分享功能的示例代碼
Flutter 用來(lái)快速開(kāi)發(fā) Android iOS平臺(tái)應(yīng)用,在Flutter 中,通過(guò) fluwx或者fluwx_no_pay 插件可以實(shí)現(xiàn)微信分享功能,本文將具體介紹實(shí)現(xiàn)的示例代碼,需要的可以參考一下2022-01-01
Android源碼學(xué)習(xí)之工廠方法模式應(yīng)用及優(yōu)勢(shì)介紹
工廠方法模式定義:定義一個(gè)用于創(chuàng)建對(duì)象的接口,讓子類(lèi)決定實(shí)例化哪一個(gè)類(lèi)。工廠方法使一個(gè)類(lèi)的實(shí)例化延遲到其子類(lèi),感興趣的朋友可以了解下哦2013-01-01
Android App后臺(tái)服務(wù)報(bào)告工作狀態(tài)實(shí)例
這篇文章主要介紹了Android App后臺(tái)服務(wù)報(bào)告工作狀態(tài)實(shí)例,使用LocalBroadcastManager發(fā)送和接收狀態(tài),需要的朋友可以參考下2014-06-06
Android SDK Manager國(guó)內(nèi)無(wú)法更新的解決方案
本文主要介紹Android SDK Manager國(guó)內(nèi)無(wú)法更新的解決方案,這里提供了解決方法,及簡(jiǎn)單說(shuō)明實(shí)現(xiàn)流程,有興趣的小伙伴可以參考下2016-09-09
Android 推送原理(Android Push Notification)詳解
這篇文章主要介紹了Android 推送原理(Android Push Notification)詳解的相關(guān)資料,這里對(duì)Android 推送的原理做了簡(jiǎn)單的介紹,需要的朋友可以參考下2016-11-11
Android仿支付寶笑臉?biāo)⑿录虞d動(dòng)畫(huà)的實(shí)現(xiàn)代碼
這篇文章主要介紹了Android仿支付寶笑臉?biāo)⑿录虞d動(dòng)畫(huà)的實(shí)現(xiàn)代碼的相關(guān)資料,需要的朋友可以參考下2016-11-11
快速解決Android7.0下沉浸式狀態(tài)欄變灰的問(wèn)題
下面小編就為大家分享一篇快速解決Android7.0下沉浸式狀態(tài)欄變灰的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-01-01
Android Recyclerview實(shí)現(xiàn)上拉加載更多功能
在項(xiàng)目中使用列表的下拉刷新和上拉加載更多是很常見(jiàn)的功能。下文給大家?guī)?lái)了Android Recyclerview上拉加載更多功能,需要的朋友參考下吧2017-05-05
Android通過(guò)startService播放背景音樂(lè)
這篇文章主要介紹了Android通過(guò)startService播放背景音樂(lè)簡(jiǎn)單示例,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-12-12

