web-dev-qa-db-ja.com

CardViewの背景色の状態が尊重されていません

簡単に言うと：

CardViewのcardBackgroundColorプロパティの色の状態を定義するには（この場合、ListViewレイアウトで）。

（私はAndroid L開発者プレビュー、4.4がインストールされた電話、およびbuild.gradleの "com.Android.support:cardview-v7:21.0.0-rc1"のRC1を使用しています）

より長いです：

CardViewレイアウトでは、cardCornerRadiusとcardBackgroundColorを使用して、CardViewの角の半径と背景色を設定します。

ただし、背景色は選択された状態を反映しません。たとえば、リスト項目が押された場合などです。

ただし、CardViewの内部ビューで背景色と関連する状態を設定すると、それらは尊重されますが、CardViewで定義した隅に表示されます。

それでは、CardViewのcardBackgroundColorの状態が尊重されるようにするにはどうすればよいでしょうか？

CardBackgroundColor、colour_with_states.xmlに使用される色は次のとおりです。

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:state_focused="true"  Android:state_enabled="false" Android:state_pressed="true" Android:color="@Android:color/holo_green_dark" />
    <item Android:state_focused="true"  Android:state_enabled="false"                              Android:color="@Android:color/holo_green_dark" />
    <item Android:state_focused="true"                                Android:state_pressed="true" Android:color="@Android:color/holo_green_dark" />
    <item Android:state_focused="false"                               Android:state_pressed="true" Android:color="@Android:color/holo_green_dark" />
    <item Android:state_focused="true"                                                             Android:color="@Android:color/holo_green_dark" />
    <!-- Only this below is seen in the cardview dispaly -->
    <item Android:color="@Android:color/holo_blue_bright" />
</selector>

そして、CardViewを使用するレイアウト：

<Android.support.v7.widget.CardView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:cardview="http://schemas.Android.com/apk/res-auto"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    cardview:cardCornerRadius="10dp"
    cardview:cardBackgroundColor="@color/colour_with_states"
    >

<!-- If we set a background color below, it will overwrite our radius defined above -->
<TextView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    tools:text="Lorem ipsum"
    Android:id="@Android:id/text1"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:textAppearance="?android:attr/textAppearanceListItem"
    Android:background="@null"
    Android:gravity="center_vertical"
    Android:paddingTop="8dip"
    Android:paddingBottom="8dip"
    Android:paddingStart="8dip"
    Android:paddingEnd="8dip"
    />

</Android.support.v7.widget.CardView>
androidandroid-cardview
56
newfivefour

これは理想的ではありませんが、エッジが丸くないため、次のようにCardViewにタッチフィードバックを追加できます。

<Android.support.v7.widget.CardView
    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"
    app:cardCornerRadius="4dp"
    Android:clickable="true"
    Android:foreground="?android:attr/selectableItemBackground">

    //Nested View ...

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

Android:foregroundおよびAndroid:clickable属性をCardViewに追加します。

また、これはAndroid:clickable属性がclickListenerをオーバーライドするため、これらのclickListenerがトリガーされないというマイナスの副作用があります。

更新

CardViewの実装例があります

ループ（ https://github.com/lawloretienne/Loop ）- https://github.com/lawloretienne/Loop/blob/master/app/src/main/res/ layout/category_card.xml

QuickReturn（ https://github.com/lawloretienne/QuickReturn ）- https://github.com/lawloretienne/QuickReturn/blob/master/sample/src/main/res/ layout/activity_quick_return.xml

更新2

さらに調査を重ねた結果、Lollipopを含むすべてのAPIバージョンでCardViewsに適したソリューションを見つけました。

https://medium.com/@etiennelawlor/layout-tips-for-pre-and-post-Lollipop-bcb2e4cdd6b2#.9h0v1gmaw

61
toobsco42

時には、CardViewに視覚的なタッチフィードバックを持たせたい場合があります。 _Android:foreground="?android:attr/selectableItemBackground"_ソリューションはこれに最適です。

ただし、ListViewでdrawSelectorOnTop(true)を使用することを検討できます。 CardViewを変更する必要はまったくありません。

さらに説明が必要かどうかを教えてください。

10
Anthony Chuinard

ここにあなたの問題を解決する私の方法があります。

最初に、CustomCardView extends CardViewという名前のカスタムクラスを作成します

次に、drawableStateChanged()メソッドをオーバーライドし、カードのプレス状態が変更されたときにsetCardBackgroundColor()メソッドを呼び出してカードの背景色を変更します。

最後に、レイアウトファイルでCardViewをこのCustomCardViewに置き換えます。

このソリューションの唯一の欠点は、cardviewがAndroid 5.0以降でリップルプレス効果を表示できないことです。

ここに私のコードがあります：

public class CustomCardView extends CardView {

public CustomCardView(Context context) {
    super(context);
    // TODO Auto-generated constructor stub
}

public CustomCardView(Context context, AttributeSet attrs) {
    super(context, attrs);
    // TODO Auto-generated constructor stub
}

public CustomCardView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    // TODO Auto-generated constructor stub
}

@Override
protected void drawableStateChanged() {
    super.drawableStateChanged();
    if (isPressed()) {
        this.setCardBackgroundColor(getContext().getResources().getColor(R.color.card_view_pressed));
    } else {
        this.setCardBackgroundColor(getContext().getResources().getColor(R.color.card_view_normal));
    }
}

}

5
Loyea

私が使用した回避策の1つは、カスタムViewHolder内でView.OnTouchListener OnTouch（）イベントハンドラーをオーバーライドすることにより、プログラムでUIの変更を行うことでした。

@Override
public boolean onTouch (View v, MotionEvent event) 
{
    int action = event.getActionMasked();
    if (action == MotionEvent.ACTION_DOWN) 
    {
        mCardView.setCardBackgroundColor(STATE_PRESSED_COLOR);
    } 
    else if (action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_CANCEL) 
    {
        mCardView.setCardBackgroundColor(DEFAULT_COLOR);
    }
    return false;
}
2
weiy

**カードビュー内に行を追加してください**

    Android:clickable="true"
    Android:focusableInTouchMode="true"
    Android:foreground="?android:attr/selectableItemBackground"
2
Prashant Maheshwari Andro

つかいます Android:foreground の代わりに Android:backgroundあなたの<CardView/>。以下はCardViewのサンプルコードです。

 <Android.support.v7.widget.CardView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:clickable="true"
        Android:foreground="?android:attr/selectableItemBackground"
        app:cardCornerRadius="2dp"
        app:cardElevation="2dp">

// others view component 

</Android.support.v7.widget.CardView>
0
Piash Sarker

カードビューと同じコーナー半径の長方形を使用しました。そして、xmldrawableをカードビューの内部ビューの背景として使用しました。背景はカードビューの隅には表示されませんが、カードとその内部ビューの間に小さなパディングが表示されます。

enter image description here

0
Dr. Hasan Hashem

CarBackgroundColorプロパティの定義を見ると、少なくともAndroidサポートライブラリでは：

<resources>
    <declare-styleable name="CardView">
        <!-- Background color for CardView. -->
        <attr name="cardBackgroundColor" format="color" />
    </declare-styleable>
</resource>

ここでは、cardBackgroundValueの色のみを使用すると述べています。これは、セレクターが尊重されないことを意味していると思いますが、デフォルト値まで落ちます。セレクターの下部の色。

0
user6694745