Howard Lau
Howard Lau

Reputation: 173

Why only need to set the stroke width to show the stroke in MaterialCardView? Discrepancy with documentation

According to both Android Developer documentation and Material.io, both said I need to set both stroke width and stroke color in order to render the stroke

Android Developer documentation

"Stroke width can be set using the strokeWidth attribute. Set the stroke color using the strokeColor attribute. Without a strokeColor, the card will not render a stroked border, regardless of the strokeWidth value."

Material.io

"Note: Without an app:strokeColor, the card will not render a stroked border, regardless of the app:strokeWidth value."

However, I tested that only need to set the stroke width in my XML to show the stroke in white color in the material card view. In opposite, the ShapeableImageView needs to set both stroke width and color in order to show the stroke.

Any idea on why there is a discrepancy between the documentation and the actual code implementation in the MatericalCardView?

    <com.google.android.material.card.MaterialCardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:cardElevation="0dp
            app:strokeWidth="5dp"> //only this line to show stroke
    
                    <com.google.android.material.imageview.ShapeableImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:scaleType="centerCrop"
                        app:imageUrl='@{imageUrl}'> 
                   </com.google.android.material.imageview.ShapeableImageView>
    
</com.google.android.material.card.MaterialCardView>

Upvotes: 0

Views: 963

Answers (1)

Mohamed Rahal
Mohamed Rahal

Reputation: 73

You can adjust it by assigning a style to the component, and if it doesn't work, check your color file.

    <com.google.android.material.card.MaterialCardView
        style="@style/Widget.Material3.CardView.Outlined"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardElevation="0dp"
        app:strokeWidth="5dp"
        app:strokeColor="?attr/colorPrimary">

        <com.google.android.material.imageview.ShapeableImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="centerCrop"
            app:imageUrl='@{imageUrl}'></com.google.android.material.imageview.ShapeableImageView>

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

Upvotes: 0

Related Questions