首页 > 代码库 > 流式布局的实现-1
流式布局的实现-1
流式布局可以实现逐行填满的布局效果;适用于关键词搜索和热门展示,可以动态的添加标签,用起来十分方便与快捷
源码下载(由慕课网的老师提供,谢谢)
之后说说主要的安排:
第一篇:创建类,确定继承关系,实现构造函数,确定成员函数;
第二篇:实现FlowLayout(流式布局)主要函数的方法;第一篇:创建类,确定继承关系,实现构造函数,确定成员函数;
第二篇与之后几篇:实现各函数,并说明成员变量的作用;
和用listView实现下拉刷新一样,还是先分析文件结构:
包括了两个类:
public class MainActivity extends Activity; public class FlowLayout extends ViewGroup;
MainActivity:用于加载主布局,将子View动态的添加到自定义布局中;
FlowLayout:继承自ViewGroup,用于实现流式布局;ViewGroup是容纳各种UI组件的容器,继承自View(官方解释:A ViewGroup is a special view that can contain other views (called children.) The view group is the base class for layouts and views containers.),常见的继承自ViewGroup的有我们所熟悉的ListView(ListView <- AbsListView <- AdapterView <- ViewGroup);
在Activity中:
成员变量:
private String[] mVals; private FlowLayout mFlowLayout;
mVals:用于动态加载标签,作为TextView的Text数据源;
mFlowLayout:FlowLayout布局;
成员函数:
public void initData()
initData:添加标签,将mVals中的字符写入到标签中,并将标签加载到FlowLayout布局中;
init方法:
public void initData() { LayoutInflater mInflater = LayoutInflater.from(this); for (int i = 0; i < mVals.length; i++) { TextView tv = (TextView) mInflater.inflate(R.layout.tv, mFlowLayout, false); tv.setText(mVals[i]); mFlowLayout.addView(tv); } }
首先调用LayoutInflater的静态成员函数from,获得主布局的LayoutInflater,以便之后设置主布局中嵌套的FlowLayout布局的View对象;
之后在for循环中,用主布局的inflate函数得到一个新的TextView对象,将数据源mVals中的数据写入到TextView中,调用FlowLayout布局的addView方法,将新的TextView加入到其中;
在FlowLayout类中:
成员变量:
private List<List<View>> mAllViews; private List<Integer> mLineHeight;
mAllViews:存储所有的View;
mLineHeight:每一行的高度;
成员函数:
public FlowLayout(Context context); public FlowLayout(Context context, AttributeSet attrs); public FlowLayout(Context context, AttributeSet attrs, int defStyle); protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec); protected void onLayout(boolean changed, int l, int t, int r, int b); public LayoutParams generateLayoutParams(AttributeSet attrs);
各个构造函数的参数,调用时机与重写:
一个参数的:为上下文;new一个控件,传入的是上下文对象;重写,让他调用两个参数的构造方法;
两个参数的:为上下文和属性集;是在布局文件中书写控件的属性时而没有自定义属性时调用;重写,让他调用三个参数的构造方法;
三个参数:为上下文,属性集和defStyle,是在布局文件中书写控件的属性时而且使用了自定义属性时调用;
onMerasure:测量view及其内容来确定view的宽度和高度。这个方法在measure(int, int)中被调用,必须被重写来精确和有效的测量view的内容;
onLayout:在view给其孩子设置尺寸和位置时被调用。子view,包括孩子在内,必须重写onLayout(boolean, int, int, int, int)方法,并且调用各自的layout(int, int, int, int)方法。参数changed表示view有新的尺寸或位置;参数l表示相对于父view的Left位置;参数t表示相对于父view的Top位置;参数r表示相对于父view的Right位置;参数b表示相对于父view的Bottom位置。
generateLayoutParams:指明ViewGroup与LayoutParams的关系;因为要规定间距,所以直接return new MarginLayoutParams(getContext,attrs);
流式布局的实现-1