Android scrollable screen for android charts

Question

There must be questions about this issue, but none of the ones I found related solved my problem. So.

I have the following scenario, I want a screen that I can scroll down over the multiples charts I will have. Like this image represents here

For now, with the code below, I am getting this result.

So, what is going on is that both charts are on each other, and I do not know why.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/mainLayout">

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/ScrollView01"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">

        <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/secondLayout">

            <com.github.mikephil.charting.charts.PieChart
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/pieChart" />

            <com.github.mikephil.charting.charts.BarChart
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/barChart"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_alignParentBottom="true" />

        </RelativeLayout>
    </ScrollView>

</RelativeLayout>

I am using the MPAndroidchart library.

Thanks.

Answer 1

Try this modify version

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/mainLayout">

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ScrollView01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true">

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/secondLayout">          


        <com.github.mikephil.charting.charts.PieChart
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="24dp"
            android:id="@+id/pieChart" />

        <com.github.mikephil.charting.charts.BarChart
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/barChart"
            android:layout_below="@+id/pieChart"              
            android:layout_marginTop="48dp"
            android:layout_centerHorizontal="true" />

    </RelativeLayout>
</ScrollView>

</RelativeLayout>