[英]Round Top Left/Right Corner CardView Android Not work
我有一個材料卡片視圖作為根項目。 我想為它添加圓形的左上角和右上角。 我將這些屬性添加到它的樣式中,但它做了一點改動並且不能正常工作。
房車物品:
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.card.MaterialCardView
android:layout_width="@dimen/_150sdp"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
style="@style/CardViewRoundedtop"
xmlns:android="http://schemas.android.com/apk/res/android">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<com.google.android.material.textview.MaterialTextView
android:background="@color/primaryColor"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@id/imgFastfood"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
tools:text="FastFood"
android:id="@+id/TVNameCategory"
/>
<ImageView
app:layout_constraintTop_toBottomOf="@id/TVNameCategory"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_width="match_parent"
android:layout_height="@dimen/_110sdp"
tools:src="@drawable/fastfood"
android:id="@+id/imgFastfood"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
風格:
<style name="CardViewRoundedtop" parent="Widget.MaterialComponents.CardView">
<item name="android:topLeftRadius">16dp</item>
<item name="android:topRightRadius">16dp</item>
<item name="android:bottomLeftRadius">0dp</item>
<item name="android:bottomRightRadius">0dp</item>
</style>
PS:我讀到了一個錯誤,我必須將左下/右下半徑更改為 1dp。 它根本沒有幫助。
現在:
我期待的東西:
為了在這里顯示,我使用了 app:cardCornerRadius="16dp" 並設置了所有四個角。
編輯:我使用了“cornerSizeTopRight”。 似乎它以不同的方式工作。
好吧,我為你找到了解決方案。 只需將背景顏色從TextView
更改為CardView
。 所以從MaterialTextView
中刪除下一行
android:background="@color/colorPrimary"
並將這些行添加到您的MaterialCardView
:
app:cardBackgroundColor="@color/colorPrimary"
app:cardPreventCornerOverlap="false"
同樣在您的ImageView
中添加:
android:scaleType="centerCrop"
之后你會得到這個:
這是我的完整XML code
:
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.card.MaterialCardView
style="@style/MyCardView"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:cardBackgroundColor="#EDC911"
app:cardPreventCornerOverlap="false"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.textview.MaterialTextView
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@id/imgFastfood"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
tools:text="FastFood"
android:id="@+id/TVNameCategory"/>
<ImageView
app:layout_constraintTop_toBottomOf="@id/TVNameCategory"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_width="match_parent"
android:scaleType="centerCrop"
android:layout_height="110dp"
tools:src="@drawable/Screenshot_1"
android:id="@+id/imgFastfood"/>
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
編輯:
如果您的圖像是透明的並且背景是黃色的,只需將此行添加到您的ImageView
android:background="@android:color/white
這是style.xml
<style name="MyCardView" parent="@style/Widget.MaterialComponents.CardView">
<item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.MaterialCardView.Cut</item>
</style>
<style name="ShapeAppearanceOverlay.MaterialCardView.Cut" parent="">
<item name="cornerFamilyTopLeft">rounded</item>
<item name="cornerFamilyTopRight">rounded</item>
<item name="cornerSizeTopRight">8dp</item>
<item name="cornerSizeTopLeft">8dp</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.