代码之家  ›  专栏  ›  技术社区  ›  jolmos

下面带有MPAndroidChart(或其他)的列表视图

  •  2
  • jolmos  · 技术社区  · 10 年前

    编辑: 我更改了标题,因为它与MPAndroidChart无关,同样 ListView下面的另一个视图可能会出现问题。

    我正在尝试为我的android应用程序中的活动设置布局。 该活动由两个元素组成,一个是ListView,另一个是MPAndroidChart。

    我想实现的是将ListView放在顶部,取其所需的高度( wrap_content )下面是固定高度的图表。

    我是android的新手,所以我做的第一件事是制作一个RelativeLayout,上面和下面是列表,下面是图表。这在“纵向”中看起来很好(列表中几乎没有元素),但当我在“横向”中尝试时,图表消失了。。。

    因此,我制作了一个ScrollView包装整个内容(它是一个RelativeLayout),但我尝试了一些奇怪的行为(我想是因为列表视图的动态高度)。但无论如何,拥有两个不同的“卷轴”(一个用于列表,另一个用于整个活动)的想法似乎不太好。

    我现在要做的是将高度一分为二,在顶部有列表,在底部有图表,如下所示:

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:paddingBottom="@dimen/activity_vertical_margin"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" >
    
    
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:weightSum="2"
            android:orientation="vertical" >
    
            <ListView
                android:layout_width="wrap_content"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:id="@+id/list"
                android:listSelector="@android:color/transparent"
                android:layout_alignParentTop="true"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true">
    
            </ListView>
    
            <com.github.mikephil.charting.charts.LineChart
                android:id="@+id/chart"
                android:layout_width="match_parent"
                android:layout_below="@+id/list"
                android:layout_height="0dp"
                android:layout_weight="1"/>
    
        </LinearLayout>
    
    </RelativeLayout>
    

    但我不太喜欢。

    那幺,有什么想法如何做到这一点吗?

    2 回复  |  直到 10 年前
        1
  •  2
  •   Pankaj Nimgade    10 年前

    尝试此代码

    肖像模式

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#22bbcc"
        android:orientation="vertical">
    
        <ListView
            android:id="@+id/listView"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_margin="4dp"
            android:layout_weight="0.50"
            android:background="#ccbb22" />
    
        <LinearLayout
            android:id="@+id/LinearLayout_chart"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_margin="4dp"
            android:layout_weight="0.50"
            android:background="#ddaaaa"
            android:orientation="horizontal">
    
            <!--You can have your chart here -->
        </LinearLayout>
    </LinearLayout>
    

    enter image description here

    横向模式

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="4dp"
        android:background="#22bbcc"
        android:orientation="horizontal">
    
        <ListView
            android:id="@+id/listView"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="4dp"
            android:layout_weight="0.50"
            android:background="#ccbb22" />
    
        <LinearLayout
            android:id="@+id/LinearLayout_chart"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="4dp"
            android:layout_weight="0.50"
            android:background="#ddaaaa"
            android:orientation="horizontal">
    
            <!--You can have your chart here -->
        </LinearLayout>
    
    </LinearLayout>
    

    enter image description here

    如果可能,添加 PieChart 动态到 LinerLayout

    private PieChart mChart;
    private float[] yData = {5, 4, 5, 2}; 
    private String[] xData = {"Item_one", "Item_two", "Item_Three","Item_Four"};
    linearLayoutTwo = (LinearLayout)findViewById(R.id.LinearLayout_chart);
    mChart = new PieChart(this);
    
        // configure pie chart
        mChart.setUsePercentValues(true);
        mChart.setDescription("");
    
    
        // enable hole and configure
        mChart.setDrawHoleEnabled(false);
        mChart.setHoleColorTransparent(true);
        mChart.setHoleRadius(0);
        mChart.setTransparentCircleRadius(0);
    
        // enable rotation of the chart by touch
        mChart.setRotationAngle(0);
        mChart.setRotationEnabled(false);
    
        ArrayList<Entry> yVals1 = new ArrayList<Entry>();
    
        for (int i = 0; i < yData.length; i++)
            yVals1.add(new Entry(yData[i], i));
    
        ArrayList<String> xVals = new ArrayList<String>();
    
        for (int i = 0; i < xData.length; i++)
            xVals.add(xData[i]);
    
        // create pie data set
        PieDataSet dataSet = new PieDataSet(yVals1, "");
        dataSet.setSliceSpace(0);
        dataSet.setSelectionShift(1);
    
        // add many colors
        ArrayList<Integer> colors = new ArrayList<Integer>();
    
        for (int c : new int[]{Color.rgb(124, 185, 232), Color.rgb(178, 132, 190), Color.rgb(201, 255, 229),
                Color.rgb(100, 148, 143)}) {
            colors.add(c);
        }
    
    
        colors.add(ColorTemplate.getHoloBlue());
        dataSet.setColors(colors);
    
        // instantiate pie data object now
        PieData data = new PieData(xVals, dataSet);
        data.setValueFormatter(new PercentFormatter());
        data.setValueTextSize(9f);
        data.setValueTextColor(Color.BLACK);
    
        mChart.setData(data);
    
        // undo all highlights
        mChart.highlightValues(null);
    
        // update pie chart
        mChart.invalidate();
        linearLayoutTwo.addView(mChart);
        // customize legends
        Legend l = mChart.getLegend();
    
        l.setPosition(Legend.LegendPosition.RIGHT_OF_CHART);
        l.setXEntrySpace(4);
        l.setYEntrySpace(4);
    
        2
  •  0
  •   jolmos    10 年前

    最后我找到了一个解决方案,满足了我的需求。

    我把这个解决方案贴在这里,也许可以帮助别人。

    我所做的只是将图表作为ListView的页脚插入,所以我只需要在ListView的滚动条和MPAndroidChart的末尾(正如我所希望的那样)。

    为了实现这一点,我制作了一个新的布局文件, chartlayout.xml :

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="match_parent">
    
        <com.github.mikephil.charting.charts.LineChart
            android:id="@+id/chart"
            android:layout_width="match_parent"
            android:layout_height="200dp"/>
    </RelativeLayout>
    

    所以在我的活动java文件中,我从 chartlayout 使用充气机服务,然后我得到图表视图,最后我将其作为页脚添加到列表中:

        //get layout
        chartLayout = ((LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.chartlayout, null, false);
    
        //get view
        mChart = (LineChart) chartLayout.findViewById(R.id.chart);
    
        /*  
        *   chart stuff
        */
    
        ...
    
        mylistView.addFooterView(chartLayout);
    
    推荐文章