如何根据android中的材质设计制作卡片大小？

Question

我有一个listview在活动中包含card view与一个image和text。

我想根据材料设计制作卡片视图的尺寸。我怎样才能做到这一点？根据材料设计，是否有人可以帮助并指出我需要在代码中更改哪些内容？

这是到目前为止我的代码：

<android.support.v7.widget.CardView android:id="@+id/card_view" 
           xmlns:android="http://schemas.android.com/apk/res/android" 
           xmlns:card_view="http://schemas.android.com/apk/res-auto" 
           xmlns:tools="http://schemas.android.com/tools" 
           android:layout_width="match_parent" 
           android:layout_height="wrap_content" 
           android:layout_margin="5dp" 
           android:background="#424767" 
           android:foreground="?attr/selectableItemBackground" 
           android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
           card_view:cardCornerRadius="@dimen/card_corner_radius" 
           card_view:cardElevation="@dimen/card_elevation"> 

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

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical"> 

     <ImageView 
      android:id="@+id/appImage" 
      android:layout_width="72dp" 
      android:layout_height="72dp" 
      android:layout_above="@+id/subHeadingText" 
      android:layout_marginTop="10dp" 
      android:scaleType="centerCrop" 
      tools:ignore="ContentDescription"/> 

     <TextView 
      android:id="@+id/headingText" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="5dp" 
      android:layout_toRightOf="@+id/appImage" 
      android:paddingLeft="16sp" 
      android:paddingRight="16dp" 
      android:paddingTop="24sp" 
      android:text="Hello" 
      android:textColor="#000" 
      android:textSize="24sp" 
      tools:ignore="RtlHardcoded"/> 

     <TextView 
      android:id="@+id/subHeaderText" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/headingText" 
      android:layout_toRightOf="@+id/appImage" 
      android:paddingBottom="16dp" 
      android:paddingLeft="16dp" 
      android:paddingRight="16dp" 
      android:text="14sp" 
      android:textColor="#000"/> 

     <TextView 
      android:id="@+id/subHeadingText" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@id/subHeaderText" 
      android:layout_toRightOf="@+id/appImage" 
      android:lines="4" 
      android:paddingLeft="16dp" 
      android:paddingRight="16dp" 
      android:text="@string/stories_detail" 
      android:textColor="#737078" 
      android:textSize="14sp"/> 


    </RelativeLayout> 

    <Button 
     android:id="@+id/getDealBtn" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="10dp" 
     android:background="@drawable/get_deal_button" 
     android:elevation="2dp" 
     android:textAllCaps="true" 
     android:textColor="#FFFF" 
     android:textSize="14dp" 
     android:textStyle="bold"/> 
</LinearLayout> 

And here is my Image for this.

预先感谢您。

Answer 1

你应该使用这样的东西并相应地设计你的。看到运行影响

<android.support.v7.widget.CardView 
    android:id="@+id/cardView" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_margin="2dp" 
    card_view:cardBackgroundColor="#fff" 
    card_view:cardCornerRadius="3dp" 
    card_view:cardElevation="2dp" 
    card_view:cardUseCompatPadding="true" 
    > 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical" 
     > 
     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="Check in"/> 

     <TextView 
      android:id="@+id/txtCheckInTime" 
      style="@style/Base.TextAppearance.AppCompat.Subhead" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:gravity="center_horizontal" 
      android:text="9:20AM"/> 

     <View 

      android:id="@+id/viewStatus" 
      android:layout_width="match_parent" 
      android:layout_height="10dp" 
      android:background="@color/clrPresent" 
      /> 


    </LinearLayout> 
</android.support.v7.widget.CardView>