Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make a grid layout of CardViews with variable height? [duplicate]

I have multiple CardView's defined in XML as:

<android.support.v7.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardPreventCornerOverlap="false"
    card_view:cardCornerRadius="4dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:orientation="vertical"
        android:layout_height="wrap_content">
        <TextView
            android:textSize="@dimen/abc_text_size_title_material"
            android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</android.support.v7.widget.CardView>

For phones, I have wrapped the multiple CardView's in a vertical LinearLayout:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

For tablets, I would like to use a grid layout instead, similar to the design used in the Material Design specs, see image here.

What's the best ViewGroup to use to make the grid layout? The cards are of variable height, and have static content.

GridLayout can't be used, because the cards are of variable height.

like image 865
user2560886 Avatar asked Jul 11 '15 08:07

user2560886


People also ask

How do I use cardview and GridView on Android?

Install the finished project on your Android device or AVD. Give the button a click and the CardView should appear, complete with the content you specified. A GridView is a view that displays items in a two-dimensional, scrollable grid of rows and columns.

How do I use a cardview in a layout?

In order to use the `CardView` you need to add it to your layout file. Use it as a view group to contain other views. In this example, the `CardView` contains a single TextView to display some information to the user.

Can you use CSS grid on a card layout?

Cards and overall page layout Just as an aside, it’s important to know that CSS Grid does not have to be used on an entire page layout. Grids can be used in certain areas of the page if needed. Since this is a tutorial on card layouts, a grid approach can be used exclusively here even if the rest of the page does not utilize CSS Grid.

How to customize the appearance of the'cardview'widget?

Use these properties to customize the appearance of the `CardView` widget: To set the corner radius in your layouts, use the card_view:cardCornerRadius attribute. To set the corner radius in your code, use the CardView.setRadius method.


1 Answers

For tablets you can use 2 LinearLayouts.

like image 88
NoobyGuy Avatar answered Oct 04 '22 15:10

NoobyGuy