Can we use cardView in Relative layout in Android Studio? - android

I'm using a simple card View in Relative Layout.
Can i use it in Relative Layout ? If yes then How ?

If you use CardView inside RelativeLayout like the following :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:background="#android:color/black"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
....>
<....>//Imagine a TextView here
<....>
</android.support.v7.widget.CardView>
</RelativeLayout>
then you will not be able to arrrage the elements inside the cardview in a right way.
In short imagine CardView as a Holder, you will have to use a layout inside CardView to make it work in a correct way
for example:
<android.support.v7.widget.CardView
....>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:background="#android:color/black"
android:layout_height="match_parent">
<....>//Imagine a TextView here
<....>
</RelativeLayout>
</android.support.v7.widget.CardView>

Yes we can Use please follow the code:
<!-- About Panel -->
<android.support.v7.widget.CardView
android:id="#+id/cv_About"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/cv_Help"
android:layout_gravity="center"
android:elevation="3dp"
app:cardCornerRadius="0dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="#dimen/pad_20dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="#string/about"
android:textColor="#color/dimblack"
android:id="#+id/tvAbout"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
Cheers!!

Related

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.

How can i make items of recyclerView in center?

I want to keep the items in center of recyclerview. i have posted an image. please help me to do that
the code of layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="120dp"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_gravity="center_horizontal"
app:cardCornerRadius="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/service_image"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/washingmachin"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="#+id/service_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Washing Mashing"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
</androidx.cardview.widget.CardView>
i want the image of fridge ac laundry and all to keep in center of screen
add
android:layout_gravity="center"
to your LinearLayout
set android:gravity="center" to you text view or linear layout both should work

Is it possible to make two layouts share one ImageView?

I mean how can i locate a ImageView in two layouts? i have 2 relative layouts one is up, one is down. The up one has a ImageView but i want half of this ImageView located in down layout. How can i do that?
EDIT::
Try this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_container"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="#dimen/activity_horizontal_margin"
android:background="#d2aff4">
<Space
android:id="#+id/center"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerInParent="true" />
<RelativeLayout
android:id="#+id/bottom"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/center"
android:background="#87c96d" />
<RelativeLayout
android:id="#+id/top"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_centerInParent="true"
android:src="#mipmap/ic_launcher" />
</RelativeLayout>
</RelativeLayout>
In this scenario the "top" layout needs to be created at last to be displayed on top of the rest of the views. If you need it to have a background colour, you need to apply the colour to the main container.
Here is the result:
I agree with #Booger answer's but If your parent layout is RelativeLayout then add this below property in you ImageView.
android:layout_centerInParent="true"
Or you can use below code to create that kind of layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/white"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/gray_font">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/colorAccent">
</LinearLayout>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:layout_centerInParent="true"/>
</RelativeLayout>
Take a look at this library https://github.com/umano/AndroidSlidingUpPanel
if you want something easy you can put those layouts in to a parent relative layout and then you can add a image view in parent relative layout as last child and position it how you need
I think you should wrap both your RelativeLayout in another Parent layout, and in that layout, you will place your ImageView (which will span both the other layouts.
Something like this pseudo-code:
<LinearLayout>
<RelativeLayout1>
<RelativeLayout2>
<ImageView gravity=center> //Order counts, this needs to be after the RelativeLayouts to show on top of them
</LinearLayout>

How to create 3 generic card views?

I'm trying to create 3 cardviews, each have the same height, weight etc..
I managed to create one:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="8dp"
android:padding="8dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_alignParentTop="true"
android:scaleType="centerInside"
android:src="#drawable/moon20"
android:background="#android:color/white"
android:padding="8dp"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="3"
android:padding="8dp"
android:text="20 min Power Nap"
android:textColor="#color/colorSecondaryText"
android:textStyle="bold"
android:textSize="20dp"
android:textAlignment="center"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
I need two more of this cardview, but I'm getting
"multiple root tag" error
Do I have to create a base layout like Relative layout for all cardviews?
You need a root view to put inside your CardViews. Right now you are putting one CardView inside the other (Because your root is a CardView). Try to put them inside a LinearLayout.
<LinearLayout>
<CardView>
<CardView>
<CardView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<CardView>
<CardView>
<CardView>
</LinearLayout>
Try to make your cardView element inside a LinearLayout or some other Layout views.
example:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android" .......

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>

Categories

Resources