Android流式布局（搜索历史）
流式布局这篇呢，主要是写搜索历史的时候用到了，所以，以下就是我用搜索历史举个例子，如有业务不同，仅供参考！
1.导入依赖
implementation 'com.hyman:flowlayout-lib:1.1.2'
2.外层搜索样式
这里是搜索框及下方搜索历史的展示！
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="@+id/edit_Text"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:hint="请输入搜索的内容"/>
<Button
android:id="@+id/sousuo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="搜索"/>
</LinearLayout>
<com.zhy.view.flowlayout.TagFlowLayout
android:id="@+id/id_flowlayout"
//切记这里变成app
app:max_select="-1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="20dp">>
</com.zhy.view.flowlayout.TagFlowLayout>
</LinearLayout>
3.Activity中实现流式布局
这里我没有请求接口，是自己写的一些假数据，而且数据有些！哈哈哈～～
public class MainActivity extends AppCompatActivity {
private String[] data={"流感", "咳嗽", "过敏", "发烧", "感冒",
"湿疹", "便秘", "痔疮", "协和", "鼻炎", "失眠", "痛风", "上火",
"脚气", "抑郁症", "性欲", "乳腺增生", "头晕", "腰痛"};
List<String> list=new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final TagFlowLayout mFlowLayout = findViewById(R.id.id_flowlayout);
final EditText ed = findViewById(R.id.ed);
Button ss = findViewById(R.id.ss);
for(int i=0;i<data.length;i++)
{
list.add(data[i]);
}
setAdapter(mFlowLayout);
ss.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
String s = ed.getText().toString();
list.add(s);
setAdapter(mFlowLayout);
}
});
}
private void setAdapter(TagFlowLayout mFlowLayout) {
mFlowLayout.setAdapter(new TagAdapter<String>(list)
{
@Override
public View getView(FlowLayout parent, int position, String s)
{
//加入你的布局
TextView tv = (TextView) View.inflate(MainActivity.this, R.layout.tv, null);
tv.setText(s);
return tv;
}
});
}
}
4.需要引入的样式
这是流式布局中每一块儿的样式，说白了就是搜索完之后下面每一个搜索历史！
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@color/colorAccent"
android:text="Helloworld"
android:textColor="@color/colorPrimaryDark">
</TextView>
上面这个是简单一点的,下面呢，是我用自定义view写的一套流式布局！有些乱～
1.New一个类
public class ViewClass extends LinearLayout {
private final DisplayMetrics metrics;
private final int widthPixels;
private final int heightPixels;
public ViewClass(Context context, AttributeSet attrs) {
super(context, attrs);
metrics = context.getResources().getDisplayMetrics();
widthPixels = metrics.widthPixels;
heightPixels = metrics.heightPixels;
setOrientation(VERTICAL);
}
public void setData(String[] data){
LinearLayout lin = getLin();
for (int i = 0; i <data.length ; i++) {
String tmp=data[i];
int numWidth=0;
int childCount = lin.getChildCount();
for (int j = 0; j <childCount ; j++) {
TextView tv = (TextView) lin.getChildAt(j);
LayoutParams params = (LayoutParams) tv.getLayoutParams();
int leftMargin = params.leftMargin;
tv.measure(getMeasuredWidth(),getMeasuredHeight());
numWidth+= tv.getMeasuredWidth() + leftMargin + tv.getPaddingLeft() + tv.getPaddingRight();
}
TextView textView = setText();
LayoutParams layoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
layoutParams.leftMargin=10;
layoutParams.topMargin=5;
textView.setLayoutParams(layoutParams);
textView.setText(tmp);
textView.measure(getMeasuredWidth(),getMeasuredHeight());
int textdataWidth = textView.getMeasuredWidth() + textView.getPaddingRight() + textView.getPaddingLeft();
if (widthPixels>=numWidth+textdataWidth){
lin.addView(textView);
}
else {
lin = getLin();
lin.addView(textView);
}
}
}
public LinearLayout getLin(){
LinearLayout linearLayout = new LinearLayout(getContext());
LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
linearLayout.setLayoutParams(params);
this.addView(linearLayout);
return linearLayout;
}
public TextView setText(){
TextView textView = new TextView(getContext());
textView.setTextColor(Color.RED);
textView.setTextSize(20);
textView.setPadding(10,10,10,10);
textView.setBackgroundResource(R.drawable.style_s);
return textView;
}
}
2.Activity中实现效果
下面还是有些恶心的数据
public class MainActivity extends AppCompatActivity {
private String[] data={"流感", "咳嗽", "过敏", "发烧", "感冒", "湿疹", "便秘", "痔疮", "协和", "鼻炎", "失眠", "痛风", "上火", "脚气", "抑郁症", "性欲", "乳腺增生", "头晕", "腰痛"};
private ViewClass vc;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vc = findViewById(R.id.vc);
vc.setData(data);
}
}
3.导入样式
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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">
<zjq.com.drainlayout.ViewClass
android:id="@+id/vc"
android:layout_width="match_parent"
android:layout_height="wrap_content"></zjq.com.drainlayout.ViewClass>
</LinearLayout>
4.在drawable中创建shape调试自己的颜色,宽高,半径
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:color="@color/colorAccent" android:width="4dp"></stroke>
<corners android:radius="10dp"></corners>
</shape>