自定义View练习 - 雷达信用图表

本文介绍了一个自定义View的练习,通过绘制雷达图来展示芝麻信用分数。内容包括练习的来源、最终效果展示、绘制思路及详细实现过程,如计算点坐标、绘制多边形、连接线、填充区域、总分数和标题图标。同时,文章强调了获取文字宽高、计算坐标等关键知识点。
摘要由CSDN通过智能技术生成

自定义View练习 - 雷达信用图表

练习来源

Android自定义控件 芝麻信用分雷达图

练习的github:https://github.com/alidili/SesameCreditScore

最终效果图

雷达信用图表

思路

  1. 绘制多边形
  2. 绘制连接线
  3. 绘制填充区域
  4. 绘制总分数
  5. 绘制标题和图标

实现过程

0. 定义变量

    //数据的数量
    private int dataCount;
    //弧度
    private float radian;
    //多边形的外接圆的半径
    private int radius;
    //中心点x
    private int centerX;
    //中心点y
    private int centerY;

    private List<CreditBean> creditBeans;
    //最大分值
    public int maxScore;

    private Paint linePaint;
    private Paint regionPaint;
    private Paint totalScorePaint;
    private Paint titlePaint;
1. 计算点坐标
  • 计算坐标的示意图
  • 计算坐标示意图
    /**
     * 获得点坐标
     */
    public Point getPoint(int index) {
        return getPoint(index, 1);
    }

    /**
     * 获得点坐标,percent为百分比,用于获得填充区域和文字等的坐标位置.
     * 坐标的计算是重难点. 可以画图分析.
     */
    public Point getPoint(int index, float percent) {
        int x = 0;
        int y = 0;
        if (index == 0) {
            x = (int) (centerX + radius * Math.sin(radian) * percent);
            y = (int) (centerY - radius * Math.cos(radian) * percent);
        } else if (index == 1) {
            x = (int) (c
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值