Androidのマテリアルデザインに従ってCardviewを作成する方法は？

Question

マテリアルデザインのガイドラインを見ましたが、少し混乱しましたが、画像の左側に画像、画像の右側にいくつかのテキストがあるカードを設計しましたが、ガイドラインに従っているかどうかに満足できませんでした... plsチェックと教えてください。また、ダミーのテキスト段落を正当化する必要があります。

これが私のコードです：-

<Android.support.v7.widget.CardView
style="@style/MyCardViewStyle"
xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:clipToPadding="false"
>

<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_marginLeft="16dp"
        Android:background="@drawable/video"
        Android:scaleType="centerCrop"
        tools:ignore="ContentDescription"/>

    <TextView
        Android:id="@+id/headingText"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_toRightOf="@+id/appImage"
        Android:paddingLeft="16sp"
        Android:paddingRight="16dp"
        Android:text="Title"
        Android:textColor="#000"
        Android:textSize="18sp"
        tools:ignore="RtlHardcoded"/>

    <TextView
        Android:id="@+id/subHeaderText"
        style="@style/Base.TextAppearance.AppCompat.Subhead"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_below="@+id/headingText"
        Android:layout_toRightOf="@+id/appImage"
        Android:paddingLeft="16dp"
        Android:text="SubTiltle"
        Android:paddingRight="16dp"
        Android:textColor="#000"
        Android:textSize="15sp"/>

    <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:gravity="left"
        Android:lines="5"
        Android:maxLines="5"
        Android:paddingBottom="16dp"
        Android:paddingLeft="16dp"
        Android:paddingTop="16dp"
        Android:text="@string/stories_detail"
        Android:textColor="#737078"
        Android:textSize="14sp"/>

    <Button
        Android:id="@+id/getDealBtn"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_below="@id/subHeadingText"
        Android:background="@drawable/get_deal_button"
        Android:elevation="2dp"
        Android:textAllCaps="true"
        Android:textColor="#FFFF"
        Android:textSize="14sp"
        Android:textStyle="bold"/>

</RelativeLayout>

これが私のカードビューのようです：

Answer 1

これは、マテリアルデザインガイドラインに準拠して実装されたCardViewレイアウトを使用したGitHubプロジェクトへの リンク です。

Answer 2

これを使って。

<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="5dp"
    card_view:cardElevation="4dp"

    card_view:cardUseCompatPadding="true"
    xmlns:tools="http://schemas.Android.com/tools">

    <RelativeLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:orientation="vertical"
        Android:background="@color/white"

        >

        <ImageView
            Android:id="@+id/appImage"
            Android:layout_width="72dp"
            Android:layout_height="72dp"
            Android:layout_marginLeft="16dp"
            Android:background="@drawable/img_Android"
            Android:scaleType="centerCrop"
            tools:ignore="ContentDescription"/>

        <TextView
            Android:id="@+id/headingText"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_toRightOf="@+id/appImage"
            Android:paddingLeft="16sp"
            Android:paddingRight="16dp"
            Android:text="Title"
            Android:textColor="#000"
            Android:textSize="18sp"
            tools:ignore="RtlHardcoded"/>

        <TextView
            Android:id="@+id/subHeaderText"
            style="@style/Base.TextAppearance.AppCompat.Subhead"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_below="@+id/headingText"
            Android:layout_toRightOf="@+id/appImage"
            Android:paddingLeft="16dp"
            Android:text="SubTiltle"
            Android:paddingRight="16dp"
            Android:textColor="#000"
            Android:textSize="15sp"/>

        <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:gravity="left"
            Android:lines="5"
            Android:maxLines="5"
            Android:paddingBottom="16dp"
            Android:paddingLeft="16dp"
            Android:paddingTop="16dp"
            Android:text="stories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detail"
            Android:textColor="#737078"
            Android:textSize="14sp"/>

        <Button
            style="@style/Base.Widget.AppCompat.Button.Borderless"
            Android:id="@+id/getDealBtn"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_below="@id/subHeadingText"
            Android:textColor="#FFFFFF"
            Android:background="@color/clrDarkGreen"
            Android:textSize="14sp"
            Android:textStyle="bold"
            Android:text="Button"/>

    </RelativeLayout>
    </Android.support.v7.widget.CardView>ort.v7.widget.CardView>

Answer 3

//要件に応じてスタイルを追加します

<Android.support.v7.widget.CardView
xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:clipToPadding="false">

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

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:orientation="horizontal">

        <ImageView
            Android:id="@+id/appImage"
            Android:layout_width="72dp"
            Android:layout_height="72dp"
            Android:layout_marginLeft="16dp"
            Android:scaleType="centerCrop"
            tools:ignore="ContentDescription"
            Android:layout_margin="10dp"/>

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

            <TextView
            Android:id="@+id/headingText"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_toRightOf="@+id/appImage"
            Android:paddingLeft="16sp"
            Android:paddingRight="16dp" 
            Android:text="Title"
            Android:textColor="#000"
            Android:textSize="18sp"
            tools:ignore="RtlHardcoded"/>

            <TextView
                Android:id="@+id/subHeaderText"
                style="@style/Base.TextAppearance.AppCompat.Subhead"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_below="@+id/headingText"
                Android:layout_toRightOf="@+id/appImage"
                Android:paddingLeft="16dp"
                Android:text="SubTiltle"
                Android:paddingRight="16dp"
                Android:textColor="#000"
                Android:textSize="15sp"
                Android:layout_marginTop="20dp"/>


            <TextView
                Android:id="@+id/subHeadingText"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:gravity="left"
            Android:lines="5"
            Android:maxLines="5"
            Android:paddingBottom="16dp"
            Android:paddingLeft="16dp"
            Android:paddingTop="16dp"
            Android:textColor="#737078"
            Android:textSize="14sp"
            Android:layout_marginTop="20dp"/>

        </LinearLayout>

    </LinearLayout>

    <Button
        Android:id="@+id/getDealBtn"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:elevation="2dp"
        Android:textAllCaps="true"
        Android:textColor="#FFFF"
        Android:textSize="14sp"
        Android:textStyle="bold"/>

</LinearLayout>