FlexBoxLayout结合DBFlow实现流式布局

前言

上一篇文章介绍了DBFlow的一下简单操作，这一次将继续使用DBFlow完成数据的存储。当然这一次我们集合使用了Google推出的FlexboxLayout布局。

使用

DBFlow上一篇介绍了相关配置，这里就不多说了。主要介绍 FlexboxLayout的使用。废话不多说，先贴图：



上图需要流式布局，数据库存储，自定义searcheView.这里主要介绍FlexBoxLayout以及数据库简单存储。

FlexBoxLayout

这里接不介绍一些定义或者优势啥的，相信大家也有所了解，这里主要讲解如何实现上图标签

FlexBoxLayout地址

1.添加依赖：

compile 'com.google.android:flexbox:0.2.6'

2.在你的布局中使用：

<com.google.android.flexbox.FlexboxLayout
android:id="@+id/flexboox_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/px10"
app:alignContent="flex_start"
app:alignItems="flex_start"
app:flexWrap="wrap"/>

3.在代码中动态添加，当成viewgroup

//hotlist---搜索关键字 字段的集合
private void initView(List<HotWordEntity.DataBean.HotBean> hotList){
//获取flexboxlayout
FlexboxLayout flexBoxLayout = (FlexboxLayout)findViewById(R.id.flexboox_layout);
for (int i = 0; i < hotList.size(); i++) {
TextView textView = creatTextView(hotList.get(i).getName());
flexBoxLayout.addView(textView);
}

//点击事件
for (int i = 0; i < flexBoxLayout.getChildCount(); i++) {
//获取每一个childview （添加的textview）
TextView childView = (TextView) flexBoxLayout.getChildAt(i);
//点击事件
flexBoxLayout.getChildAt(i).setOnClickListener(new FlexItemClickListener(childView.getText().toString()));
}

}

4.创建textview

private TextView creatTextView(String text) {
TextView textView = new TextView(this);
//字体颜色
textView.setTextColor(ContextCompat.getColor(this, R.color.text_666));
//设置字体大小
textView.setTextSize(TypedValue.COMPLEX_UNIT_PX,24);
//使用的鸿阳大神AutoLayout适配 （可以忽略，大家需要自己适配）
AutoUtils.autoTextSize(textView);
textView.setText(text);
//背景
textView.setBackgroundResource(R.drawable.flextext_rect_shape);
FlexboxLayout.LayoutParams layoutParams = new FlexboxLayout.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT);
//padding
int padding = AutoUtils.getPercentHeightSize(20);
ViewCompat.setPaddingRelative(textView,padding , padding,
padding, padding);
layoutParams.setMargins(10, 20, 10, 0);
textView.setLayoutParams(layoutParams);
AutoUtils.auto(textView);
return textView;
}

完成上述 就可以实现动态添加，完成搜索关键字的标签了。 历史标签和上面方法一致

DBFlow

当搜索以后，再搜索历史中动态添加，这里就需要往数据库中存储，然后每次进入此页面，都需要从数据库中读取，回显数据，展示在搜素历史中。

1具体使用

/**
* Created by Ruomiz on 2017/4/20 0020
*/

@Database(name = SearchDataBase.NAME, version = SearchDataBase.VERSION)

public class SearchDataBase {
//数据库名称
public static final String NAME = "SearchDataBase";
//数据库版本号
public static final int VERSION = 1;
}

2.新建model继承baseModel

@Table(database = SearchDataBase.class)

public class SearchModel extends BaseModel{

@PrimaryKey(autoincrement = true)
public int id;

@Column
public String history;

}

3.build——makeProjuect在module的build中查看是否生产对于文件（上一篇有介绍）。

4.当点击搜索以后，将搜索内容存储在数据库中：

//先查询表中是否存在 Ruomiz
Cursor cursor = new Select().from(SearchModel.class).where(SearchModel_Table.history.is(Ruomiz)).query();
//如果表中没有 则存储本地数据库 不重复添加
if (!cursor.moveToNext()) {
SearchModel searchModel = new SearchModel();
searchModel.history = Ruomiz;
searchModel.save(); //存储
}

5.查询所有数据

//查询返回的为集合
List<SearchModel> dataBasesList = new Select().from(SearchModel.class).queryList();

6.清楚搜索历史

//删除表中所有
SQLite.delete(SearchModel.class).execute();

//删除所有
//new Delete().from(SearchModel.class).execute();

//按条件删除 删除表中history为Ruomiz  id为1的字段(这个只为演示)
// SQLite.delete(SearchModel.class)
//  .where(SearchModel_Table.history.e("Ruomiz"))
//  .and(SearchModel_Table.id.eq(1)).execute();

7.每次删除或者搜索后要刷新数据，实现在标签中更新数据。

效果

8.data/data目录下找到你建立的数据库，打开可以查看数据

总结

FlexboxLayout很方便就为我们完成了标签，结合DBFlow完成需求。DBFlow有配置问题可以查看上一篇文章。

DBFlow的初步使用