android饼图View PieChart 点击旋转 分割
2017-07-23 本文已影响1432人
Jimzjy
demo
demo (2).gif使用
Gradle:
compile 'cn.jimzjy.pie-chart:pie-chart:1.0.2'
github 地址
https://github.com/Jimzjy/PieChartView
XML属性
- pie_radius: 设置饼图半径
- centerCircle_radius: 设置中心园半径
- textSize: 设置中间文字大小
- shaderSize: 设置中心园阴影大小
PieChart pieChart;
Button button;
List<Pie> pieList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pieChart = (PieChart)findViewById(R.id.pie_chart);
button = (Button)findViewById(R.id.button1);
init();
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//设置饼图
pieChart.setPie(pieList);
//设置饼图中心文字
pieChart.setCenterText("PieChartTest");
//画饼图
pieChart.startDrawPie();
}
});
}
private void init(){
pieList = new ArrayList<>();
pieList.add(new Pie(60.5f,"60.5", Color.parseColor("#F48FB1")));
pieList.add(new Pie(71.2f,"71.2", Color.parseColor("#CE93D8")));
pieList.add(new Pie(90.9f,"90.9", Color.parseColor("#90CAF9")));
pieList.add(new Pie(50f,"50", Color.parseColor("#FFE082")));
pieList.add(new Pie(100f,"100", Color.parseColor("#FFAB91")));
}
点击旋转 分割 原理
setPie() 中
float angleTemp;
float startAngleTemp = DEFAULT_START_ANGLE;
//设置饼图属性时,记录每个饼图中间角度
for (float v : pieValueList) {
angleTemp = 360 * v / mMaxValue;
angleList.add(startAngleTemp + angleTemp / 2);
startAngleTemp += angleTemp;
}
i 为当前点击的扇形的index
得到旋转的角度,正为顺时针,负为逆时针
private float getRotationAngle(int i) {
float angleR;
float angleT = angleList.get(i);
if (angleT <= 270f && angleT >= 90f) {
angleR = 90f - angleT;
} else if (angleT > 270f && angleT <= 360f) {
angleR = 360f - angleT + 90f;
} else if (angleT >= 0 && angleT < 90) {
angleR = 90 - angleT;
} else {
angleR = 0;
Log.w(TAG, "Angle < 0 || Angle > 360");
}
for (int id = 0; id < angleList.size(); id++) {
float temp = angleList.get(id) + angleR;
if (temp > 360f) {
temp -= 360f;
} else if (temp < 0) {
temp += 360f;
}
angleList.set(id, temp);
}
return angleR;
}
控制点击分割的属性动画
animatorTouch = ValueAnimator.ofFloat(1f, 1.07f);
animatorTouch.setDuration(400);
animatorTouch.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
//控制饼图的半径缩放,来达到弹出的效果
curtFractionTouch = (Float) animation.getAnimatedValue();
//控制饼图角度缩放,来达到弹出时角度变小的效果
curtFractionTouch2 = 0.02f * animation.getAnimatedFraction();
invalidate();
}
});
onDraw中画点击的扇形时调用
private void drawPieTouch(Canvas canvas, float amount) {
mPaint1.setColor(mCurrentColor);
float mAngle = 360 * curtFraction * amount / mMaxValue;
//改变扇形半径
float mRadiusTemp = mRadius * curtFractionTouch;
//mStartAngle + mAngle * curtFractionTouch2 和
//mAngle - mAngle * curtFractionTouch2 * 2 控制角度变小
canvas.drawArc(centerX - mRadiusTemp, centerY - mRadiusTemp, centerX + mRadiusTemp,
centerY + mRadiusTemp, mStartAngle + mAngle * curtFractionTouch2,
mAngle - mAngle * curtFractionTouch2 * 2, true, mPaint1);
mStartAngle += mAngle;
}