Develop Reference

Android FrameLayout Views Overlapping not Working

I Have the following layout and I need the favorite image to placed on the upper right corner of the itemImage using FrameLayout
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ItemDetails"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="20dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/itemdimage"
android:layout_width="match_parent"
android:layout_height="300dp"
android:scaleType="fitEnd"
tools:srcCompat="#mipmap/ic_launcher"
/>
<ImageView
android:id="#+id/favorite"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="end"
android:layout_margin="10dp"
tools:srcCompat="#mipmap/ic_launcher_round"
android:elevation="10dp"/>
</FrameLayout>
But the favorite image is never show ?? what is wrong with my layout
Any help will be much appreciated

Maybe this layout will work. I changed tools:srcCompat to android:src. tools: attributes are only visible in AndroidStudio, they are removed from the build.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="20dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/itemdimage"
android:layout_width="match_parent"
android:layout_height="300dp"
android:scaleType="fitEnd"
android:src="#mipmap/ic_launcher"/>
<ImageView
android:id="#+id/favorite"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="end"
android:layout_margin="10dp"
android:elevation="10dp"
android:src="#mipmap/ic_launcher_round" />
</FrameLayout>
</LinearLayout>
</ScrollView>
The result is this :

How can I create a CardView and ImageView with a rounded border?

I want to make the following design:
But I do not know how to round up the ImageView and vertical lines.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="10dp"
app:cardCornerRadius="40dp">
</android.support.v7.widget.CardView>
</LinearLayout>
minSdkVersion 16
targetSdkVersion 28
EDIT:
According to document: CardView
Due to expensive nature of rounded corner clipping, on platforms
before Lollipop, CardView does not clip its children that intersect
with rounded corners. Instead, it adds padding to avoid such
intersection (See setPreventCornerOverlap(boolean) to change this
behavior).
I wrote this code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:background="#cccccc"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
app:cardCornerRadius="40dp"
app:cardElevation="0dp"
app:cardPreventCornerOverlap="false">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.makeramen.roundedimageview.RoundedImageView
android:layout_width="170dp"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:src="#drawable/test_ex"
app:riv_corner_radius_bottom_left="40dp"
app:riv_corner_radius_top_left="40dp" />
<View
android:layout_width="4dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#color/colorPrimaryDark" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
And the result in the Android 4.3 emulator:
How can I do the clipping? What is the best solution?

Try below code :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="10dp"
app:cardCornerRadius="40dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:layout_width="150dp"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher_background"
android:scaleType="centerCrop"
android:id="#+id/image_"/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:rotation="15"
android:layout_marginLeft="-30dp"
android:layout_marginBottom="-40dp"
android:layout_toRightOf="#id/image_">
</View>
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#be0202"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"/>
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#be0202"
android:layout_alignParentRight="true"
android:layout_marginRight="30dp"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Result :

Already answered by charan
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:map="http://schemas.android.com/tools"
android:id="#+id/cardview1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="26dp"
card_view:cardElevation="10dp"
card_view:cardMaxElevation="2dp"
card_view:contentPadding="0dp"
android:layout_margin="#dimen/dp_8">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="200dp"
android:padding="5dp">
<TextView
android:id="#+id/name_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="HELLO!"
android:textSize="40sp"/>
</RelativeLayout>
</androidx.cardview.widget.CardView>
Result

How can I remove the outside of view from CardView?

I have the following code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="140dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
app:cardCornerRadius="50dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="true"
android:clipToPadding="true">
<View
android:layout_width="6dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginRight="15dp"
android:background="#drawable/vertical_line_main" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
And get this result:
my result
I want remove view that outside of cardview.
In fact I want have a vertical line with radius. (Remove choosen by green pen)

It's because of your linear layout , why you are not using cardview as parrent view ?
<android.support.v7.widget.CardView
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"
android:layout_width="match_parent"
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
app:cardCornerRadius="50dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="true"
android:clipToPadding="true">
<View
android:layout_width="6dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginRight="15dp"
android:background="#drawable/vertical_line_main" />
</RelativeLayout>
</android.support.v7.widget.CardView>

Border image for CardView in Android

Please forgive me if I am presenting it wrong or my way of asking this question is wrong, but I have a question on how to set an image as the border of the CardView in Android. Below is border image which i want to set border as for the Cardview.
Below is the code of my layout.
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="60"
card_view:cardBackgroundColor="#1a6ee8"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<me.zhanghai.android.materialprogressbar.MaterialProgressBar
android:id="#+id/progressView"
style="#style/Widget.MaterialProgressBar.ProgressBar.Large"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true" />
<ImageView
android:id="#+id/dailyKolam"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:scaleType="fitXY" />
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/gradient_header"
android:padding="16dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/kolamDay"
android:textColor="#fff"
android:textSize="18sp" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>

Wrap your whole layout in FramLayout set frame as background image to FramLayout use padding as match edges with frame image
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_height="0dp"
android:layout_weight="60"
android:background="#drawable/frame_border">
<android.support.v7.widget.CardView
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardBackgroundColor="#1a6ee8"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp"
android:padding="20sdp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<me.zhanghai.android.materialprogressbar.MaterialProgressBar
android:id="#+id/progressView"
style="#style/Widget.MaterialProgressBar.ProgressBar.Large"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true" />
<ImageView
android:id="#+id/dailyKolam"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:scaleType="fitXY" />
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/gradient_header"
android:padding="16dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/kolamDay"
android:textColor="#fff"
android:textSize="18sp" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
</FrameLayout>

Android - selectableItemBackground doesn't showed when click on item

I have a Recycler view and their items should be clickable. I want that all line do apply the ?selectableItemBackground effect but this does not occurs. The imageview is occupying all the item layout as an background. Why the selectable effect doesn't working as well?
this is my xml file
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="?listPreferredItemHeightLarge"
android:background="?selectableItemBackground"
android:descendantFocusability="blocksDescendants">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true">
<ImageView
android:id="#+id/background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="#string/app_name"
android:src="#drawable/holder"
android:scaleType="centerCrop"
android:focusableInTouchMode="false"/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"
android:alpha="0.3" />
</FrameLayout>
<br.com.lexsis.pizzahut.presentation.widgets.CustomFontTextView
android:id="#+id/group_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
style="#style/TextView.EMenu" />
</RelativeLayout>

You can add another RelativeLayout and add android:background="?attr/selectableItemBackground" to it:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="?listPreferredItemHeightLarge"
android:background="?selectableItemBackground"
android:descendantFocusability="blocksDescendants">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true">
<ImageView
android:id="#+id/background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="#string/app_name"
android:src="#drawable/holder"
android:scaleType="centerCrop"
android:focusableInTouchMode="false"/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"
android:alpha="0.3" />
</FrameLayout>
<br.com.lexsis.pizzahut.presentation.widgets.CustomFontTextView
android:id="#+id/group_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
style="#style/TextView.EMenu" />
</RelativeLayout>
</RelativeLayout>
Setting it to the root layout never worked for me.