【自定義控件】練習(xí)：餅狀圖

2019-11-06 09:59:57

字體：大中小

供稿：網(wǎng)友

效果

這里寫(xiě)圖片描述

主要涉及：畫(huà)圓弧、畫(huà)文字

1、畫(huà)圓弧：

RectF rect = new RectF(0,0,300,300);canvas.drawArc(RectF rect,float startAngle,float swipAngle,boolean userCenter,Paint paint);

記錄每一個(gè)結(jié)束時(shí)的角度，下一次開(kāi)始的角度即為上次結(jié)束時(shí)的角度。

主要代碼：

//計(jì)算每一個(gè)pie的角度f(wàn)loat startAngle = 0;//開(kāi)始的角度f(wàn)or (PieData data : pieData) { //將每一部分的圓弧畫(huà)出來(lái) mPaint.setColor(data.getPieColor());//每一塊的顏色 float swipeAngle = data.getPiePRoportion() * 360;//每一塊占多少角度 canvas.drawArc(bigRect, startAngle, swipeAngle, true, mPaint); ...}

2、畫(huà)文字：

計(jì)算文本的位置小圓半徑設(shè)為大圓半徑的2/3

這里寫(xiě)圖片描述

主要代碼：

//畫(huà)文本float x0 = width / 2;float y0 = height / 2;float txtAngle = startAngle + swipeAngle / 2;double radians = Math.toRadians(txtAngle);double x1 = x0 + Math.cos(radians) * smallRadius;double y1 = y0 + Math.sin(radians) * smallRadius;Rect textRect = new Rect();String pieName = data.getPieName();mPaint.getTextBounds(pieName, 0, pieName.length(), textRect);x1 = x1 - textRect.width() / 2;y1 = y1 + textRect.height() / 2;mPaint.setColor(data.getPieTxtColor());mPaint.setTextSize(TranslateDimensionUtils.sp2px(mContext, data.getPieTextSize()));canvas.drawText(pieName, (float) x1, (float) y1, mPaint);

代碼： https://github.com/WhatWeCan/customer_views/tree/master/PieView

上一篇：ORB-SLAM2搭建詳細(xì)過(guò)程

下一篇：IO流-字符流