用MPAndroidChart实现可滑动的柱状图

用MPAndroidChart实现可滑动的柱状图

大家好,又见面了,我是全栈君。

转载时请记得标明源地址:https://my.oschina.net/lijindou/blog/799927

本人博客地址:  http://my.oschina.net/lijindou/blog

源码地址:http://download.csdn.net/detail/qq_33144317/9699763

其实原理很简单,就是将视图横向放大,然后 就成了滑动的 柱状图了

我就直接上图上代码了 

图:

102757_Fl1V_2728799.png

代码:

MainActivity.java

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;

import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;

import java.util.ArrayList;

/**
 * @author Gold Bean Lee
 * @time 20161202
 */
public class MainActivity extends Activity {

    private BarChart mBarChart;
    private BarChart mBarChart1;
    private BarChart mBarChart2;
    private BarCharts mBarCharts;

    private String[] color = {"#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD", "#C4FF8E", "#FFF88D", "#FFD38C", "#8CEBFF", "#FF8F9D", "#6BF3AD"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mBarCharts = new BarCharts();

        // 创建多张图表
        mBarChart = (BarChart) findViewById(R.id.spreadBarChart);
        mBarChart1 = (BarChart) findViewById(R.id.spreadBarChart1);
        mBarChart2 = (BarChart) findViewById(R.id.spreadBarChart2);

        mBarCharts.showBarChart(mBarChart, getBarData(10, 99), true);
        mBarCharts.showBarChart(mBarChart1, getBarData(20, 199), true);
        mBarCharts.showBarChart(mBarChart2, getBarData(20, 199), false);

    }

    /**
     * 这个方法是初始化数据的
     *
     * @param count X 轴的个数
     * @param range Y 轴的数据
     */
    public BarData getBarData(int count, float range) {
        ArrayList<String> xValues = new ArrayList<>();
        for (int i = 0; i < count; i++) {
            xValues.add("" + (i + 1) + "");// 设置每个柱壮图的文字描述
        }

        ArrayList<BarEntry> yValues = new ArrayList<>();
        for (int i = 0; i < count; i++) {
            float value = (float) (Math.random() * range/*100以内的随机数*/) + 3;
            yValues.add(new BarEntry(value, i));
        }
        // y轴的数据集合
        BarDataSet barDataSet = new BarDataSet(yValues, "测试图");
        ArrayList<Integer> colors = new ArrayList<>();
        for (int i = 0; i < count; i++) {
//            colors.add(Color.parseColor("#75bfe2"));
            colors.add(Color.parseColor(color[i]));
        }
        barDataSet.setColors(colors);
        // 设置栏阴影颜色
        barDataSet.setBarShadowColor(Color.parseColor("#01000000"));
        ArrayList<BarDataSet> barDataSets = new ArrayList<>();
        barDataSets.add(barDataSet);
        barDataSet.setValueTextColor(Color.parseColor("#FF8F9D"));
        // 绘制值
        barDataSet.setDrawValues(true);
        BarData barData = new BarData(xValues, barDataSets);
        return barData;
    }

}

BarCharts.java

import android.graphics.Color;
import android.graphics.Matrix;
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.data.BarData;

/**
 * @author Gold Bean Lee
 * @time 20161202
 */
public class BarCharts {

