create view over cardview in android
Solution 1
Try:
Use a RelativeLayout
Align the ImageView to the parent right/end and add a right/end margin
Align the FAB to the top of the card view and add a negative margin
<RelativeLayout
...>
<CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="120dp"
/>
<ImageView
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignTop="@id/cardView"
android:layout_marginTop="-32dp"
android:layout_marginRight="20dp"
/>
</RelativeLayout>
Solution 2
The CardView has by default elevation in API 21+, you can manipulate the elevation to be less than that of the ImageView
<android.support.v7.widget.CardView xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardElevation="1dp"/>
<ImageView
android:id="@+id/image_view_user"
android:layout_width="48dp"
android:layout_height="48dp"
android:elevation="2dp"/>
in Pre 21 you can use
overlayView.bringToFront();
root.requestLayout();
root.invalidate();
This will not work in 21+ if you have different elevation
Solution 3
Just put CardView in other view like in FrameLayout. Just like below:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_marginStart="10sp"
android:layout_marginEnd="10sp"
>
<FrameLayout
android:layout_marginTop="15sp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="100sp"
app:cardCornerRadius="5sp"
app:cardBackgroundColor="@color/colorPrimary">
<!--other view items -->
</android.support.v7.widget.CardView>
</FrameLayout>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="90sp"
android:layout_height="90sp"
app:civ_border_width="2dp"
android:layout_marginStart="10sp"
app:civ_border_color="@color/colorPrimaryDark"
android:id="@+id/profileImg"
android:background="@drawable/ic_if_profle_1055000"
xmlns:app="http://schemas.android.com/apk/res-auto"/>
Screenshot:
Solution 4
You can wrap CardView in FrameLayout but then the shadow will be cropped. Set android:clipChildren="false" to fix it
<android.support.constraint.ConstraintLayout 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="wrap_content"
android:clipChildren="false"
android:layout_height="140dp">
<FrameLayout
android:id="@+id/frameLayout4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="16dp"
android:clipChildren="false">
<android.support.v7.widget.CardView
app:cardCornerRadius="@dimen/card_radius"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.CardView>
</FrameLayout>
</android.support.constraint.ConstraintLayout>
Solution 5
Just add elevation to ImageView greater than CardView elevation
<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="match_parent"
android:background="@color/abc_search_url_text_normal"
android:orientation="vertical">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:layout_marginBottom="3dp"
android:paddingTop="5dp"
app:cardBackgroundColor="@color/white">
</androidx.cardview.widget.CardView>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:layout_marginBottom="30dp"
android:layout_marginRight="10dp"
android:scaleType="fitXY"
android:elevation="8dp"
android:src="@drawable/ic_launcher_background" />
max
Updated on June 06, 2022Comments
-
max almost 2 years
this is a cardview (gray view) and imageview(blue view) for that i use this code
<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="match_parent" android:background="@color/abc_search_url_text_normal" android:orientation="vertical"> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="100dp" android:layout_alignParentBottom="true" android:layout_gravity="bottom" android:layout_marginBottom="3dp" android:paddingTop="5dp" app:cardBackgroundColor="@color/abc_input_method_navigation_guard"> </android.support.v7.widget.CardView> <ImageView android:layout_width="100dp" android:layout_height="100dp" android:layout_gravity="bottom" android:layout_marginBottom="30dp" android:layout_marginRight="10dp" android:scaleType="fitXY" android:src="@drawable/abc_ratingbar_full_material" /> </FrameLayout>
but in result my image view going to back of cardview i try reletivelayout instead of framelayout but same result.
-
max over 8 yearsi do that too but the interesting things is here that is not work with cardview i do that before with another type of view and works but cardview no
-
cw fei over 8 yearsLast try, wrap your card view with a linear layout
-
Admin about 8 years@cwfei please answer this too: stackoverflow.com/questions/36393540/…
-
Syed Arsalan Shah almost 3 yearsThanks, Elevation does change order of views