欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

AnimatedPieView的使用

程序员文章站 2022-03-09 09:12:06
...

AnimatedPieView的使用

AnimatedPieView的使用

首先要添加依赖:

compile 'com.github.razerdp:AnimatedPieView:1.1.4'

然后添加数据和设置参数:

AnimatedPieViewConfig config = new AnimatedPieViewConfig();
        config.setStartAngle(-90)
                .addData(new SimplePieInfo(30, getColor("FF446767")), true)
                .addData(new SimplePieInfo(18.0f, getColor("FFFFD28C")), true)
                .addData(new SimplePieInfo(123.0f, getColor("FFbb76b4")), true)
                .addData(new SimplePieInfo(87.0f, getColor("FFFFD28C"), "长文字test"), false)
                .addData(new SimplePieInfo(15.0f, getColor("ff2bbc80")), true)
                .addData(new SimplePieInfo(55.0f, getColor("ff8be8ff")), true)
                .addData(new SimplePieInfo(30.0f, getColor("fffa734d")), true)
                .addData(new SimplePieInfo(30.0f, getColor("ff957de0")), true)
                .setTextSize(22)// 绘制的文字大小
                .setCanTouch(false)// 是否允许甜甜圈点击放大
                .setDuration(1000);// 持续时间
        mAnimatedPieView.applyConfig(config);

先把布局贴出来:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:background="@android:color/white"
    android:orientation="vertical">

    <com.razerdp.widget.animatedpieview.AnimatedPieView
        android:id="@+id/animatedPieView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:id="@+id/start"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="start" />

        <Button
            android:id="@+id/setting"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="setting" />
    </LinearLayout>
</LinearLayout>

然后是java代码

package com.test.dmptest.animatedpieview;

import android.graphics.Color;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;


import com.razerdp.widget.animatedpieview.AnimatedPieView;
import com.razerdp.widget.animatedpieview.AnimatedPieViewConfig;
import com.razerdp.widget.animatedpieview.callback.OnPieSelectListener;
import com.razerdp.widget.animatedpieview.data.IPieInfo;
import com.razerdp.widget.animatedpieview.data.SimplePieInfo;

import java.util.Random;

public class MainActivity extends AppCompatActivity {
    private final Random random = new Random();
    private AnimatedPieView mAnimatedPieView;
    private Button start;
    private Button setting;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
    }

    private void initView() {
        start = (Button) findViewById(R.id.start);
        setting = (Button) findViewById(R.id.setting);
        mAnimatedPieView = (AnimatedPieView) findViewById(R.id.animatedPieView);
        AnimatedPieViewConfig config = new AnimatedPieViewConfig();
        config.setStartAngle(-90)
                .addData(new SimplePieInfo(30, getColor("FF446767")), true)
                .addData(new SimplePieInfo(18.0f, getColor("FFFFD28C")), true)
                .addData(new SimplePieInfo(123.0f, getColor("FFbb76b4")), true)
                .addData(new SimplePieInfo(87.0f, getColor("FFFFD28C"), "长文字test"), false)
                .addData(new SimplePieInfo(15.0f, getColor("ff2bbc80")), true)
                .addData(new SimplePieInfo(55.0f, getColor("ff8be8ff")), true)
                .addData(new SimplePieInfo(30.0f, getColor("fffa734d")), true)
                .addData(new SimplePieInfo(30.0f, getColor("ff957de0")), true)
                .setTextSize(22)// 绘制的文字大小
                .setCanTouch(false)// 是否允许甜甜圈点击放大
                .setDuration(1000);// 持续时间
        mAnimatedPieView.applyConfig(config);


        start.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mAnimatedPieView.start();
            }
        });


        setting.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (mAnimatedPieView.isInAnimating()) return;
            }
        });

    }

    private int getColor(String colorStr) {
        if (TextUtils.isEmpty(colorStr)) return Color.BLACK;
        if (!colorStr.startsWith("#")) colorStr = "#" + colorStr;
        return Color.parseColor(colorStr);
    }
}

此外还有其他一些功能:

 AnimatedPieViewConfig mConfig=mAnimatedPieView.getConfig();
        mConfig.setTouchAnimation(true)// 点击事件是否播放浮现动画/回退动画(默认true)
                        .addData(IPieInfo info, boolean autoDesc)// 添加数据,autoDesc:是否自动补充描述?(百分比)
                        .setTouchExpandAngle(15f)// 点击后圆弧/扇形扩展的角度
                        .setTouchShadowRadius(18f)// 点击后的阴影扩散范围
                        .setTouchScaleUpDuration(500)// 点击浮现动画时间
                        .setTouchScaleDownDuration(500)// 上一个浮现的圆弧回退的动画时间
                        .setTouchScaleSize(15)// 点击后扇形放大数值,,只对饼图有效
                        .setDrawStrokeOnly(true)// 是否只画圆弧【甜甜圈哈哈】,否则画扇形(默认true)
                        .setStrokeWidth(15)// 圆弧(甜甜圈)宽度
                        .setDuration(2500)// 动画时间
                        .setStartAngle(-90f)// 开始的角度
                        .setOnPieSelectListener(new OnPieSelectListener<IPieInfo>())//点击事件
                        .setDrawText(true)// 是否绘制文字描述
                        .setTextSize(12)// 绘制的文字大小
                        .getTextMarginLine(8)// 绘制文字与描述线的距离
                        .setPieRadiusScale(0.8f)// 甜甜圈半径占比
                        .setTextPointRadius(2)// 设置描述文字的开始小点的大小
                        .setTextLineStrokeWidth(4)// 设置描述文字的指示线宽度
                        .setTextLineTransitionLength(8)// 设置描述文字的指示线折角处长度
                        .setTextLineStartMargin(8)// 设置描述文字的指示线开始距离外圆半径的大小
                        .setDirectText(true)// 设置描述文字是否统一方向 【
                            -true:文字将会在描述线上绘制
                            -false:文字在12象限部分绘制在线的上方,在34象限绘制在线的下方
                        】
                        .setCanTouch(true)// 是否允许甜甜圈点击放大
                        .setSplitAngle(1)// 甜甜圈间隙角度
                        .setFocusAlphaType(AnimatedPieViewConfig.FOCUS_WITH_ALPHA_REV,150)// 焦点甜甜圈的alpha表现形态及alpha削减值
                        .setStrokePaintCap(Paint.Cap.ROUND)// 笔刷的样式
                        .setConfig(new AnimatedPieViewConfig());// 配置(这里的new只是演示哦,可不要学我例子这里直接塞进一个新的config,否则上面的设置都浪费了)

参考:https://github.com/razerdp/AnimatedPieView?utm_source=androidweekly&utm_medium=website

相关标签: 数据