    /**
     * @param barChart  控件
     * @param barData   数据
     * @param isSlither 用来控制是否可以滑动
     */
    public void showBarChart(BarChart barChart, BarData barData, boolean isSlither) {
        //绘制高亮箭头
        barChart.setDrawHighlightArrow(false);
        //设置值显示在柱状图的上边或者下边
        barChart.setDrawValueAboveBar(true);
        //设置绘制网格背景
        barChart.setDrawGridBackground(true);
        //设置双击缩放功能
        barChart.setDoubleTapToZoomEnabled(false);
        //设置规模Y启用
        barChart.setScaleYEnabled(false);
        //设置规模X启用
        barChart.setScaleXEnabled(false);
        //启用设置阻力
        barChart.setScaleEnabled(true);
        //设置每个拖动启用的高亮显示
        barChart.setHighlightPerDragEnabled(false);
        // 设置硬件加速功能
        barChart.setHardwareAccelerationEnabled(true);
        // 设置绘制标记视图
        barChart.setDrawMarkerViews(true);
        // 设置启用日志
        barChart.setLogEnabled(true);
        // 设置突出功能
        barChart.setHighlightEnabled(true);
        // 设置拖动减速功能
        barChart.setDragDecelerationEnabled(true);
        // 数据描述
        barChart.setDescription("");
        // 如果没有数据的时候,会显示这个,类似ListView的EmptyView
        barChart.setNoDataTextDescription("没有数据了");
        barChart.setNoDataText("O__O …");
        // 是否显示表格颜色  
        barChart.setDrawGridBackground(false);


        /**
         * 下面这几个属性你们可以试试 挺有意思的
         * */
        // 设置是否可以触摸
        barChart.setTouchEnabled(isSlither);
        // 是否可以拖拽
        barChart.setDragEnabled(isSlither);//放大可拖拽
        // 是否可以缩放
        barChart.setScaleEnabled(false);
        // 集双指缩放
        barChart.setPinchZoom(false);


        // 设置背景
        barChart.setBackgroundColor(Color.parseColor("#01000000"));
        // 如果打开,背景矩形将出现在已经画好的绘图区域的后边。
        barChart.setDrawGridBackground(false);
        // 集拉杆阴影
        barChart.setDrawBarShadow(false);
        // 图例
        barChart.getLegend().setEnabled(false);
        // 设置数据
        barChart.setData(barData);
        // 隐藏右边的坐标轴 (就是右边的0 - 100 - 200 - 300 ... 和图表中横线)
        barChart.getAxisRight().setEnabled(false);
        // 隐藏左边的左边轴 (同上)
        // 网格背景颜色
        barChart.setGridBackgroundColor(Color.parseColor("#00000000"));
        // 是否显示表格颜色
        barChart.setDrawGridBackground(false);
        // 设置边框颜色
        barChart.setBorderColor(Color.parseColor("#00000000"));
        // 说明颜色
        barChart.setDescriptionColor(Color.parseColor("#00000000"));
        // 拉杆阴影
        barChart.setDrawBarShadow(false);
        // 打开或关闭绘制的图表边框。(环绕图表的线)
        barChart.setDrawBorders(false);
        Legend mLegend = barChart.getLegend(); // 设置比例图标示
        // 设置窗体样式
        mLegend.setForm(Legend.LegendForm.CIRCLE);
        // 字体
        mLegend.setFormSize(4f);
        // 字体颜色
        mLegend.setTextColor(Color.parseColor("#00000000"));
        XAxis xAxis = barChart.getXAxis();
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setDrawGridLines(false);
        xAxis.setSpaceBetweenLabels(2);
//        xAxis.setTextColor(0x000000); // 设置轴标签的颜色。
//        xAxis.setTextSize(18); // 设置轴标签的文字大小。
//        xAxis.setTypeface( ) ;// 设置轴标签的 Typeface。
//        xAxis.setGridColor( int color); /// 设置该轴的网格线颜色。
//        xAxis.setGridLineWidth( float width);// 设置该轴网格线的宽度。
//        xAxis.setAxisLineColor( int color); // 设置轴线的轴的颜色。
//        xAxis.setAxisLineWidth( float width);// 设置该轴轴行的宽度。
//        barChart.animateY(1000); // 立即执行的动画,Y轴

        if (isSlither) {
            //当为true时,放大图
            // 为了使 柱状图成为可滑动的,将水平方向 放大 2.5倍
            barChart.invalidate();
            Matrix mMatrix = new Matrix();
            mMatrix.postScale(2f, 1f);
            barChart.getViewPortHandler().refresh(mMatrix, barChart, false);
            barChart.animateY(1000);
        } else {
            //当为false时 不对图进行操作
            barChart.animateY(1000);
        }


    }

}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="dialog.com.mp.MainActivity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">

                    <com.github.mikephil.charting.charts.BarChart
                        android:id="@+id/spreadBarChart"
                        android:layout_width="match_parent"
                        android:layout_height="200dp"
                        android:layout_gravity="center_horizontal" />

                </LinearLayout>
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">

                    <com.github.mikephil.charting.charts.BarChart
                        android:id="@+id/spreadBarChart1"
                        android:layout_width="match_parent"
                        android:layout_height="200dp"
                        android:layout_gravity="center_horizontal" />
                </LinearLayout>
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">

                    <com.github.mikephil.charting.charts.BarChart
                        android:id="@+id/spreadBarChart2"
                        android:layout_width="match_parent"
                        android:layout_height="200dp"
                        android:layout_gravity="center_horizontal" />
                </LinearLayout>
            </LinearLayout>

            <!--<RelativeLayout-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="wrap_content">-->
            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart2"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->
            <!--</RelativeLayout>-->

            <!--<RelativeLayout-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="wrap_content">-->
            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart3"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->
            <!--</RelativeLayout>-->

            <!--<RelativeLayout-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="wrap_content">-->
            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart4"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->
            <!--</RelativeLayout>-->

            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart5"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->

            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart6"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->

            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart7"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->

            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart8"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->

            <!--<com.github.mikephil.charting.charts.BarChart-->
            <!--android:id="@+id/spreadBarChart9"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="200dp"-->
            <!--android:layout_gravity="center_horizontal"/>-->
        </LinearLayout>
    </ScrollView>

