如何将相同的圆角设置为线性布局？

Posted 2023-02-24

【中文标题】如何将相同的圆角设置为线性布局？

【英文标题】：How to set the same rounded corner to linear layouts?

【发布时间】：2021-05-08 13:16:43

【问题描述】：

我正在尝试使用线性布局制作单个条形图（不想使用 MPandroidChart 或其他库）。 这是我想要实现的目标：

如您所见，无论布局的宽度如何，角的度数/半径都相同。 这是我所做的：

这看起来不错，但问题来了：当此线性布局具有较小的宽度时，半径无法按我想要的方式工作

我希望两者的半径角度相同，如下所示（蓝色部分应该但被切断）：

我希望我可以设置一些百分比的radius 属性，但这是不可能的。这是布局：

        <androidx.constraintlayout.widget.ConstraintLayout
            android:id="@+id/constraint_layout_statistics_budgeting_recycler_view_chart"
            android:layout_
            android:layout_
            android:layout_marginHorizontal="8dp"
            android:layout_marginTop="24dp"
            android:background="@drawable/rounded_bar_chart_total"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/image_view_statistics_budgeting_recycler_view_category_image">

            <LinearLayout
                android:id="@+id/linear_layout_statistics_budgeting_recycler_view_bar_chart"
                android:layout_
                android:layout_
                android:background="@drawable/rounded_bar_chart_spent"
                android:orientation="horizontal"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />
 </androidx.constraintlayout.widget.ConstraintLayout>

还有两个drawable 文件（唯一的区别是颜色）：

<?xml version="1.0" encoding="utf-8"?>
<!-- rounded_bar_chart_total-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="48dp" />
    <padding
        android:bottom="@dimen/margin_extra_small"
        android:left="@dimen/margin_extra_small"
        android:right="@dimen/margin_extra_small"
        android:top="@dimen/margin_extra_small" />
    <solid android:color="#8FEFEEEC" />
</shape>

<?xml version="1.0" encoding="utf-8"?>
<!--rounded_bar_chart_spent-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="48dp" />
    <solid android:color="#5CE662" />
</shape>```

Any help how to do this?

【问题讨论】：

它们显然不一样，因为 foist 有填充，我认为这是不必要的，第二个 xml 非常好，如果你需要填充，为什么不添加线性布局？

【参考方案1】：

您不必自己对进度条进行硬编码。似乎material components library 实现了这个（需要com.google.android.material:material:1.3.0'）。检查here 获取 github 文档，这是我做的一个示例：

    <com.google.android.material.progressindicator.LinearProgressIndicator
        android:id="@+id/linearProgressIndicator"
        android:layout_
        android:layout_
        android:indeterminate="false" // static progress bar
        android:progress="50"
        app:trackCornerRadius="10dp"
        app:trackThickness="20dp" />