首页 > 代码库 > 流式布局的实现-1

流式布局的实现-1

流式布局可以实现逐行填满的布局效果;适用于关键词搜索和热门展示,可以动态的添加标签,用起来十分方便与快捷

源码下载(由慕课网的老师提供,谢谢)

之后说说主要的安排:

第一篇:创建类,确定继承关系,实现构造函数,确定成员函数;

第二篇:实现FlowLayout(流式布局)主要函数的方法;

第一篇:创建类,确定继承关系,实现构造函数,确定成员函数;

 第二篇与之后几篇:实现各函数,并说明成员变量的作用;

和用listView实现下拉刷新一样,还是先分析文件结构:
5489729e0001c44d02340115.jpg

包括了两个类:

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