欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解Android如何自定義view實現(xiàn)圓形進度條

 更新時間:2022年01月20日 14:32:12   作者:吐爾洪江Coding  
Android中實現(xiàn)進度條有很多種方式,自定義進度條一般是繼承progressBar或繼承view來實現(xiàn)。本文將介紹通過自定義View實現(xiàn)的圓形進度條,感興趣的可以動手試一試

Android中實現(xiàn)進度條有很多種方式,自定義進度條一般是繼承progressBar或繼承view來實現(xiàn),本篇中講解的是第二種方式。

先上效果圖:

實現(xiàn)圓形進度條總體來說并不難,還是跟往常一樣繼承view,初始化畫筆,按下面的步驟一步步來就好了。對初學者來說動畫效果可能比較陌生,我們可以使用屬性動畫中的valueAnimator來實現(xiàn)動畫效果。

實現(xiàn)步驟:

1、畫出一個灰色的圓環(huán)作為背景。

2、畫出上層的圓環(huán)覆蓋下方的圓環(huán)。

3、加入動畫效果

值得注意的是怎么設(shè)置圓環(huán)和文字的位置。

畫出矩形只需要傳入矩形對角線的坐標即可,如果不加以處理的話畫出來的圓環(huán)的邊緣是不完整的,剛開始接觸自定義view的同學們一定要先好好看看Android坐標系相關(guān)內(nèi)容,不然很難理解位置參數(shù)為什么這樣設(shè)置。

完整代碼:

package com.example.floatingwindow.widget;
 
import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.view.animation.DecelerateInterpolator;
 
import androidx.annotation.Nullable;
 
import com.example.floatingwindow.R;
 
public class ProgressBarView extends View {
 
    private Paint mPaintBack;
    private Paint mPaint;
    private Paint mPaintText;
    private float process;
    private int strokeWidth = 15;
    private int textSize = 20;
    private long duration = 3000;
    private float startDegree = 0;
    private float endDegree = 360;
    private String text = "完成";
    private String defaultText = "0%";
 
 
    public ProgressBarView(Context context) {
        super(context);
        init();
    }
 
    public ProgressBarView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }
 
    public ProgressBarView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }
 
    private void init() {
        mPaintBack = new Paint();
        mPaintBack.setColor(getResources().getColor(R.color.gray));
        mPaintBack.setStyle(Paint.Style.STROKE);
        mPaintBack.setAntiAlias(true);
        mPaintBack.setStrokeCap(Paint.Cap.ROUND);
        mPaintBack.setStrokeWidth(strokeWidth);
 
        mPaint = new Paint();
        mPaint.setColor(getResources().getColor(R.color.purple_200));
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setAntiAlias(true);
        mPaint.setStrokeCap(Paint.Cap.ROUND);
        mPaint.setStrokeWidth(strokeWidth);
 
        mPaintText = new Paint();
        mPaintText.setAntiAlias(true);
        mPaintText.setStyle(Paint.Style.STROKE);
        mPaintText.setColor(Color.BLACK);
        mPaintBack.setStrokeCap(Paint.Cap.ROUND);
        mPaintText.setTextSize(sp2px(textSize));
    }
 
    public void setStrokeWidth(int width) {
        strokeWidth = width;
    }
 
    public void setTextSize(int textSize) {
        this.textSize = textSize;
    }
 
    public void setDuration(long duration) {
        this.duration = duration;
    }
 
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //創(chuàng)建圓環(huán)矩形
        RectF rectF = new RectF(strokeWidth, strokeWidth, getWidth() - strokeWidth, getHeight() - strokeWidth);
        //畫出灰色進度條作為背景
        canvas.drawArc(rectF, 0, 360, false, mPaintBack);
        //畫進度條
        canvas.drawArc(rectF, 0, process, false, mPaint);
        //計算進度
        int percent = (int) (process / 360 * 100);
        //設(shè)置文字在canvas中的位置
        Paint.FontMetrics fm = mPaintText.getFontMetrics();
        int mTxtWidth = (int) mPaintText.measureText(text, 0, defaultText.length());
        int mTxtHeight = (int) Math.ceil(fm.descent - fm.ascent);
        int x = getWidth() / 2 - mTxtWidth / 2;
        int y = getHeight() / 2 + mTxtHeight / 4;
        if (percent < 100) {
            canvas.drawText(percent + "%", x, y, mPaintText);
        } else {
            canvas.drawText(text, x, y, mPaintText);
        }
    }
 
    /**
     * 設(shè)置動畫效果
     */
    public void start() {
        ValueAnimator valueAnimator = ValueAnimator.ofFloat(startDegree, endDegree);
        valueAnimator.setDuration(duration);
        valueAnimator.setInterpolator(new DecelerateInterpolator());
        valueAnimator.addUpdateListener(animation -> {
            process = (float) animation.getAnimatedValue();
            invalidate();
        });
        valueAnimator.start();
    }
 
    private int sp2px(int sp) {
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, sp,
                getResources().getDisplayMetrics());
    }
}

