简单的Android流式布局
流式布局：
首先给大家展示一下效果：
大家可以调一下子控件的位置，布局就会变得非常美观！！！
//***展示一下自定义的view
public class FlowLayout extends FrameLayout {
MyHelper helper = new MyHelper(getContext());
private String table="titles";
private SQLiteDatabase database;
public FlowLayout(@NonNull Context context) {
super(context);
}
public FlowLayout(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
public FlowLayout(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
//点击搜索,,,将输入框的内容添加进去
public void getData(String data) {
//加载布局
TextView textView = (TextView) View.inflate(getContext(), R.layout.text_layout, null);
//设置文字
textView.setText(data);
//设置文字自适应
FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
textView.setLayoutParams(layoutParams);
//添加视图
addView(textView);
//添加到数据库
database = helper.getReadableDatabase();
ContentValues values = new ContentValues();
values.put("data",data);
database.insert(table,null,values);
}
public void removeData() {
database.delete(table,null,null);
removeAllViews();
}
//布局
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
//获取本控件的宽度
int width = getWidth();
int row = 0;//行数
int disWidth = 20;//子控件左边的坐标
for (int i = 0; i < getChildCount(); i++) {
View view = getChildAt(i);//查找子控件
int viewWidth = view.getWidth();//获取子控件的宽度
int viewHeight = view.getHeight();//获取子控件的高度
//如果所有子控件的宽度和左边距加起来超过父控件的宽度，则进行换行
if (disWidth + viewWidth > width) {
//换行
row++;
disWidth = 20;//下一行的子控件的第一个控件的左边距相等
}
//设置子空间的位置
view.layout(disWidth, viewHeight * row, disWidth + viewWidth, viewHeight * (row + 1));
//记录下一次子控件的坐标
disWidth += viewWidth;
}
}
}
//***看一下布局activity_main.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/img_search"
android:src="@drawable/sou"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="50dp" />
<EditText
android:id="@+id/edit_text"
android:gravity="center"
android:layout_weight="5"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/text_cancel"
android:text="取消"
android:layout_weight="1"
android:textSize="20sp"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
<RelativeLayout
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="搜索历史"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<ImageView
android:id="@+id/img_clear"
android:layout_alignParentRight="true"
android:src="@drawable/delete"
android:layout_width="40dp"
android:layout_height="40dp" />
</RelativeLayout>
<com.bw.week_01.layout.FlowLayout
android:id="@+id/flow01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:text="流感"
android:background="@drawable/text_shape"
android:textSize="28sp"
android:padding="10dp"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</com.bw.week_01.layout.FlowLayout>
<TextView
android:text="热门搜索"
android:textSize="20sp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<com.bw.week_01.layout.FlowLayout
android:id="@+id/flow02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:text="头晕"
android:background="@drawable/text_shape"
android:textSize="28sp"
android:padding="10dp"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</com.bw.week_01.layout.FlowLayout>
//***这是添加文字大小的xml
<?xml version="1.0" encoding="utf-8"?>//***这是文字的边框
<?xml version="1.0" encoding="utf-8"?>
//***这是MAinActivity.java的代码
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private ImageView img_search;
private ImageView img_clear;
private EditText edit_text;
private TextView text_cancel;
private FlowLayout flow01;
private FlowLayout flow02;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化控件
img_search = findViewById(R.id.img_search);
img_clear = findViewById(R.id.img_clear);
edit_text = findViewById(R.id.edit_text);
text_cancel = findViewById(R.id.text_cancel);
flow01 = findViewById(R.id.flow01);
flow02 = findViewById(R.id.flow02);
img_clear.setOnClickListener(this);
img_search.setOnClickListener(this);
text_cancel.setOnClickListener(this);
String[] strings=new String[]{"流感","咳嗽","过敏","发烧","感冒","湿疹","便秘","痔疮"
,"协和","鼻炎","失眠"};
for (int i = 0; i <strings.length ; i++) {
flow02.getData(strings[i]);
}
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.img_clear:
flow01.removeData();
break;
case R.id.img_search:
String data = edit_text.getText().toString();
// if (TextUtils.isEmpty(data)){
// Toast.makeText(MainActivity.this,“请输入内容”,Toast.LENGTH_SHORT);
// }else{
//
// }
flow01.getData(data);
break;
case R.id.text_cancel://取消
edit_text.setText("");
break;
}
}
}
//这是数据库(数据库是简易版的)
public class MyHelper extends SQLiteOpenHelper{
public MyHelper(Context context) {
//创建数据库
super(context, “bw.db”, null, 1);
}
@Override
public void onCreate(SQLiteDatabase db) {
//创建数据表，id主键自增，一个字段data。，用于存入输入内容
db.execSQL("create table titles(id integer primary key autoincrement,data text)");
}
@Override
public void onUpgrade(SQLiteDatabase sqLiteDatabase, int i, int i1) {
}
}