Develop Reference

How to center an ImageView on the edge of a cardView?

I have a layout like this:
My xml for that layout:
<?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"
android:fillViewport="true"
tools:context=".view.testviews.ProfileFragment"
android:background="#color/colorDarkGrey">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_marginStart="20dp"
android:layout_marginTop="100dp"
android:layout_marginEnd="20dp"
app:cardCornerRadius="16dp">
<FrameLayout
android:layout_gravity="center_horizontal"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="-50dp">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:src="#drawable/user_image_placeholder"
app:civ_border_color="#FF000000"
app:civ_border_width="2dp">
</de.hdodenhof.circleimageview.CircleImageView>
</FrameLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
I'm trying to center the circleImageView on the edge of the cardView. But the top part of it is invisible. I looked up for similar questions, but they couldn't meet my requirements. How can I achieve this?
So I tried #PPartisan's solution, and it made it like this:
The code for that :
<?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"
android:fillViewport="true"
tools:context=".view.testviews.ProfileFragment"
android:background="#color/colorDarkGrey">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.cardview.widget.CardView
android:id="#+id/cardView2"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_marginStart="20dp"
android:layout_marginTop="150dp"
android:layout_marginEnd="20dp"
app:cardCornerRadius="16dp">
</androidx.cardview.widget.CardView>
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="90dp"
android:src="#drawable/user_image_placeholder"
app:civ_border_color="#FF000000"
app:civ_border_width="2dp"
>
</de.hdodenhof.circleimageview.CircleImageView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Don't make your ImageView a child of the CardView, as it will be clipped by its parent. Also, when considering XML, the drawing order is specified from top to bottom, which means that Views specified later in the XML will be drawn over any views that are specified earlier. This mean you should draw your CardView first, and then your CircleImageView. Your layout structure should therefore be:
<CardView.../>
<...CircleImageView.../>
I would also recommend you use CoordinatorLayout as it will be simpler to use features like guidelines to correctly align your various views.
Edit: Thankyou Adinia for pointing out in the comments that it is also necessary to set an elevation on the image to ensure it draws on top.

android:layout_gravity="center"
So your layout becomes:
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardCornerRadius="80dp"
app:cardElevation="10dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/titelbild280x280"
/>
</android.support.v7.widget.CardView>

Inside Framelayout i have 1 cardview and an image view. I want the image view over the card view. What i want to do

I was trying to make an image view over the card view. So I used Framelayout. Inside that i added 1 cardview after that I added an image view. If I use a LinearLayout instead of cardview the image view views over the linearlayout. But if I use card view the image view is not getting over the card view. Please help me ...
I have shown what I have

put your card view inside AnyLayout like LinerarLayout
<FrameLayout>
<LinearLayout>
<CardView/>
</LinearLayout>
<ImageView/>
</FrameLayout>

Try with something like below:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".CustomGallery"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="Dummy Text"
android:gravity="center"/>
<!-- Add more Views -->
<FrameLayout
android:layout_width="150dp"
android:layout_height="150dp"
android:clickable="true"
android:layout_marginStart="20dp"
android:layout_marginEnd="20dp"
android:layout_gravity="center_horizontal">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardCornerRadius="10dp"
app:cardElevation="0dp">
<!--<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/add_menu_item_logo"
android:scaleType="fitXY"
android:src="#drawable/ic_baseline_brightness_low_24"
/>-->
</androidx.cardview.widget.CardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/add_menu_logo_placeholder">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#drawable/ic_baseline_brightness_low_24"/>
</FrameLayout>
</FrameLayout>
</LinearLayout>

Please use card view like this
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardElevation="0dp"
android:elevation="0dp"
android:layout_centerInParent="true" />
Note the important attribs are
app:cardElevation="0dp"
and android:elevation="0dp"
It will set the elevation to 0.

Android CardView with rounded corners displays grey corners

I'm inflating a custom layout with CardView inside the layout.
The rounded corners are displayed as expected but I also get grey background behind the corners.
The code is simple, uses a CardView with corner radius and a background color.
I've tried setting transparent background but doesn't work. However, if i set another opaque color, it is displayed in corners.
Code is attached.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="wrap_content"
android:background="#android:color/transparent">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardBackgroundColor="#android:color/white"
app:cardCornerRadius="6dp"
app:cardElevation="5dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent">
<TextView
android:id="#+id/tvProgress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/ivIcon"
android:layout_toStartOf="#+id/ivIcon"
android:background="#android:color/transparent"
android:padding="#dimen/elementPaddingSmall"
android:text="Initial Discussion"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#android:color/black" />
<ImageView
android:id="#+id/ivIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="#color/lightBrown"
android:scaleType="centerInside"
android:src="#drawable/ic_checkmark_circle" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
Result:

It is because of shadow, you need to give space to cardview to show full shadow. Add android:layout_margin="5dp" to CardView and you will see that the "grey" color is cut shadow.
Solution is adding app:cardUseCompatPadding="true" to CardView and it will give needed spacing.

Try this...
Just set 0 value to app:cardElevation
.....
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardBackgroundColor="#android:color/white"
app:cardCornerRadius="6dp"
app:cardElevation="0dp">
.....
OR you can call cardView.setCardElevation(0) to disable shadow programmatically.

