I have been trying for some time now to fix layout.I have a custom cardview like this :this image
This custom card is inside a fragment this one:
<LinearLayout android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/grey"
xmlns:android="http://schemas.android.com/apk/res/android" >
<android.support.v7.widget.RecyclerView
android:layout_width="wrap_content"
android:id="#+id/recycle"
android:layout_height="match_parent"/>
</LinearLayout>
Which itself is inside a viewpager.The problem is when I run the app my custom card becomes full width,I have tried even with RelativeLayout still isn't as I have in my design layout.
Custom_Card Layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_marginTop="10dp"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:id="#+id/job_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="#fff"
card_view:cardCornerRadius="3dp"
card_view:cardElevation="4dp"
card_view:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="360dp"
android:layout_height="wrap_content"
android:background="#fff">...
Can sb help me?Thanks in advance
Use CardView as your Parent layout in item layout as follows -
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="6dp"
app:cardElevation="#dimen/dimen4"
app:cardBackgroundColor="#fff"
android:id="#+id/job_post"
app:cardCornerRadius="3dp"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_margin="2dp"
android:layout_height="wrap_content"
android:background="#fff">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="TextView" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Give width of RecyclerView match_parent in your activity or fragment.
Thanks , I hope its work for you
You can use card view in linear layout and then set margin like below:-
<LinearLayout android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:background="#color/blue"
xmlns:android="http://schemas.android.com/apk/res/android" >
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_margin="20dp"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="Cardview Demo"/>
</android.support.v7.widget.CardView>
</LinearLayout>
I hope it will help you and you can set margin of cardview or your required width to cardview
Related
I have these nested layouts and i want to put a LinearLayout anchored to the bottom (internally) of the first RelativeLayout but i don't know how to do it. Can someone help me? I want something like this: https://imgur.com/eCCYS8Q
<RelativeLayout 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:background="#fff"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:weightSum="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.65"
android:background="#drawable/background_gradient">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.35">
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
To make layout_weight work properly set android:layout_height="0dp" for both relative layouts
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.65"
android:background="#color/colorPrimary">
<LinearLayout
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_height="match_parent"
android:background="#color/colorAccent">
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.35"
android:background="#color/colorPrimaryDark">
</RelativeLayout>
</LinearLayout>
change 10dp to whatever suits you.
I set the colors just to distinguish the layouts
If you want to align a view to the bottom of a relative layout you need to use
android:layout_alignParentBottom="true"
in the view that is going to be stuck at the bottom of the relative
Align LinearLayout to the bottom using id.
take the id of relative layout and then align LinearLayout to the bottom at the end of relative layout id.
Since you need weighttoo in your UI so This will work for you
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:weightSum="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.65"
android:background="#drawable/background_gradient">
<LinearLayout
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content">
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.35">
</RelativeLayout>
</LinearLayout>
I try to add custom background in my CardView.This is my source
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/item_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff00"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="12dp"
card_view:cardElevation="12dp"
card_view:cardPreventCornerOverlap="false"
card_view:contentPadding="0dp"
android:layout_margin="16dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#cccccc">
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
As you can see into Cardview i have LinearLayout and RelativieLayout.RelativeLayout's background color is #cccccc,but cornerradius and elevetion not working with custom background color.(please see my picture)
How i can solve my problem?
Your Linear Layout inside CardView is overlapping your cardview's top corners due to fix height given to linear layout. When giving height to cardview and making linear layout match_parent, and giving contentPadding in cardview makes corners visible.
Here is the code and screenshot.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/item_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff00"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="80dp"
card_view:cardCornerRadius="12dp"
card_view:cardElevation="12dp"
card_view:cardPreventCornerOverlap="true"
card_view:contentPadding="2dp"
android:layout_margin="16dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#cccccc">
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Screenshot
I am using One Activity and others are fragments. My parent layout is cardview and I want to add another layout at the top the using include layout tag. Below I posted output images and code:.
This is my card Layout
<?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:id="#+id/cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="8dp"
app:cardUseCompatPadding="true"
app:cardBackgroundColor="#android:color/transparent"
android:elevation="0dp">
<include layout="#layout/edit_text"/>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:paddingLeft="10dp"
android:textColor="#4928ef"
android:textStyle="italic"/>
</android.support.v7.widget.CardView>
And this is my common layout, which I have to include in above card layout
edit_text.xml
<?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="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GO"
android:id="#+id/go"
android:layout_alignParentRight="true"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Quick Search"
android:layout_alignParentLeft="true"/>
</RelativeLayout>
Output
Click here to display output of above code
I tried to change cardview parent to LinearLayout and cardview as child but I don't know why list item (textview) the first one only displays and others are ignored. I am trying to make layout like below:
Click here to see what I expected
Use only 1 child in cardView
Try this
main.xml
<?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:id="#+id/cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
app:cardBackgroundColor="#android:color/transparent"
app:cardCornerRadius="8dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/edit_text" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:text="Textview"
android:textColor="#4928ef"
android:textSize="25sp"
android:textStyle="italic" />
</LinearLayout>
</android.support.v7.widget.CardView>
and edit_text.xml
<?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="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GO"
android:id="#+id/go"
android:layout_alignParentRight="true"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Quick Search"
android:layout_alignParentLeft="true"/>
</RelativeLayout>
Adjust background using android:background="#drawable/background"
remove
<include layout="#layout/edit_text"/>
from your cardView layout, because cardView should have only one ChildView.
so as i understand, you want to use search bar on top.
so here is my implementation:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.tiikr.OverlayActivity">
<include layout="#layout/edit_text"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/my_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:scrollbars="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
so here i use LinearLayout as a parent of the view, and on top is your search bar layout, and down is the listView wich you need to populate in the code with your cardview layout
<?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:id="#+id/cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="8dp"
app:cardUseCompatPadding="true"
app:cardBackgroundColor="#android:color/transparent"
android:elevation="0dp">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:paddingLeft="10dp"
android:textColor="#4928ef"
android:textStyle="italic"/>
</android.support.v7.widget.CardView>
See above code with RecyclerView
I am using an RecyclerView with GridLayoutManager and I dynamically add new elements that have this xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true">
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/cardView"
android:layout_width="match_parent"
android:layout_height="150dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
style="#style/cardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:id="#+id/direction_list_icon"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/icon"
android:layout_gravity="center"
android:padding="8dp"
android:clickable="true" />
<TextView
android:id="#+id/direction_list_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dummy text"
android:layout_gravity="center"
android:padding="8dp"
android:clickable="true" />
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
The problem is that I see click effect on CardView item only when I doubleclick on it or making an long click.
I tried to place an LinearLayout inside CardView and make in clickable with android:background="?android:attr/selectableItemBackground" but result stays the same
I have solved this problem in my project by setting background to the CardView's root element. In your layout this should work:
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/cardView"
android:layout_width="match_parent"
android:layout_height="150dp"
style="#style/cardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:background="?android:selectableItemBackground">
</LinearLayout>
</android.support.v7.widget.CardView>
Set
android:focusable="false"
android:focusableInTouchMode="false"
on your CardView
I have two cards views, I want to place one above the other but the end result is that they are placed on top of each other:
This is the XML code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:id="#+id/entryTypeCardView"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Spinner
android:id="#+id/entryChoiceSpinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp" />
</android.support.v7.widget.CardView>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:id="#+id/currencySpinnerLayout"
android:orientation="vertical"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:id="#+id/currencyTypeCardView"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Spinner
android:id="#+id/currencyChoiceSpinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp" />
</android.support.v7.widget.CardView>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<AutoCompleteTextView
android:id="#+id/personNameTextField"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
...
What am I doing wrong?
Assign some id to first RelativeLayout
<RelativeLayout
android:id="#+id/first_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
and then used
android:layout_below="#+id/first_layout"
to second layout.