Reputation: 898
I'm trying to move an ImageView slightly out of the cardView, but the cardview keeps clipping the child.
I have following XML structure:
<RecyclerView>
<CardView>
<LinearLayout>
<LinearLayout>
<ImageView/>
...
I have set all containers with:
clipToPadding="false"
clipChildren="false"
And everything besides the RecyclerView got setClipToOutline="false"
.
On top the cardView has cardUseCompatPadding="true"
Android Studio predicts the following:
Screenshot out of Android Studio (SO prevents the image, since I'm new here with little reputation..)
But for whatever reason on my phone (Galaxy A3, Lineage OS, Android 9) the image view is still clipped.
Any idea how I can get the desired behavior not only in Android Studio but also on my phone?
UPDATE
card_view.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:cardView="http://schemas.android.com/tools">
<data>
<variable name="..."
type="..."/>
</data>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
app:cardElevation="0dp"
app:cardCornerRadius="5dp"
app:cardUseCompatPadding="true"
android:clipToPadding="false"
android:clipChildren="false"
cardView:setClipToOutline="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:clipChildren="false"
cardView:setClipToOutline="false"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_marginBottom="5dp"
android:clipToPadding="false"
android:clipChildren="false"
cardView:setClipToOutline="false"
android:orientation="horizontal">
<ImageView
android:id="@+id/card_view_flag"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_margin="3dp"
android:translationY="-10dp"
android:clipToPadding="false"
cardView:setClipToOutline="false"
android:src="@drawable/colored_flag"/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"/>
<CheckBox
style="?android:attr/starStyle"
android:scaleX="1.5"
android:scaleY="1.5"
android:layout_marginEnd="5dp"
android:layout_width="35dp"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.5"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.5"/>
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
</layout>
recyclerview..
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:clipChildren="false"
android:paddingBottom="70dp"
android:scrollbars="vertical" />
Upvotes: 0
Views: 1118
Reputation: 898
Just to give a well formatted full result of what @Sinner was leading me to...
Since my ViewHolder is inflated like this:
@Override
public ListAdapter.ViewHolder onCreateViewHolder(ViewGroup parent,
int viewType)
{
CardView v = (CardView) LayoutInflater.from(parent.getContext())
.inflate(R.layout.list_card, parent, false);
ViewHolder vh = new ViewHolder(v);
return vh;
}
And I use CardView all the way downstream, I modified @Sinners answer like this to make it work:
<CardView>
<ConstraintLayout>
<CardView>
<ImageView/>
With the outer CardView being transparent, the ConstrainLayout having a padding and clipToPadding="false"
. Then the ImageView could sit outside of the inner CardView and look as supposed :)
Thanks!
Upvotes: 1
Reputation: 2966
All you have to do is put the image outside the cardView
<ConstraintLayout>
<CardView>
<ImageView/>
Upvotes: 0