文档章节

自定义View完成统计视图

陈小默
 陈小默
发布于 2015/09/17 20:18
字数 1109
阅读 47
收藏 0

当使用原生View达不到某些预定效果的时候,我们可以采用自定义View的方式向其中添加一些我们想要的特殊效果,比如我们想要在一个View中显示统计结果,如下图所示:

图1:

图2:

图3

现在我们根据图3实现一个View

第一步: 创建一个自定义View继承View或其子类

public class RoundViewextends View {
    //主动创建对象时调用此构造方法
    public RoundView(Context context) {
        this(context, null);
    }

    private RoundView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    //使用findViewById()创建对象时调用此构造方法
    private RoundView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }
}

在自定义View中声明数据源类型

private List<ContentValues> datas;
//其中包含3个参数 int型的区域颜色 String型的区域名称 float类型的值

我们为了更方便的创建数据源对象,现在在 此View中 添加一个静态的生成数据源对象的方法

public static ContentValues newValues(String name, float value, int color) {
        ContentValues values = new ContentValues();
        values.put("name", name);
        values.put("value", value);
        values.put("color", color);
        return values; 
 }

第二步:重写onDraw()方法实现iew的重绘功能

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        height = this.getHeight();//获取当前View的高度
        width = this.getWidth();//获取当前View的宽度 单位是像素
        radius = (height > width ? width : height) * 2 / 6 - 2
                * (top > left ? top : left);//设置绘制的圆为高宽中最小值的三分之一
        paintRound(canvas);//描绘圆形的方法
        paintTitle(canvas);//描绘标题的方法
        paintComment(canvas);//描绘评论的方法
    }

详细的画圆方法

    /**
     * 绘制圆形区域以及标题
     */
    private void paintRound(Canvas canvas) {
        // 整理总数
        dealDatas();
        paintData(canvas);
    }
    /**
     * 整理所有参数,获取所有值的总和
     */
    private void dealDatas() {
        sum = 0;
        for (ContentValues values : datas) {
            sum += values.getAsFloat("value");
        }
    }
    /**
     * 根据datas中的数据更新View
     */
    private void paintData(Canvas canvas) {
        curAngle = 0;
        RectF oval = new RectF(left, top, left + 2 * radius, top + 2 * radius);
        //绘制圆形时可以使用一个矩形对象作为框架将圆形放入其中
        for (int i = 0; i < datas.size(); i++) {
            ContentValues values = datas.get(i);
            float f = values.getAsFloat("value");
            float angle = (float) (f / sum * 360);
            //根据此数值占总数的比例来决定其在整个圆形中的角都
            paintRound.setColor(values.getAsInteger("color"));
            canvas.drawArc(oval, curAngle, angle, true, paintRound);
            //该方法的第一个参数为参考矩形,第二个参数为起始角度,第三个参数为绘画角度,
            //第四个参数为是否包含原点(若选择false表示不绘制原点只画一条弧度线)
            curAngle += angle;
            //增加起始角度供下一个数据使用
            paintPoint(canvas, values.getAsString("name") + " " + f, i);
            //在圆形的右侧绘制相应的名称和值
        }
    }
    /**
     * 在右侧绘制详细信息
     * 
     * @param canvas
     * @param asString
     * @param asInteger
     */
    private void paintPoint(Canvas canvas, String asString, int i) {
        canvas.drawPoint(3 * left + 2 * radius, 2 * top + 2 * textSize * i,
                paintRound);
        canvas.drawText(asString, 3 * left + 2 * radius + textSize, 2 * top + 2
                * textSize * i, paintWrite);
    }


基本功能已经实现,源代码 请移步至 我的代码分享进行下载

用法详细说明: 此处所有的View均不可直接写在布局xml文件中,需要先在xml文件中指定一个FrameLayout

初始化时

layout = (FrameLayout) findViewById(R.id.fl);//获取FrameLayout对象

通过工厂类获取自定义对象

BorkenLineView newBorkenLineView = StatisticsFactory
                .getInstance(layout)//将layout作为父控件传入
                .newBorkenLineView(getApplicationContext());

newBorkenLineView.setDatas(getDatas())//设置数据源
                .setValuesRange(-100, 0, 10)//设置显示数据区间
                .setTitleText("折线报表")//设置标题
                .setTitle(80, Color.BLUE, 4)//设置标题属性
                .setPaintType(BorkenLineView.FIXNUMBER)//设置图例大小是匹配控件还是自定义
                .setSize(300, 600)//若上一个设置为匹配控件则此设置无效(不会抛出异常)
                .setCommentText("评论")//对于此统计结果的评论
                .setComment(Color.RED, 20)//评论的属性设置
                .flush();//刷新View重绘布局

