Androidマルチ選択ui

Question

私は検索してみることもできましたが、私は正しいキーワードを知りません。複数のものを選択する場合、以下のスクリーンショットに似た効果が欲しい。

http://imgur.com/a/G1GJO

アイデアは容易に選択された人を確認し、単に選択から削除するには、「X」をクリックすることです。私はそのようなコンポーネントが既に存在しているのか、それとも手動で作成する必要があるのか​​どうかは分かりません。私が得た最も近いものは、複数の選択リストビューですが、それは理想的には私が望むものではありません。

誰かが正しい方向に向けることができれば、それは非常に感謝しています。

ありがとうございました。

Answer 1

Googleでは、このタイプのUIアフォーダンスをチップと言います。あなたが最も可能性の高いあなたのチップのためになるでしょう

https://material.google.com/components/chips.html

コンテナがFlowLayoutです。

問題は、Googleにこれらを実装するための既成のコンポーネントがないことです。

は、ここで私は私のチップを作った方法は次のとおりです。

/res/drawable/chip_background.xml：

<?xml version="1.0" encoding="utf-8"?> 
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
    <solid android:color="@color/translucent_gray"/> 
    <corners android:radius="16dp"/> 
</shape> 

/res/layout/chip.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="wrap_content" 
    android:layout_height="32dp" 
    android:orientation="horizontal" 
    android:gravity="center_vertical" 
    android:layout_marginLeft="4dp" 
    android:layout_marginRight="4dp" 
    android:layout_marginTop="2dp" 
    android:layout_marginBottom="2dp" 
    android:background="@drawable/chip_background"> 

    <TextView 
     android:id="@+id/title" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:gravity="center_vertical" 
     android:maxLines="1" 
     android:ellipsize="end" 
     android:textSize="13sp" 
     android:textColor="@android:color/white" 
     tools:text="Sample Text"/> 

    <ImageButton 
     android:id="@+id/removeButton" 
     android:layout_width="32dp" 
     android:layout_height="32dp" 
     android:background="@null" 
     android:alpha=".8" 
     android:scaleType="fitCenter" 
     android:padding="7dp" 
     android:src="@drawable/ic_cancel_white_24dp"/> 

</LinearLayout> 

パディングとスケール削除ボタンをタイプすると、チップの楕円にうまく収まるように24dpのアイコンが少し縮小されます。

FlowLayoutの場合は、GitHubで「Android FlowLayout」を検索し、使用するライブラリを見つけることができます。

Answer 2

RecyclerViewにはChipsLayoutManagerを使用して解決策を試すことができます。あなたの問題を解決するには、取り外しリスナー（他のタイプのLayoutManagerの場合と同じように）とアイテムを持つアダプタを作成するだけです。リスナーで

ChipsLayoutManager chipsLayoutManager = ChipsLayoutManager.newBuilder() 
    .build(); 
recyclerView.setLayoutManager(chipsLayoutManager); 
//your adapter 
adapter = new RecyclerViewAdapter(items, onRemoveListener); 

だけ項目リストから削除した項目を削除し、アダプタを更新

private OnRemoveListener onRemoveListener = new OnRemoveListener() { 
    @Override 
    public void onItemRemoved(int position) { 
     items.remove(position); 
     adapter.notifyItemRemoved(position); 
    } 
}; 

項目は、アニメーションで削除されます。