</LinearLayout>

 

转载于:https://my.oschina.net/lijindou/blog/799927

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/108742.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • MySql必知必会实战练习(二)数据检索

    在上篇博客MySql必知必会实战练习(一)表创建和数据添加中完成了各表的创建和数据添加,下面进行数据检索和过滤操作。1.Select子句使用顺序select>DISTINCT>f

    2021年12月29日
    33
  • idea改背景色为护眼(电脑背景色调为护眼色)

    首先做一些简答的记录,护眼色等等的设置很久以前机器上已经设置过了,今天偶尔要在其他机器上重新做一些设置反而忘记了很多步骤,设置后的HTML页面如何所示:默认情况下,当只是设置General通用的颜色为护眼色时,那么对于html等页面的标签色背景色等等仍然还是灰色等默认颜色,于背景色相对于及其难看,所以在此记录一下如何设置通用颜色为背景色,并且针对特定的文本格式如html,java等格式,修改所对…

    2022年4月13日
    54
  • java最长递增子序列_求数组中最长递增子序列「建议收藏」

    java最长递增子序列_求数组中最长递增子序列「建议收藏」什么是最长递增子序列呢?问题描述如下:设L=是n个不同的实数的序列,L的递增子序列是这样一个子序列Lin=,其中k1对于这个问题有以下几种解决思路:1、把a1,a2,…,an排序,假设得到a’1,a’2,…,a’n,然后求a的a’的最长公共子串,这样总的时间复杂度为o(nlg(n))+o(n^2)=o(n^2);2、动态规划的思路:另设一辅助数组b,定义b[n]表示以a[n]结尾的最长递增…

    2022年4月30日
    55
  • 环信集成常见错码

    环信集成常见错码

    2021年11月9日
    109
  • seekg的应用案例

    seekg的应用案例在学习C++文件流控制时(链接)我们知道C++有一个标准库fstream该库定义了三个数据类型ofstreamifstream和fstream在练习相应的案例时,seekg()函数掌握的不是很好,后经过多次尝试,可以正常调用了代码如下:#include<fstream>#include<iostream>usingnamespacestd;intmain(){chardata[100];////以写模式打开文件

    2022年5月22日
    37
  • python isinstance函数_Python isinstance函数介绍

    python isinstance函数_Python isinstance函数介绍isinstance object classinfo 判断实例是否是这个类或者 objectobject 是变量 classinfo 是类型 tuple dict int float 判断变量是否是这个类型复制代码代码如下 classobjA passA objA B a v C astring printisinsta A objA printisinsta

    2025年9月26日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号