MoreLineAndBarChart

廢話不多說(shuō)，先上效果圖

本框架提供圖表組合實(shí)現(xiàn)，集成之后你可以實(shí)現(xiàn)：

圖一.png

圖二.png

圖三.png

圖四.png

圖五.png

圖六.png

• 顯示柱狀圖表（圖一）
• 顯示多條折線圖（圖二）
• 顯示單條折線圖（圖三）
• 顯示折線圖每個(gè)點(diǎn)，以及設(shè)置實(shí)心空心（圖四）
• 柱狀圖和多條折線圖一起顯示（圖五）
• 顯示所有效果（圖六）

簡(jiǎn)單使用

1. 首先在項(xiàng)目中添加 jitpack.io 庫(kù)

allprojects {
        repositories {
            ...
            maven { url 'https://jitpack.io' }
        }
    }

2. 然后在項(xiàng)目中添加依賴

dependencies {
            implementation 'com.github.leo2777:MoreLineAndBarChart:1.0.2'
    }
 

3. 在想要實(shí)現(xiàn)的布局當(dāng)中添加控件

  <leo.work.morelineandbarchart.chart.MoreLineAndBarChart
        android:id="@+id/main_chart"
        android:layout_width="match_parent"
        android:layout_height="300dp"/>

4. 綁定控件之后即可設(shè)置數(shù)據(jù)

        moreLineAndBarChart=findViewById(R.id.main_chart);
    
    
        //.......
    
    //設(shè)置假數(shù)據(jù)
    Random random=new Random();
        List<Float> value1=new ArrayList<>();
        List<Float> value2=new ArrayList<>();
        List<Float> value3=new ArrayList<>();
        List<Float> barValue=new ArrayList<>();
        List<String > bottomValue=new ArrayList<>();
        for (int i=0;i<5;i++){
            value1.add((float) random.nextInt(60));
            value2.add((float) random.nextInt(40));
            value3.add((float) random.nextInt(5));
            barValue.add((float) random.nextInt(50));
            bottomValue.add("指標(biāo)");
        }
    
    
        moreLineAndBarChart.setBottomValues(bottomValue);//設(shè)置底部數(shù)據(jù)
        moreLineAndBarChart.setLinesData(value1,value2,value3);//設(shè)置折線圖數(shù)據(jù)，
        moreLineAndBarChart.setBarChartValues(barValue);//設(shè)置柱狀圖數(shù)據(jù)
        moreLineAndBarChart.setLinesColors(Color.BLUE,Color.YELLOW,Color.RED);//設(shè)置折線的顏色，不設(shè)置會(huì)有默認(rèn)，但是一旦設(shè)置需和上面的折線圖的條數(shù)一樣。
        moreLineAndBarChart.setLineWidth(4f);//設(shè)置折線圖寬度

        moreLineAndBarChart.setDrawPoint(true);//繪制點(diǎn)
        moreLineAndBarChart.setSolid(true);//設(shè)置是否空心，搭配繪制點(diǎn)
        moreLineAndBarChart.setDrawBar(true);//設(shè)置是否繪制柱狀圖，不添加柱狀圖數(shù)據(jù)也有同樣效果
        moreLineAndBarChart.setShowGrid(true);//是否繪制表格線，目前只有橫向分割線
        moreLineAndBarChart.setShowLineValue(true);//是否顯示折線圖每個(gè)點(diǎn)的數(shù)值（當(dāng)點(diǎn)太多的時(shí)候不生效）

        //.......等等，具體看下方

        //設(shè)置完數(shù)據(jù)之后調(diào)用刷新，否則不生效。
        moreLineAndBarChart.invalidateChart();

進(jìn)階使用

1. 可以直接在布局文件當(dāng)中設(shè)置需要的屬性

    <leo.work.morelineandbarchart.chart.MoreLineAndBarChart
        android:id="@+id/main_chart"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        app:chart_is_slide_point="true"
        app:chart_bottom_text_color="@color/colorPrimary"
        app:chart_is_show_grid="true"
        app:chart_bottom_padding="10dp"
        app:chart_line_size="1dp"/>

2. 框架內(nèi)可以設(shè)置的屬性

    //左邊顯示的指標(biāo)數(shù)
        <attr name="chart_left_index_num" format="integer"/>


        //左邊指數(shù)的字體大小
        <attr name="chart_left_index_text_size" format="dimension"/>
        //下方指標(biāo)的字體大小
        <attr name="chart_bottom_text_size" format="dimension"/>
        //中間某一點(diǎn)的值具體大小
        <attr name="chart_center_text_size" format="dimension"/>
        //折線圖線的大小
        <attr name="chart_line_size" format="dimension"/>
        //表格分割線具體大小
        <attr name="chart_grid_size" format="dimension"/>
        //底部線的具體大小
        <attr name="chart_bottom_line_size" format="dimension"/>
        //左邊指標(biāo)的距離
        <attr name="chart_left_index_padding" format="dimension"/>
        //圖表上方的距離
        <attr name="chart_chart_top_padding" format="dimension"/>
        //圖表下方的距離
        <attr name="chart_bottom_padding" format="dimension"/>




        //左邊指標(biāo)的具體顏色
        <attr name="chart_left_index_text_color" format="color"/>
        //中間值的顏色
        <attr name="chart_center_index_text_color" format="color"/>
        //下方指標(biāo)的顏色
        <attr name="chart_bottom_text_color" format="color"/>
        //柱狀圖的顏色
        <attr name="chart_bar_color" format="color"/>
        //分割線的顏色
        <attr name="chart_grid_color" format="color"/>
        //底部線的顏色
        <attr name="chart_bottom_line_color" format="color"/>
        //折線的顏色
        <attr name="chart_line_color" format="color"/>
        //圖表的背景顏色
        <attr name="chart_background_color" format="color"/>
        //中心點(diǎn)的顏色（點(diǎn)為空心）
        <attr name="chart_line_point_center_color" format="color"/>




        //是否顯示柱狀圖
        <attr name="chart_is_show_bar_chart" format="boolean"/>
        //是否畫(huà)點(diǎn)
        <attr name="chart_is_draw_point" format="boolean"/>
        //繪制的點(diǎn)是否空心
        <attr name="chart_is_slide_point" format="boolean"/>
        //是否顯示折線圖都一點(diǎn)的值
        <attr name="chart_is_show_index_text" format="boolean"/>
        //是否顯示分割線
        <attr name="chart_is_show_grid" format="boolean"/>

github直達(dá)連接 https://github.com/leo2777/MoreLineAndBarChart

這是一條結(jié)束線