在 android 中制作百分比条形图

Question

我正在寻找制作如下所示的百分比图表： click here

有什么想法可以在 android 中解决这个问题吗？

Answer 1

那里一定有一个库，但您也可以使用线性布局并在运行时间更改其权重，例如：

<LinearLayout
    android:id="@+id/attendance_layout"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_margin="10dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/button_second"
    android:orientation="horizontal"
    android:weightSum="100">
    <LinearLayout
        android:id="@+id/absent_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:background="@color/purple_200"
        android:gravity="center"
        android:orientation="horizontal" >
        <TextView
            android:id="@+id/text_absent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="50%"
            />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/present_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="30"
        android:gravity="center"
        android:background="@color/teal_200"
        android:orientation="horizontal">
        <TextView
            android:id="@+id/text_present"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="30%"
            />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/late_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:gravity="center"
        android:background="@color/teal_700"
        android:orientation="horizontal">
        <TextView
            android:id="@+id/text_late"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="20%"
            />
    </LinearLayout>

</LinearLayout>

Answer 2

这很容易在你的 xml 你需要这个：

<LinearLayout
    android:id="@+id/attendance_layout"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:orientation="horizontal"
    android:weightSum="100">
    <LinearLayout
        android:id="@+id/absent_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:background="@color/purple_200"
        android:gravity="center"
        android:orientation="horizontal" >
        <TextView
            android:id="@+id/text_absent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="50%"
            />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/present_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="30"
        android:gravity="center"
        android:background="@color/teal_200"
        android:orientation="horizontal">
        <TextView
            android:id="@+id/text_present"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="30%"
            />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/late_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:gravity="center"
        android:background="@color/teal_700"
        android:orientation="horizontal">
        <TextView
            android:id="@+id/text_late"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="20%"
            />
    </LinearLayout>

</LinearLayout>

这取自的回答，但有更多修改。

您可能想动态设置数据对吗？你可以这样做：

LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(
    LayoutParams.MATCH_PARENT,
    LayoutParams.MATCH_PARENT,
    100f /* This is the value of the width. You change it by getting value fro database or so. */
);
late_layout.setLayoutParams(param);

您可以将此代码用于所有部分

在 android 中制作百分比条形图

make percentage bar chart in android

java

android

kotlin

charts