AnimatedPieView

Additional

Language
Java
Version
N/A
Created
Nov 7, 2017
Updated
Apr 27, 2018
Owner
WeiChaoFeng (razerdp)
Contributors
WeiChaoFeng (razerdp)
430public
2
Activity
Badge
Generate
Download
Source code
APK file

Announcement

AnimatedPieView

一个好吃的甜甜圈?请问客官要啥口味捏-V-

English Doc

Revision Log

使用建议:

1.2.0重构版正式发布,建议升级到该版本,1.2.0将整个项目由头到尾重构了一遍,更完善的注释和文档,以及针对一些命名和旧版本的bug统一修复,同时更加抽象,方便以后的功能添加。欢迎提交相关Bug~我会第一时间去解决问题的

1.2.0弃用方法及对应新方法对照表: 修订日志

开发进度 (更新日志-> 日志

如果您有别的需求,可以提交您的issue哦,当然,也可以直接修改源码-V-

  • 项目优化/重构,1.2.0发布
  • 允许alpha突出选中的甜甜圈
  • 允许甜甜圈之间含有间隔
  • 文字自适应点击动画位置
  • 文字描述动画
  • 有文字描述的甜甜圈
  • 点击事件回调的甜甜圈
  • 点击动画的甜甜圈
  • 可以点击的甜甜圈
  • 可以变成大饼的甜甜圈
  • 动画长大的甜甜圈

主要功能

描述 方法 预览
动画生长 --
饼图/甜甜圈转换 strokeMode(boolean)
角度间隙 splitAngle(float)
绘制文字 drawText(true)
点击效果 canTouch(true) / selectListener()
焦点甜甜圈效果 (反向) focusAlphaType(
AnimatedPieViewConfig.FOCUS_WITH_ALPHA_REV,150
)
焦点甜甜圈效果 focusAlphaType(
AnimatedPieViewConfig.FOCUS_WITH_ALPHA,150
)

依赖

添加依赖(请把{latestVersion}替换成上面的jcenter标签所示版本)

 dependencies {
         compile 'com.github.razerdp:AnimatedPieView:{latestVersion}'
 }

基本使用方式(简单的超乎想像)

step 1:定义任意类实现IPieInfo接口(如果懒,可以使用SimplePieInfo)

public class Test implements IPieInfo {
    @Override
    public float getValue() {
        //这个数值将会决定其所占有的饼图百分比
        return 0.5f;
    }

    @Override
    public int getColor() {
        //该段甜甜圈的颜色,请返回@colorInt,不要返回@colorRes
        return Color.WHITE;
    }

    @Override
    public String getDesc() {
        //描述文字,可不返回
        return "这是一个测试";
    }
}

step 2:定义config并配置就可以了

AnimatedPieView mAnimatedPieView = findViewById(R.id.animatedPieView);
AnimatedPieViewConfig config = new AnimatedPieViewConfig();
config.startAngle(-90)// 起始角度偏移
      .addData(new SimplePieInfo(30, getColor("FFC5FF8C"), "这是第一段"))//数据(实现IPieInfo接口的bean)
      .addData(new SimplePieInfo(18.0f, getColor("FFFFD28C"), "这是第二段"))
      ...(尽管addData吧)
      .duration(2000);// 持续时间
                
// 以下两句可以直接用 mAnimatedPieView.start(config); 解决,功能一致
mAnimatedPieView.applyConfig(config);
mAnimatedPieView.start();
        

进阶用法(所有配置都在config,and...相信我,我提供大多数配置,但日常用到的,其实不多哈哈)

AnimatedPieViewConfig mConfig=mAnimatedPieView.getConfig();
mConfig.animOnTouch(true)// 点击事件是否播放浮现动画/回退动画(默认true)
       .addData(IPieInfo info, boolean autoDesc)// 添加数据,autoDesc:是否自动补充描述?(百分比)
       .floatExpandAngle(15f)// 点击后圆弧/扇形扩展的角度
       .floatShadowRadius(18f)// 点击后的阴影扩散范围
       .floatUpDuration(500)// 点击浮现动画时间
       .floatDownDuration(500)// 上一个浮现的圆弧回退的动画时间
       .floatExpandSize(15)// 点击后扇形放大数值,,只对饼图有效
       .strokeMode(true)// 是否只画圆弧【甜甜圈哈哈】,否则画扇形(默认true)
       .strokeWidth(15)// 圆弧(甜甜圈)宽度
       .duration(2500)// 动画时间
       .startAngle(-90f)// 开始的角度
       .selectListener(new OnPieSelectListener<IPieInfo>())//点击事件
       .drawText(true)// 是否绘制文字描述
       .textSize(12)// 绘制的文字大小
       .textMargin(8)// 绘制文字与导航线的距离
       .pieRadiusRatio(0.8f)// 甜甜圈半径占比
       .guidePointRadius(2)// 设置描述文字的开始小点的大小
       .guideLineWidth(4)// 设置描述文字的指示线宽度
       .guideLineMarginStart(8)// 设置描述文字的指示线开始距离外圆半径的大小
       .textGravity(AnimatedPieViewConfig.ABOVE)// 设置描述文字方向 【
            -AnimatedPieViewConfig.ABOVE:文字将会在导航线上方绘制
            -AnimatedPieViewConfig.BELOW:文字在导航线下方绘制
            -AnimatedPieViewConfig.ALIGN:文字与导航线对齐
            -AnimatedPieViewConfig.DYSTOPY:文字在12象限部分绘制在线的上方,在34象限绘制在线的下方
       】
       .canTouch(true)// 是否允许甜甜圈点击放大
       .splitAngle(1)// 甜甜圈间隙角度
       .focusAlphaType(AnimatedPieViewConfig.FOCUS_WITH_ALPHA_REV,150)// 焦点甜甜圈的alpha表现形态及alpha削减值
       .interpolator(new DecelerateInterpolator())// 动画插值器
       .focusAlpha(150);// 选中的/或者非选中的甜甜圈的alpha值(跟focusAlphaType挂钩)

交流群:590777418

因为目前还有朋友圈项目,建立了一个交流群,出于懒得管理那么多,所以如果有想法或者优化建议或者其他问题,欢迎加入“朋友圈交流群”

打赏(看在我那么努力维护的份上。。。给个零食呗~)

微信 支付宝

控件思路【按思路顺序更新】

LICENSE

Apache-2.0