前言
搜索界面一直是一个APP至关重要的部分,也是用户用的最多的界面,那么历史搜索和热门标签的话,也是这个界面所需要的重要的组成部分。
本篇文章旨在帮助大家如何写好两个重要的部分。话不多说,先上图
界面
用到的控件和框架
3.FlowLayoutTag 标签控件(也是本人写的控件,具体在引用如下)
compile’com.daidingkang:flowlayouttag:1.0.0’
FlowLayoutTag主要代码
FlowLayout.class
/**
* 自定义流式布局
*/
public class FlowLayout extends ViewGroup {
private LayoutInflater mInflater;
private boolean isColorful;
public FlowLayout(Context context) {
this(context, null);
}
public FlowLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public FlowLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mInflater = LayoutInflater.from(getContext());
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
int modeWidth = MeasureSpec.getMode(widthMeasureSpec);
int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
int modeHeight = MeasureSpec.getMode(heightMeasureSpec);
// wrapContent
int width = 0;
int height = 0;
// 记录每一行的宽和高
int lineWidth = 0;
int lineHeight = 0;
// 得到内部元素的个数
int count = getChildCount();
for (int i = 0; i < count; i++) {
View child = getChildAt(i);
// 测量子View的宽和高
measureChild(child, widthMeasureSpec, heightMeasureSpec);
// 得到LayoutParams
MarginLayoutParams lp = (MarginLayoutParams) child
.getLayoutParams();
// 子view的占据的宽度
int childWidth = child.getMeasuredWidth() + lp.leftMargin
+ lp.rightMargin;
// 子view占据的高度
int childHeight = child.getMeasuredHeight() + lp.topMargin
+ lp.bottomMargin;
// 换行
if (lineWidth + childWidth > sizeWidth - getPaddingLeft()
- getPaddingRight()) {
// 对比得到最大的宽度
width = Math.max(width, lineWidth);
// 重置lineWidth
lineWidth = childWidth;
// 记录行高
height += lineHeight;
lineHeight = childHeight;
} else {
// 未换行
// 叠加行宽
lineWidth += childWidth;
// 得到当前最大高度
lineHeight = Math.max(lineHeight, childHeight);
}
// 最后一个控件
if (i == count - 1) {
width = Math.max(lineWidth, width);
height += lineHeight;
}
}
// Log.i("test", "sizeWidth" + sizeWidth);
// Log.i("test", "sizeHeight" + sizeHeight);
setMeasuredDimension(modeWidth == MeasureSpec.EXACTLY ? sizeWidth
: width + getPaddingLeft() + getPaddingRight(),
modeHeight == MeasureSpec.EXACTLY ? sizeHeight : height
+ getPaddingTop() + getPaddingBottom());
setPadding(dp2px(20), dp2px(10), dp2px(20), dp2px(10));
}
// 储存所有的View
private ArrayList<ArrayList<View>> mAllViews = new ArrayList<>();
// 储存每一行的高度
private ArrayList<Integer> mLineHeight = new ArrayList<>();
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
// TODO Auto-generated method stub
// 清除一下list集合
mAllViews.clear();
mLineHeight.clear();
// 得到viewGroup当前宽度
int width = getWidth();