android本身并不提供流式布局,有一类需求,如淘宝客户端中选择商品的款式时,款式的按钮根据其文字不同而长度变化,并且不同的手机屏幕的宽度也不同,想要实现流式地排版按钮,就需要动态地添加和判断了。

本文提供了一种简单的流式布局实现方法,非封装的控件,但简单实用。

这里隐藏的数据格式的细节,不贴出全部代码

首选,我们对于正式的界面有一个布局,但是我们为了测试这个布局,需要把这个xml重新inflate出来,把控件加进去,才能够测出控件的长度。

以下的代码把当前界面的layout重复地inflate出来,作为样例

    sampleView = (View) LayoutInflater.from(StyleSelectActivity.this).inflate(
                R.layout.activity_common_select_style, null);
    sampleTv = (TextView) sampleView.findViewById(R.id.sample_text);
    sampleContainer = (LinearLayout) sampleView.findViewById(R.id.rl_sale_style_content);
    sampleDivide = (View) sampleView.findViewById(R.id.view_divider1);

当我们要添加一个TextView时:
(1)使用sample控件先设置标签
(2)在sampleView中测量sample控件的长度
(3)加上需要的margin长度(注意要转化成px)
(4)判断当前行剩余的长度,能否容纳这个标签,如果能,则新建一个tv加入当前行的linearlayout中,否则,新建一个linearlayout,加入到下一行,把剩余长度更新为控件宽度

// 机智地测试它的宽度
    sampleTv.setText("一个动态长度的标签");

    int w = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
    int h = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
    sampleTv.measure(w, h);
    int width = sampleTv.getMeasuredWidth();

// 转成px
    int margin = (int) (TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, this.getResources()
                .getDisplayMetrics()));

    if (width + margin < tmpLen) {
            ll.addView(tv);
            tmpLen -= width + margin;
    } else {
            rl_sale_style_content.addView(ll);
            ll = getNewLL();
            ll.addView(tv);
            tmpLen = len - width - margin;
    }

剩下的事情,只需要把表现用数组管理起来,控制他们的状态,点击事件就行了。


文章为原创,转载请注明出处。


小猪
114 声望4 粉丝