简单的流式布局（移动应用开发）

1.首先创建一个自定义View类:

public class CustomView extends ViewGroup {
private int mleftMargin=20;
private int mtopMargin=20;

public CustomView(Context context) {
this(context,null);
}

public CustomView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}

public CustomView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
measureChildren(widthMeasureSpec,heightMeasureSpec);

int leftMargin = mleftMargin;
int topMargin = mtopMargin;

int viewHeight = 0;
int viewWidth = 0;

//父控件传进来的宽度和高度以及对应的测量模式
int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
int modeWidth = MeasureSpec.getMode(widthMeasureSpec);
int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
int modeHeight = MeasureSpec.getMode(heightMeasureSpec);

switch (modeHeight){
case MeasureSpec.AT_MOST:
int measuredHeight = 0;
for (int j = 0; j < getChildCount(); j++) {
int measuredWidth = getChildAt(j).getMeasuredWidth();
measuredHeight = getChildAt(j).getMeasuredHeight();
if (leftMargin+measuredWidth+mleftMargin>getWidth()){
leftMargin=mleftMargin;
topMargin+=measuredHeight+mtopMargin;
}
leftMargin+=measuredWidth+mleftMargin;
}
topMargin+=measuredHeight+mtopMargin;
break;
}
setMeasuredDimension(sizeWidth,topMargin);
}

@Override
protected void onLayout(boolean b, int i, int i1, int i2, int i3) {
int leftMargin = mleftMargin;
int topMargin = mtopMargin;

for (int j = 0; j < getChildCount(); j++) {
int measuredWidth = getChildAt(j).getMeasuredWidth();
int measuredHeight = getChildAt(j).getMeasuredHeight();
if (leftMargin+measuredWidth+mleftMargin>getWidth()){
leftMargin=mleftMargin;
topMargin+=measuredHeight+mtopMargin;
getChildAt(j).layout(leftMargin,topMargin,leftMargin+measuredWidth,topMargin+measuredHeight);
}else {
getChildAt(j).layout(leftMargin,topMargin,leftMargin+measuredWidth,topMargin+measuredHeight);
}
leftMargin+=measuredWidth+mleftMargin;
}
}
}
2.自定义搜索框布局xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:andro></View>

<EditText
android:>
</ListView>
</LinearLayout>
3.在Activity要写的内容:

public class SearchActivity extends BaseActivity implements View.OnClickListener {
String[] name={"手机","电脑","玩具","手机","电脑","苹果手机", "笔记本电脑", "电饭煲 ", "腊肉",
"特产", "剃须刀", "宝宝", "康佳", "特产", "剃须刀", "宝宝", "康佳"};
private ImageView mSearchBack;
private ImageView mRelationSearch;
private View mSearchLine;
/**
* 请输入关键词搜索
*/
private EditText mSearchInputSearch;
/**
* 搜索
*/
private TextView mResultSearch;
private CustomView mSearchFlowlayout;
/**
* 清空记录
*/
private Button mSearchClear;
private ListView mSearchList;
private TextView textView;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
void initView() {
mSearchBack = (ImageView) findViewById(R.id.search_back);
mRelationSearch = (ImageView) findViewById(R.id.relation_search);
mSearchLine = (View) findViewById(R.id.search_line);
mSearchInputSearch = (EditText) findViewById(R.id.search_input_search);
mResultSearch = (TextView) findViewById(R.id.result_search);
mSearchFlowlayout = (CustomView) findViewById(R.id.search_flowlayout);
mSearchClear = (Button) findViewById(R.id.search_clear);
mSearchClear.setOnClickListener(this);
mSearchList = (ListView) findViewById(R.id.search_list);
}
@Override
void initData() {
//设置默认显示
for (int i = 0; i < name.length; i++) {
textView = new TextView(this);
textView.setText(name[i]);
//设置背景
textView.setBackground(getDrawable(R.drawable.addatten_edit));
//设置内边距
textView.setPadding(5,5,5,5);
textView.setTextSize(20);
//设置颜色
textView.setTextColor(Color.RED);
//添加数据
mSearchFlowlayout.addView(textView);
}
//点击搜索添加
mResultSearch.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
String s = mSearchInputSearch.getText().toString();
textView = new TextView(SearchActivity.this);
textView.setBackground(getDrawable(R.drawable.addatten_edit));
textView.setPadding(5,5,5,5);
textView.setTextSize(20);
textView.setText(s);
mSearchFlowlayout.addView(textView);
}
});
//mSearchFlowlayout.invalidate(); 刷新UI布局
// mSearchFlowlayout.removeAllViews(); 删除所有
//mSearchFlowlayout.removeView(); 删除单个子控件
}
@Override
BasePresenter setBasePresenter() {
return null;
}
@Override
int setChildContenView() {
return R.layout.activity_search;
}
@Override
public void onClick(View v) {
switch (v.getId()) {
default:
break;
case R.id.search_clear:
mSearchFlowlayout.removeAllViews();
break;
}
}
}
4.自定义边框:addatten_edit.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:andro />
</shape>