如何创建仅在上半部分或下半部分带有圆角的布局？

Posted 2023-04-19

【中文标题】如何创建仅在上半部分或下半部分带有圆角的布局？

【英文标题】：How to create a layout with rounded corners on only the top or bottom half?

【发布时间】：2022-01-12 08:57:32

【问题描述】：

我正在尝试将行项目添加到如下所示的 RecyclerView 中：

视图布局有2个版本；一种在上半部分带有图像，另一种仅包含文本。有几件事让这个布局很难创建；

图片仅顶部圆润 textview 的下半部分只在底部圆角 如果 ImageView 消失了，那么 textview 确实有圆角。

我宁愿只有一个行布局并用 XML 设计。这可能吗，还是我需要在代码中创建这个布局？

【参考方案1】：

您可以使用材料卡视图来实现此目的。这是完整布局文件的xml代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_>

<com.google.android.material.card.MaterialCardView
    android:layout_
    android:layout_
    android:layout_margin="10dp"
    app:cardCornerRadius="30dp"
    app:layout_constraintDimensionRatio="1:1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <LinearLayout
        android:layout_
        android:layout_
        android:orientation="vertical">

        <ImageView
            android:id="@+id/image"
            android:layout_
            android:layout_
            android:layout_weight="1"
            android:background="#406cca"
            android:visibility="visible" />

        <TextView
            android:id="@+id/text"
            android:layout_
            android:layout_
            android:layout_weight="1"
            android:background="#fb7500" />

    </LinearLayout>

</com.google.android.material.card.MaterialCardView>

</androidx.constraintlayout.widget.ConstraintLayout>

请记住，如果图像不存在，只需将 recyclerview 中特定图像视图的可见性设置为代码中的 View.GONE。

希望你能理解。如有任何疑问，请发表评论！

下面是这段代码的图片：

【讨论】：

这行得通。但是，如果您尝试使用 ConstraintLayout 而不是 LinearLayout 一切都将陷入困境。不幸的是，谷歌有时让创建布局变得如此困难。使用 ConstraintLayout 图像拒绝靠近圆角:(

@szaske 是的，我明白你的意思。事实上，我最初尝试了约束布局而不是线性布局......我的意思是，你实际上可以通过使用垂直链的约束布局来达到同样的效果。但同样，如果没有图像源，您还希望您的 imageView 消失。所以在垂直链上实现这一点有点令人沮丧。所以我认为最好使用垂直线性布局（如果我在某处错了，请纠正我）

【参考方案2】：

您需要创建一个drawable，在drawable中设置corners值，并将drawable设置为您想要顶部圆角的视图的背景。 这是一个有效的drawable：

<!--  res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    >
    <corners android:topLeftRadius="15dp"
        android:topRightRadius="15dp"/>
    <solid android:color="#ABC123"/>
   
</shape>

【讨论】：

当你添加 <solid android:color="#ABC123"/> 时它会起作用 - 一些用于显示圆角的令人满意的颜色

【参考方案3】：

图片持有者请使用library

<com.makeramen.roundedimageview.RoundedImageView
     android:id="@+id/imgUser"
     android:layout_
     android:layout_
     app:riv_corner_radius_top_left="5dp"
     app:riv_corner_radius_top_right="5dp"/>