流式布局依赖 implementation 'com.zhy:flowlayout-lib:1.0.3'
1.xml布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <EditText android:id="@+id/editText" android:layout_width="330dp" android:layout_height="30dp" android:layout_marginLeft="15dp" android:hint=" 在千万海外商品中搜索" android:background="@drawable/shape" android:layout_marginTop="10dp" /> <ImageView android:id="@+id/image" android:layout_width="35dp" android:layout_height="35dp" android:layout_alignLeft="@+id/editText" android:layout_alignTop="@+id/editText" android:layout_alignBottom="@+id/editText" android:src="@drawable/sousuo" /> <TextView android:id="@+id/text_search" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBottom="@+id/editText" android:layout_alignParentEnd="true" android:layout_marginEnd="11dp" android:text="搜索" android:textColor="#000" android:textSize="22sp" /> <ImageView android:id="@+id/image_delete" android:layout_width="40dp" android:layout_height="40dp" android:layout_alignEnd="@+id/text_search" android:layout_alignParentTop="true" android:layout_marginTop="61dp" android:src="@drawable/delete" /> <TextView android:id="@+id/near" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/editText" android:layout_marginTop="23dp" android:text="最近搜索" android:textSize="22sp" android:textColor="#000" android:layout_marginLeft="20dp" /> <TextView android:id="@+id/near_text" android:layout_width="wrap_content" android:layout_height="32dp" android:layout_alignEnd="@+id/near" android:layout_alignParentTop="true" android:layout_marginTop="111dp" android:background="@drawable/shape_text" android:text="雅诗兰黛" android:textSize="16dp" /> <TextView android:id="@+id/search" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignStart="@+id/near" android:layout_marginTop="177dp" android:text="搜索发现" android:textColor="#000" android:textSize="22sp" /> <com.zhy.view.flowlayout.TagFlowLayout android:id="@+id/flowlayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/search" android:padding="20dp" app:max_select="1" /> </RelativeLayout>
2.把搜索框变成圆边
<shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#D3D3D3" /> <corners android:radius="10dp" /> <padding android:left="5dp" android:right="5dp" android:top="5dp" android:bottom="5dp" /> </shape>
3.给流式布局里面的TextView设置背景样式
<shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#D3D3D3" /> <corners android:radius="10dp" /> <padding android:left="5dp" android:right="5dp" android:top="5dp" android:bottom="5dp" /> </shape>
4.最重要的activity
public class MainActivity extends AppCompatActivity { TagFlowLayout flowLayout; List<String> list; TextView text_search; EditText editText; KeyAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); flowLayout=findViewById(R.id.flowlayout); text_search=findViewById(R.id.text_search); editText=findViewById(R.id.editText); list=new ArrayList<>(); list.add("考拉三周年人气热气销榜"); list.add("电动牙刷"); list.add("尤妮佳"); list.add("豆豆鞋"); list.add("沐浴露"); list.add("日东红茶"); list.add("榴莲"); list.add("电动牙刷"); list.add("尤妮佳"); list.add("雅诗兰黛"); list.add("豆豆鞋"); final KeyAdapter adapter=new KeyAdapter(list); flowLayout.setAdapter(adapter); //搜索按钮点击事件 text_search.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { String key=editText.getText().toString(); if (!TextUtils.isEmpty(key)){ list.add(key); adapter.notifyDataChanged(); //TODO 跳转 Intent intent = new Intent(MainActivity.this, SecondActivity.class); intent.putExtra("key", key); startActivity(intent); } } }); //设置点击事件 flowLayout.setOnTagClickListener(new TagFlowLayout.OnTagClickListener() { @Override public boolean onTagClick(View view, int position, FlowLayout parent) { //Toast.makeText(MainActivity.this,adapter.getItem(position),Toast.LENGTH_SHORT).show(); String key = adapter.getItem(position);//获取点击项目的值 Intent it=new Intent(MainActivity.this,SecondActivity.class); it.putExtra("key",key); startActivity(it); return true; } }); } class KeyAdapter extends TagAdapter<String> { public KeyAdapter(List<String> datas) { super(datas); } @Override public View getView(FlowLayout parent, int position, String s) { TextView textView=new TextView(parent.getContext()); textView.setTextSize(16); textView.setText(s); textView.setBackgroundResource(R.drawable.shape_text); return textView; } } }