Java 带芯片的Android AutoCompleteTextView

我不确定我是否使用了这个UI功能的正确词语，但我已经附上了我希望在我的应用程序中实现的功能的快照

Go SMS使用它，用户在编辑文本中键入联系人，在用户从“完成”下拉列表中选择联系人后，该联系人将插入到编辑文本中，如所附图像所示。编辑文本仍然打开以接受进一步输入

对于我的应用程序，我希望在用户输入逗号后立即进行分组和插入，就像StackOverflow的标记输入一样（但我相信我可以单独处理）。我的问题是这是什么类型的视图，或者我如何修改EditText使其表现为这样

---

谢谢。

更新：

官方的做法是现在通过芯片材料组件

---

旧答案：

您正在寻找芯片库

• 这里有一个

• 另一个使用Roman Nurik联系人的库

---

谷歌的官方芯片库（用于Gmail、电子邮件、日历、短信）位于

---

有关如何使用它的简单示例，请参见另外两个芯片库

• 。与其他一些不同的是，这一款经过更新，具有反映新发布的“材料设计”的视觉效果

• 。这是一个Android Gmail风格的令牌，自动完成文本字段和过滤器
  
  

---

Android材料芯片有了新的发展
我认为我们可以使用Recycler视图和编辑文本或自动完成文本视图构建自己的芯片视图。所以我们可以很容易地定制它
1。在Drawable中创建了标记形状，如tags_layout.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#cfcfcf">
</solid>
<corners android:radius="20dp">
</corners>

5。回收器视图的适配器类

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_margin="4dp"
android:gravity="center"
android:background="@drawable/tags_layout">
<TextView
    android:id="@+id/tag_textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxLines="1"
    android:maxLength="25"
    android:ellipsize="end"
    android:padding="2dp"
    android:text="Hello"/>
<ImageView
    android:id="@+id/tag_closeBtn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_close"/>

        public class RecyclerModel {
    private String tagText;

    public RecyclerModel(String tagText){
        this.tagText = tagText;
    }
    public String getTagText() {
        return tagText;
    }

    public void setTagText(String tagText) {
        this.tagText = tagText;
    }
}

    public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.RecyclerAdapterHolder> {
    Context context;
    ArrayList<RecyclerModel> model = new ArrayList<>(  );

    public RecyclerAdapter(Context context,ArrayList<RecyclerModel> model){
        this.context = context;
        this.model = model;
    }

    @NonNull
    @Override
    public RecyclerAdapterHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.recycler_layout, parent, false);

        return new RecyclerAdapterHolder(itemView);
    }

    @Override
    public void onBindViewHolder(final RecyclerAdapterHolder holder, final int position) {
        final RecyclerModel mod = model.get( position );
        holder.tagTextView.setText( mod.getTagText() );
        //remove tag on click x button
        holder.tagImageView.setOnClickListener( new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                model.remove( position );
                notifyDataSetChanged();
            }
        } );
    }

    @Override
    public int getItemCount() {
        return model.size();
    }

    public static class RecyclerAdapterHolder extends RecyclerView.ViewHolder {
        public TextView tagTextView;
        public ImageView tagImageView;
        public RecyclerAdapterHolder(View itemView) {
            super( itemView );
            tagTextView = itemView.findViewById( R.id.tag_textView );
            tagImageView = itemView.findViewById( R.id.tag_closeBtn );
        }
    }
}

---

从android支持库28.0.0版开始，谷歌添加了

芯片

视图，允许我们在布局中显示芯片视图。
还有一个简单的例子：

<android.support.design.chip.ChipGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    app:chipSpacing="8dp">

    <android.support.design.chip.Chip
        android:id="@+id/some_chip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android Chip Group"
        app:chipIcon="@drawable/ic_android"
        app:closeIconVisible="true" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android"
        app:chipIcon="@drawable/ic_android" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Chip"
        app:chipIcon="@drawable/ic_android" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Group"
        app:chipIcon="@drawable/ic_android" />
</android.support.design.chip.ChipGroup>

---

很多东西都变了。我们有了新的图书馆。我推荐你。这是非常容易和强大的

只需添加此依赖项

implementation "com.hootsuite.android:nachos:1.1.1"

而这一观点

<com.hootsuite.nachos.NachoTextView
    android:id="@+id/nacho_text_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:chipHorizontalSpacing="2dp"
    app:chipBackground="@color/chip_background"
    app:chipTextColor="@color/cheddar"
    app:chipTextSize="16dp"
    app:chipHeight="30dp"
    app:chipVerticalSpacing="3dp"/>

很好的发现。我会记住的。我相信会的，非常感谢！感谢这是简单和适用的组件是根据apache2许可证，这是否意味着如果我使用它，我也必须使我的应用程序开源？至少上传样本/演示APK，以便我们可以在实际使用它之前测试它。thanks@ralphspoon泡菜中的一个是必须挠痒痒的人=）两个存储库都包含样本。克隆repo，在Android Studio中打开，为自己构建一个样本并运行它。@bormat我不是律师。阅读。@ScottKennedy如何将芯片导入android studio？@ScottKennedy如何将芯片作为我当前项目的库导入android studio，以及如何使用此库？太好了。但是有没有可能像上面图像的输出一样，同时使用RecyclerView和MultiAutoCompleteTextView呢？我认为这是可能的。需要尝试在recycler视图中追加EditText，并将其显示为最后一个视图类型。
<android.support.design.chip.ChipGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    app:chipSpacing="8dp">

    <android.support.design.chip.Chip
        android:id="@+id/some_chip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android Chip Group"
        app:chipIcon="@drawable/ic_android"
        app:closeIconVisible="true" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android"
        app:chipIcon="@drawable/ic_android" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Chip"
        app:chipIcon="@drawable/ic_android" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Group"
        app:chipIcon="@drawable/ic_android" />
</android.support.design.chip.ChipGroup>

implementation "com.hootsuite.android:nachos:1.1.1"

<com.hootsuite.nachos.NachoTextView
    android:id="@+id/nacho_text_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:chipHorizontalSpacing="2dp"
    app:chipBackground="@color/chip_background"
    app:chipTextColor="@color/cheddar"
    app:chipTextSize="16dp"
    app:chipHeight="30dp"
    app:chipVerticalSpacing="3dp"/>

val suggestions = arrayOf("Tortilla Chips", "Melted Cheese", "Salsa", "Guacamole", "Mexico", "Jalapeno")
val adapter = ArrayAdapter(context, android.R.layout.simple_dropdown_item_1line, suggestions)
nachoTextView.setAdapter(adapter)