Is it possible to have a textview slightly out of a cardview in a recyclerview?

Question

Okay this may seem to be a easy question but trust me i have been spending hours to accomplished this. Just want to know whether it is possible to bring out a textview slightly of the right side of the cardView. Btw the texview is under many layouts such as linear layout and relative layouts.

I have tried adding this code in the xml of its parents layout as well. android:clipToPadding="false" and android:clipChildren="false" and it still doesnt work. Im not sure why it doesnt work for me. I have attached the image of how i want the layout of the textview to look like.Should i add some code in the adapter of my recyclerview? Please help. Thanks in advance

  <android.support.v7.widget.CardView xmlns:tools="http://schemas.android.com/tools"
        xmlns:card_View="http://schemas.android.com/apk/res-auto"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:clipChildren="false"
        android:clipToPadding="false"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        card_View:cardUseCompatPadding="false">



     <LinearLayout
            android:id="@+id/random"
            android:clipChildren="false"
            android:clipToPadding="false"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">




<TextView
        android:id="@+id/random2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>



      <LinearLayout
            android:id="@+id/random3"
            android:clipChildren="false"
            android:clipToPadding="false"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">



  <TextView
        android:id="@+id/random4"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>



  <View
        android:id="@+id/random5"
        android:layout_width="0dp"
        android:layout_height="0dp"/>



<TextView
        android:id="@+id/this_is_the_textview_i_want_it_to_come_out_slightly"
        android:layout_marginEnd="-5dp"
        android:layout_marginRight="-5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>




        </LinearLayout>
        </LinearLayout>

    </android.support.v7.widget.CardView>

The code attached below is inside a cardView and the cardView will be placed in a recyclerview

Answer 1

There are multiple ways of achieving this effect. I'd do it by encapsulating the CardView inside another ViewGroup and then put the TextView (which should exceed the CardView bounds).

An example of one such layout:

<?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_width="match_parent"
    android:layout_height="match_parent"
    >

    <androidx.cardview.widget.CardView
        android:id="@+id/cardView"

        android:layout_width="match_parent"
        android:layout_height="300dp"

        android:layout_margin="20dp"

        android:foreground="#ACDBDA"

        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </androidx.cardview.widget.CardView>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:text="20% Off"
        android:textColor="#000000"
        android:textSize="18sp"
        android:textStyle="bold"

        android:layout_marginBottom="10dp"
        android:layout_marginEnd="10dp"

        android:padding="7dp"

        android:elevation="5dp"

        android:background="@drawable/temp_rounded_border"

        app:layout_constraintBottom_toBottomOf="@id/cardView"
        app:layout_constraintEnd_toEndOf="parent"
        />
</androidx.constraintlayout.widget.ConstraintLayout>

temp_rounded_border.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <solid android:color="#8080FF" />

    <corners
        android:radius="5dp"
        android:topRightRadius="0dp"
        android:bottomRightRadius="0dp"
        />

    <stroke android:color="#8080FF" android:width="1dp" />

</shape>

I haven't tested this code on a Device but here is what design view renders in Android Studio.