最后就是動畫效果了,使用valueanimator,傳入開始和結(jié)束的進度以及執(zhí)行時間。然后每次進度發(fā)生變化時做UI刷新。

xml布局:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
 
    <com.example.floatingwindow.widget.ProgressBarView
        android:id="@+id/progressBar"
        android:layout_width="150dp"
        android:layout_height="150dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent">
    </com.example.floatingwindow.widget.ProgressBarView>
 
</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity:

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
 
        progressBar.start()
 
        progressBar.setOnClickListener { progressBar.start()}
    }

以上就是詳解Android如何自定義view實現(xiàn)圓形進度條的詳細內(nèi)容,更多關(guān)于Android圓形進度條的資料請關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

  • Android 自定義view仿支付寶咻一咻功能

    Android 自定義view仿支付寶咻一咻功能

    支付寶上有一個咻一咻的功能,就是點擊圖片后四周有水波紋的這種效果,今天就通過本文給大家分享實現(xiàn)此功能的思路及實例代碼,一起看看吧
    2016-12-12
  • linphone-sdk-android版本號生成解析

    linphone-sdk-android版本號生成解析

    這篇文章主要為大家介紹了linphone-sdk-android版本號生成解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2022-09-09
  • Android畫中畫窗口開啟方法

    Android畫中畫窗口開啟方法

    Android8.0 Oreo(API Level26)允許活動啟動畫中畫Picture-in-picture(PIP)模式。PIP是一種特殊類型的多窗口模式,主要用于視頻播放。PIP模式已經(jīng)可用于Android TV,而Android8.0則讓該功能可進一步用于其他Android設(shè)備
    2023-01-01
  • Android自定義View展開菜單功能的實現(xiàn)

    Android自定義View展開菜單功能的實現(xiàn)

    這篇文章主要介紹了Android自定義View展開菜單功能的實現(xiàn),需要的朋友可以參考下
    2017-06-06
  • Android 自定義LayoutManager實現(xiàn)花式表格

    Android 自定義LayoutManager實現(xiàn)花式表格

    這篇文章主要介紹了Android 自定義LayoutManager實現(xiàn)花式表格,本文給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下
    2020-02-02
  • Android手機衛(wèi)士之確認密碼對話框

    Android手機衛(wèi)士之確認密碼對話框

    這篇文章主要為大家詳細介紹了Android手機衛(wèi)士之確認密碼對話框,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-10-10
  • Android中的Bitmap緩存池使用詳解

    Android中的Bitmap緩存池使用詳解

    這篇文章主要介紹了Android中的Bitmap緩存池使用詳解,本文主要目的是講解如何使用緩存來提高UI的載入輸入和滑動的流暢性,需要的朋友可以參考下
    2015-01-01
  • idea下Android各目錄所代表的含義介紹

    idea下Android各目錄所代表的含義介紹

    這篇文章主要給大家介紹了關(guān)于idea下Android各目錄所代表含義的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2021-03-03
  • Android開發(fā)技巧之Fragment的懶加載

    Android開發(fā)技巧之Fragment的懶加載

    我們都知道fragment放在viewPager里面,viewpager會幫我們預先加載一個,但是當我們要看fragment里面的內(nèi)容時,我們也許只會去看第一個,不會去看第二個,如果這時候不去實現(xiàn)fragment的懶加載的話,就會多余的去加載一些數(shù)據(jù),造成用戶多消耗流量。下面來一起看看吧。
    2016-10-10
  • Flutter渲染原理深入解析

    Flutter渲染原理深入解析

    眾所周知?Flutter是由Google推出的開源的高性能跨平臺框架,一個2D渲染引擎。在Flutter中,Widget是Flutter用戶界面的基本構(gòu)成單元,可以說一切皆Widget。下面來看下Flutter框架的整體結(jié)構(gòu)組成
    2023-04-04

最新評論