AndroidStudio:MaterialCardView の使い方メモ

参考サイト様

変数、関数軍群
https://developer.android.com/reference/com/google/android/material/card/MaterialCardView

見た目+変数、関数軍群
https://material.io/components/cards/android#using-cards

使用例

自分はそもそも CardView の使い方を知らずに MaterialCardView を使っているので、 CardView と同じような使い方かわからない。たぶん同じ。

<com.google.android.material.card.MaterialCardView
        android:id="@+id/card"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_margin="8dp"
        android:clickable="true"
        android:focusable="true"
        android:checkable="true"
        app:rippleColor="@color/black"
        app:strokeColor="@color/purple_700"
        app:cardCornerRadius="5dp"
        app:strokeWidth="1dp"
        >
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_marginStart="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="3dp"
            android:layout_marginEnd="10dp"
            >
        <com.google.android.material.textview.MaterialTextView
            android:id="@+id/text_todo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Todo"
            android:textSize="20sp"
            android:textStyle="bold"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            />
        </LinearLayout>
    </com.google.android.material.card.MaterialCardView>

そもそも RecyclerView の リスト化する ItemView の親全体を押すようにしようと思っていたのだが MaterialCardView でいいじゃんとなった。

 

LinearLayout についての説明

ConstraintLayout が MaterialCardView の親となっているのだが、MaterialCardView 内では LinearLayout を使う必要があると思われる。

MaterialCardView 内で CostraintLayout をつかったら全部重なってしまった。

 

横に並べたかったら orientation を horizontal にする。
右寄せ左寄せは layout_gravity。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" //縦ならvertical
    android:layout_gravity="end" //右なら start,中央なら center
    >

CardView についての説明

タップしたときの波紋の色

app:rippleColor="@color/black"

カードの枠線の太さ(デフォルトだと色を変えてもわかりにくいかも)

app:strokeWidth="1dp"

カードの枠線の色

app:strokeColor="@color/purple_700"

カードの角の丸め具合

app:cardCornerRadius="5dp"

カードの影(あんまり実感がわかない)

app:cardElevation="3dp"

カードの背景色

app:cardBackgroundColor="@color/purple_700"

デフォルトで style 用意されてるけどあんまり実感がわかなかった。

style="@style/Widget.MaterialComponents.CardView"

 

終わりに

MaterialDesign の Component は style あるっぽいからとりあえずそれを当てとくのもあり?
CardView 内に CardView を置くこと(ネストする)によって何重にもできるらしい 。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA