I am having a play with the new Android L SDK and I can't figure out how to implement CardView. Seems like I'm missing something - any advice is very much appreciated!
So far I have the following declared as part of my activity:
<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="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_below="#+id/waitingHeader"
card_view:cardCornerRadius="4dp">
<LinearLayout
android:id="#+id/card_linear_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/notificationText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hello"/>
<TextView
android:id="#+id/notificationTex"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hello2"/>
</LinearLayout>
</android.support.v7.widget.CardView>
Naively I was hoping that would give me two cards with hello and hello2 however all I see is a single card with hello - the second card is missing. How can I create multiple cards using CardView?
Think of cardview as ViewGroup Like linear layout or Relative layout. If you want two cardview then use two cardview and keep root layout as Linear or Relative 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="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_below="#+id/waitingHeader"
card_view:cardCornerRadius="4dp">
<TextView
android:id="#+id/notificationText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hello"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_below="#+id/waitingHeader"
card_view:cardCornerRadius="4dp">
<TextView
android:id="#+id/notificationTex"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="hello2"/>
</android.support.v7.widget.CardView>
Related
I am using recyclerview gridview to show product. But its showing like this
this is the view
my xml view code is
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/tools"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:id="#+id/card_view"
android:layout_width="#dimen/cover_height"
android:layout_height="wrap_content"
android:layout_gravity="center"
card_view:cardUseCompatPadding="true"
android:elevation="7dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.makeramen.roundedimageview.RoundedImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/thumbnail"
android:src="#drawable/placeholder_image"
android:scaleType="fitXY"
app:riv_oval="false"
app:riv_corner_radius_top_left="6dp"
app:riv_corner_radius_top_right="6dp"
android:layout_height="#dimen/cover_height"
android:layout_width="match_parent" />
<pseudozero.smalam.com.finwallet.utils.TextViewPlus
android:id="#+id/tvProductTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/thumbnail"
android:textColor="#color/colorBlack"
android:textSize="15dp"
android:text="Wrist Watch"
android:padding="5dp"
app:customFont="fonts/Proxima_Nova_Bold.otf"/>
<pseudozero.smalam.com.finwallet.utils.TextViewPlus
android:id="#+id/tvProductVendor"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/tvProductTitle"
android:textSize="13dp"
android:paddingLeft="5dp"
android:paddingBottom="5dp"
android:text="Rolex"
app:customFont="fonts/Proxima_Nova_Reguler.otf"/>
<pseudozero.smalam.com.finwallet.utils.TextViewPlus
android:id="#+id/tvPriceTag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="500 BDT"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:textColor="#color/colorWhite"
android:textSize="13dp"
android:padding="10dp"
android:background="#drawable/price_tag_back_n"
app:customFont="fonts/Proxima_Nova_Bold.otf"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
I am using a card view inside linearlayout. But I am getting this
I am loading all data from server. Only the second item is going up. I want that all items will be decorated.
Use fixed height of CardView and RoundedImageView
Use attribute android:scaleType="centerCrop" instead of android:scaleType="fitXY" to RoundedImageView.
Hope this will help~
RelativeLayout Height should be wrap_content
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
to
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
And in your code you do not close parent LinearLayout.
I have a cardview with only one textview.
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="1dp"
android:foreground="#drawable/selector_normal"
android:clickable="true"
card_view:cardCornerRadius="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/txt_command"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawablePadding="#dimen/padding_standard"
android:padding="#dimen/padding_standard"
android:textColor="#color/colorLightBlue"
android:textSize="#dimen/text_size_medium_small" />
</LinearLayout>
</android.support.v7.widget.CardView>
Apparently the LinearLayout does nothing other than wrapping the TextView. However if I remove the LinearLayout, having the CardView wrap just the TextView, my entire TextView disappear. Is this not allowed?
Is it possible to remove the LinearLayout?
I want to reduce my layout hierarchy by removing redundant layout.
No, it is not necessary to have LinearLayout above than android.support.v7.widget.CardView
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="1dp"
android:clickable="true"
android:foreground="#drawable/selector_normal"
card_view:cardCornerRadius="2dp">
<TextView
android:id="#+id/txt_command"
android:layout_width="match_parent" //change here to match_parent
android:layout_height="wrap_content"
android:drawablePadding="#dimen/padding_standard"
android:padding="#dimen/padding_standard"
android:textColor="#color/colorLightBlue"
android:hint="Your Text Here"
android:textSize="#dimen/text_size_medium_small"/>
</android.support.v7.widget.CardView>
I have a RecyclerView inside a RelativeLayout like so:
<android.support.v7.widget.RecyclerView
android:id="#+id/cards_wrapper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
android:background="#eeff99"/>
and I have card view within a LinearLayout like so:
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/quote_card"
android:layout_height="200dp"
android:layout_width="match_parent"
card_view:cardBackgroundColor="#666"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp"
app:cardUseCompatPadding="true"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/display_author_name"
android:text="Author Name"
android:textSize="18sp"
android:textColor="#333"
android:gravity="center_horizontal"/>
</android.support.v7.widget.CardView>
the gap between the cards are huge. The next card is seen only after one scroll a bit. What am I missing?
Here the images, before scrolling:
After scrolling:
Try this:
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent" >
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/quote_card"
android:layout_height="200dp"
android:layout_width="match_parent"
card_view:cardBackgroundColor="#666"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp"
app:cardUseCompatPadding="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/display_author_name"
android:text="Author Name"
android:textSize="18sp"
android:textColor="#333"
android:gravity="center_horizontal"/>
</android.support.v7.widget.CardView>
</LinearLayout>
put card view in side a linear layout and make play with padding to change the gap
<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="wrap_content"
*android:padding="1dp"*
>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
style="#style/list_card"
android:layout_width="match_parent"
android:layout_height="90dp" >
Make these changes in your LinearLayout. If layout_height is match_parent it takes the screens space
android:layout_width="match_parent"
android:layout_height="wrap_content"
you used card view height as match parent so if parent height also match parent than change parent height into wrap content and if you used only card view as parent than also change its height to wrap content..might be it help you
The below image is the first page from Google I/O 2015 app.
I Would like to achieve something like this. Each Section in each cards with few details in RecyclerView along with More Button at top right.
I tried something like,
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/root">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Updates"/>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:id="#+id/updates">
</android.support.v7.widget.RecyclerView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Videos"/>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:id="#+id/videos">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
But, I am not sure whether this is correct approach or not. Do we need to use each RecyclerView for each section? Suppose, If I have 5 section, then should i have 5 RecyclerView?
Yes, you can use for each section a RecyclerView.but, i think it will take a lot of memory.
and also, Take them into a CardView like this for each section:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="360dp"
android:layout_height="300dp"
android:layout_marginStart="12dp"
android:foreground="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="4dp"
card_view:cardElevation="2dp">
<RelativeLayout
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Updates"
android:id="#+id/textView" />
<android.support.v7.widget.RecyclerView
android:id="#+id/updates"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:layout_below="#+id/textView" />
</RelativeLayout>
</android.support.v7.widget.CardView>
i need to show CardViews in HorizontalScrollView like below tutorial
http://examples.javacodegeeks.com/android/core/ui/horizontalscrollview/android-horizontalscrollview-example/
and here is what i've tryed:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="3">
<HorizontalScrollView
android:id="#+id/horizontalScrollView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="50dp">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:id="#+id/view2"
android:layout_width="170dp"
android:layout_height="220dp"
android:layout_alignParentEnd="true"
android:layout_alignTop="#+id/horizontalScrollView"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="3dp"
card_view:cardElevation="3sp"
card_view:cardUseCompatPadding="true" />
</RelativeLayout>
</HorizontalScrollView>
<android.support.v7.widget.CardView
android:id="#+id/view5"
android:layout_width="170dp"
android:layout_height="220dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="3dp"
card_view:cardElevation="3sp"
card_view:cardUseCompatPadding="true"
android:layout_alignTop="#+id/horizontalScrollView"
android:layout_alignParentEnd="true"
android:layout_marginEnd="33dp" />
</RelativeLayout>
But i can't use more than two cardview in this layout.(inHorizontalScrollView)
should i use another widget for this porpose or what is the problem if i need to show 5 CardView in this Horizontal ScrollView?
Cheers!
You can use RecyclerView which comes in the android support library and u can see how to add it to your project here. It is a better implementation on list view which comes with a Layout manager by which you can configure it to be used as Horizontal or vertical Scroll mode.
mRecyclerLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);