总结RoundView(饼状图)对外提供的方法

    public RoundView setDatas(List<ContentValues> datas)
    public RoundView setData(ContentValues value)
    public RoundView setComment(String comment)
    public void flush() 
    public RoundView setTitle(String title)
    public static ContentValues newValues(String name, float value, int color)

ColumnsView 柱状图对外提供的方法

public void setDatas(List<Map<String, Float>> datas)
public void setData(Map<String, Float> data) 
public ColumnsView setColumnWeidth(float columnWeidth)//设置列宽
public ColumnsView setHeight(float viewHeight)//图形高度
public ColumnsView setTitle(String title)
public ColumnsView setValuesRange(float low, float high, int number)
public ColumnsView(Context context)
public void flush()

BorkenLineView折线图对外提供的方法

public BorkenLineView addData(Map<Integer, Integer> map)
public BorkenLineView setDatas(List<Map<Integer, Integer>> datas)
public BorkenLineView setComment(int color, int textSize)
public BorkenLineView setValuesRange(float low, float high, int number)
public BorkenLineView setPaintType(int type)
public BorkenLineView setSize(float columnsHeigth, float columnsWidth)
public BorkenLineView setTitle(float titleSize, int color, int width)
public BorkenLineView setTitleText(String title)
public BorkenLineView setCommentText(String comment)
public void flush()





© 著作权归作者所有

陈小默
粉丝 6
博文 39
码字总数 31230
作品 0
武汉
程序员
私信 提问
Google提供的MVP参考实现

项目原址:https://github.com/googlesamples/android-architecture.git 直接Clone项目看不到任何项目文件。需要按照说明checkout想看的branch。 先看看MVP架构。上一个个人比较喜欢的图。 ...

开源中国驻成都办事处
2016/04/21
3.6K
0
Kotlin Android Extensions使用指南

Kotlin Android Extensions是Kotlin团队开发的一个插件,目的是让我们在开发过程中更少的编写代码。目前包括了视图绑定的功能。 几种绑定视图方式对比 xml文件如下 第一种,传统方式绑定视图...

猴亮屏
2018/10/29
86
0
自定义View(九)-View的工作原理- View的layout()和draw()

前言 上一节我们将View的测量流程理的差不多了,这篇我们来看下View的剩下的2大流程layout(布局)和draw(绘制)。相对测量来说,布局与绘制就简单了许多,所以我们将这的两大流程放在一起讲解。...

g小志
2018/01/03
0
0
sql查询难题,对行数据统计和列数据统计问题

现有一个公司信息表,一个公司所属车辆表,现在要做一个统计视图,包括公司的基本信息,如名称,地址等,还包括公司所有的车辆总数,车辆座位总数,车辆吨位总数等,我写了一个sql, create or replac...

孙斐
2012/02/11
1K
3
Android显示框架:Android应用视图的载体View

关于作者 郭孝星,程序员,吉他手,主要从事Android平台基础架构方面的工作,欢迎交流技术方面的问题,可以去我的Github提issue或者发邮件至guoxiaoxingse@163.com与我交流。 第一次阅览本系...

郭孝星
2017/11/29
0
0

没有更多内容

加载失败,请刷新页面

加载更多

golang-字符串-地址分析

demo package mainimport "fmt"func main() {str := "map.baidu.com"fmt.Println(&str, str)str = str[0:5]fmt.Println(&str, str)str = "abc"fmt.Println(&s......

李琼涛
今天
4
0
Spring Boot WebFlux 增删改查完整实战 demo

03:WebFlux Web CRUD 实践 前言 上一篇基于功能性端点去创建一个简单服务,实现了 Hello 。这一篇用 Spring Boot WebFlux 的注解控制层技术创建一个 CRUD WebFlux 应用,让开发更方便。这里...

泥瓦匠BYSocket
今天
8
0
从0开始学FreeRTOS-(列表与列表项)-3

FreeRTOS列表&列表项的源码解读 第一次看列表与列表项的时候,感觉很像是链表,虽然我自己的链表也不太会,但是就是感觉很像。 在FreeRTOS中,列表与列表项使用得非常多,是FreeRTOS的一个数...

杰杰1号
今天
9
0
Java反射

Java 反射 反射是框架设计的灵魂(使用的前提条件:必须先得到代表的字节码的 Class,Class 类 用于表示.class 文件(字节码)) 一、反射的概述 定义:JAVA 反射机制是在运行状态中,对于任...

zzz1122334
今天
7
0
聊聊nacos的LocalConfigInfoProcessor

序 本文主要研究一下nacos的LocalConfigInfoProcessor LocalConfigInfoProcessor nacos-1.1.3/client/src/main/java/com/alibaba/nacos/client/config/impl/LocalConfigInfoProcessor.java p......

go4it
昨天
9
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部