卡片视图选择器

Question

我正在创建一个笔记应用程序，我正在使用上下文操作栏删除笔记。我的笔记显示在卡片视图中。我让操作栏工作到可以选择笔记并删除它们的程度。但是当我选择笔记时，我想尽可能使用复选标记作为选择器(否则任何选择器(，但我未能成功实现。

上下文操作栏

mListViewNotes = (ListView) findViewById(R.id.listview_notes);
    mListViewNotes.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE_MODAL);
    mListViewNotes.setMultiChoiceModeListener(new AbsListView.MultiChoiceModeListener() {
        CardView cardView = (CardView) findViewById(R.id.cardView);
        @Override
        public void onItemCheckedStateChanged(ActionMode mode, int position, long id, boolean checked) {
            if (list_items.contains(notes.get(position))) {
                count = count-1;
                list_items.remove(notes.get(position));
                mode.setTitle(count + " Notes Selected");
            } else {
                count = count+1;
                list_items.add(notes.get(position));
                mode.setTitle(count + " Notes Selected");
            }
            if (count == 0) {
                mode.setTitle("No Notes Selected");
            }
        }
        @Override
        public boolean onCreateActionMode(ActionMode mode, Menu menu) {
            app_bar.setVisibility(View.GONE);
            MenuInflater inflater = mode.getMenuInflater();
            inflater.inflate(R.menu.context_menu, menu);
            actionMode = mode;
            return true;
        }
        @Override
        public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
            return false;
        }
        @Override
        public boolean onActionItemClicked(ActionMode mode, MenuItem item) {
            deleteNote();
            return true;
        }
        @Override
        public void onDestroyActionMode(ActionMode mode) {
            count = 0;
            app_bar.setVisibility(View.VISIBLE);
            list_items.clear();
        }
    });
}

item_note.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/light_sand"
android:orientation="vertical"
android:id="@+id/item_note">
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:layout_gravity="center"
    android:layout_marginBottom="6dp"
    android:layout_marginEnd="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="6dp"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="6dp">
    <ImageView
        android:layout_width="1000dp"
        android:layout_height="150dp"
        android:layout_gravity="start"
        android:layout_marginLeft="-80dp"
        android:layout_marginTop="-12dp"
        android:background="@drawable/texture_tile_old"
        android:scaleType="fitStart" />
    <ImageView
        android:id="@+id/clef_note"
        android:layout_width="70dp"
        android:layout_height="120dp"
        android:layout_gravity="start"
        android:layout_marginTop="10dp"
        android:background="@drawable/treble_clef" />
    <View
        android:layout_width="780dp"
        android:layout_height="1dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="43dp"
        android:background="@color/black" />
    <View
        android:layout_width="780dp"
        android:layout_height="1dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="70dp"
        android:background="@color/black" />
    <View
        android:layout_width="780dp"
        android:layout_height="1dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="97dp"
        android:background="@color/black" />
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:scaleType="center">
        <TextView
            android:id="@+id/list_note_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="65dp"
            android:layout_marginTop="8dp"
            android:textColor="@color/black"
            android:textSize="28sp" />
        <TextView
            android:id="@+id/list_note_content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="46dp"
            android:layout_marginLeft="65dp"
            android:layout_marginTop="0dp"
            android:maxLines="2"
            android:textColor="@color/gunmetal"
            android:textSize="20sp"
            android:lineSpacingExtra="4dp"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/brown"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="4dp"
            android:text="Last Updated:"
            android:textColor="@color/white" />
        <TextView
            android:id="@+id/list_note_date"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="4dp"
            android:gravity="end"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:textColor="@color/white" />
    </LinearLayout>
</android.support.v7.widget.CardView>

Answer 1

您可以向项目布局添加CheckBox，和/或更改布局本身的背景以显示所选状态。

使用第一个选项，您只需将布局设置为isChecked即可将布局更改为所选状态 true .

checkBox.setChecked(true);

要更改布局的背景，只需将背景设置为新的颜色资源即可。

itemLayout.setBackgroundResource(R.color.color_selected);

或者，您可以使用ColorStateList执行一些更高级的状态更改(例如纯色的涟漪效果(。

ripple_selector.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="@color/color_highlight">
    <item android:drawable="@drawable/color_highlight"/>
</ripple>

item_selector_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
            android:drawable="@color/color_selected"/>
    <item android:drawable="@drawable/ripple_effect"/>
</selector>

若要使用它，可以将布局 xml 中的背景属性设置为 item_selector_background然后更改代码中的选定状态。

itemLayout.setSelected(true);

Answer 2

MaterialCardView 可能是一个很好的解决方案。

结果

<com.google.android.material.card.MaterialCardView
            android:id="@+id/cardView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:strokeWidth="4dp"
            app:rippleColor="@color/colorPrimary"
            app:strokeColor="@color/colorAccent"
            app:cardCornerRadius="@dimen/margin_app"
            app:cardBackgroundColor="@android:color/white">
            <androidx.constraintlayout.widget.ConstraintLayout
                android:paddingVertical="@dimen/margin_large"
                android:paddingHorizontal="@dimen/margin_xlarge"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                ...
            </androidx.constraintlayout.widget.ConstraintLayout> 
  </com.google.android.material.card.MaterialCardView>