Remove the parent RelativeLayout that is wrapping the CardView and you are good to go. Just like this:
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content"
app:cardBackgroundColor="#android:color/white"
app:cardCornerRadius="6dp"
app:cardElevation="5dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent">
<TextView
android:id="#+id/tvProgress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/ivIcon"
android:layout_toStartOf="#+id/ivIcon"
android:background="#android:color/transparent"
android:padding="#dimen/elementPaddingSmall"
android:text="Initial Discussion"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#android:color/black"/>
<ImageView
android:id="#+id/ivIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="#color/lightBrown"
android:scaleType="centerInside"
android:src="#drawable/ic_checkmark_circle"/>
</RelativeLayout>
</android.support.v7.widget.CardView>

If someone faces the problem when the edges' color is darker than you set, it could happen if you set the color in #AARRGGBB format. To fix this issue, just set the color in the normal #RRGGBB format.

Change app:cardUseCompatPadding="true" to card_view:cardUseCompatPadding="true"

Android how to change the black default background color of the app

I tried everything that i can possibly do but it seems like it requires a different approach to change the color of the black default blackground.
Here is the picture: http://imgur.com/a/CkQGX
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#EE7469"
android:orientation="horizontal">
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_margin="8dp"
card_view:cardUseCompatPadding="true"
card_view:cardCornerRadius="10dp"
android:background="#689F38"
card_view:cardElevation="5dp"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/list_item_string"
android:layout_centerVertical="true"
android:layout_alignParentStart="true"
android:paddingStart="8dp"
android:textSize="18sp"
tools:textSize="12sp"
android:background="#689F38"/>
<!-- ADDED SPACER VIEW -->
<View
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#689F38"
android:layout_weight="1"
/>
<!-- /ADDED SPACER VIEW -->
<Button
android:layout_marginTop="10dp"
android:id="#+id/delete_btn"
android:layout_width="30dip"
android:layout_height="30dip"
android:layout_gravity="right"
android:background="#android:drawable/ic_delete"/>
<Button
android:layout_marginTop="10dp"
android:id="#+id/edit_btn"
android:layout_width="30dip"
android:layout_height="30dip"
android:layout_toStartOf="#id/delete_btn"
android:layout_gravity="right"
android:layout_marginRight="40dp"
android:background="#android:drawable/ic_delete"
/>
</android.support.v7.widget.CardView >
</RelativeLayout>
I tried changing the background color but it's still black.

Try use:
card_view:cardBackgroundColor="#689F38"
So code be like this:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_margin="8dp"
card_view:cardUseCompatPadding="true"
card_view:cardCornerRadius="10dp"
card_view:cardBackgroundColor="#689F38"
card_view:cardElevation="5dp"
android:layout_height="match_parent">
If you want to change programatically use:
your_cardview.setCardBackgroundColor(your_color);

I thought the problem is in inflating the view in adapter
use below code in layout inflation
View v = inflater.inflate(R.layout.item_layout, parent, false);

You can use a relative layout or linear layout in cardview and set the width and height "match_parent" and set the cardeview color "transparent" as below
android:background="#android:color/transparent"
And set the the linear or relative layout background #689f38

CardView goes on top of FrameLayout, but declared first

I have simple FrameLayout with support CardView as first item, and TextView as second, so TextView must be on top of inflated view. This works on pre-Lolipop but on 21+ card takes toppest place in layout, why that's so and how to fix this? Same thing with RelativeLayout.
Layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="20dp"
app:cardBackgroundColor="#ff0000"
app:cardUseCompatPadding="false"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:text="i am top view!"
android:gravity="center"
android:layout_gravity="center"
android:textSize="30sp"
android:textAllCaps="true"
android:textColor="#00ff00"
android:background="#0000ff"
/>
</FrameLayout>

In case someone gets here and the solution for setting elevation doesn't work for them (like in my case, where I needed to draw an image above the CardView and having a shadow on it was not acceptable), you can solve the issue by wrapping the CardView inside another FrameLayout. In the example provided, it would look something like this:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="wrap_content">
<!-- This is the added FrameLayout -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="20dp"
app:cardBackgroundColor="#ff0000"
app:cardUseCompatPadding="false"
/>
</FrameLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:text="i am top view!"
android:gravity="center"
android:layout_gravity="center"
android:textSize="30sp"
android:textAllCaps="true"
android:textColor="#00ff00"
android:background="#0000ff"
/>
</FrameLayout>

I might be joining the discussion a bit late, but if you can afford giving up the CardView's elevation, you can just set the cardElevation property of the CardView in your XML layout to 0dp.
Like so:
app:cardElevation="0dp"

Just add your text view inside the card view, far as I know the z order is undefined inside a frame layout, but last laid out view should be drawn last.
This probably had to do with that card views in lollipop use elevation while they fall back on border drawing code pre lollipop.

This worked for me!
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="wrap_content">
<!-- Add this layout as parent of CardView -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="20dp"
app:cardBackgroundColor="#ff0000"
app:cardUseCompatPadding="false" />
</LinearLayout>
<!--Close parent layout-->
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="center"
android:background="#0000ff"
android:gravity="center"
android:text="i am top view!"
android:textAllCaps="true"
android:textColor="#00ff00"
android:textSize="30sp" />
</FrameLayout>