一个简单的模拟歌曲分类的布局

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u010339039/article/details/53701321

模拟了一个电台分类的菜单。

这个挺简单的。就是根据数据控制控件的位置就行了。

数据源就是一个二维的数组

private List<List<ClassifyBean>> lists = new ArrayList<List<ClassifyBean>>();

然后第一个格子要大的占两行。

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
        for (int i = 0; i < lists.size(); ++i) {
            List<Button> tempListBt = new ArrayList<Button>();
            RelativeLayout rl = new RelativeLayout(getContext());
            LayoutParams rlParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
            rlParams.topMargin = 9;
            //控制控件放在哪里
            int leftMarin = 0;
            int topMargin = 0;

            for (int j = 0; j < lists.get(i).size(); ++j) {

                Button bt = new Button(getContext());
                bt.setBackgroundResource(R.drawable.click_border_selector);
                bt.setId(View.generateViewId());
                bt.setTextColor(getColor(R.color.white));
                final ClassifyBean cb =  lists.get(i).get(j);
                String text = cb.getName();
                bt.setText(text);
                tempListBt.add(bt);
                bt.setOnClickListener(new OnClickListener() {

                    @Override
                    public void onClick(View v) {
                        if(clickInter != null){
                            clickInter.clickClassify(cb);
                        }
                    }
                });
                if(j == 0){
                    //第一个，大块的
                    RelativeLayout.LayoutParams btParams = new RelativeLayout.LayoutParams(
                            gridWidth, gridWidth);
                    btParams.leftMargin = leftMarin;
                    btParams.topMargin = topMargin;
                    bt.setLayoutParams(btParams);
                    leftMarin += gridWidth;

                }
                else if(leftMarin  >= width){
                    //换行
                    topMargin += gridWidth / 2 ;
                    if (j == 4) {
                        // 第二行
                        leftMarin = gridWidth;
                    } else {
                        // 超过第二行了
                        leftMarin = 0;
                    }
                    RelativeLayout.LayoutParams btParams = new RelativeLayout.LayoutParams(
                            gridWidth, gridWidth / 2);
                    btParams.leftMargin = leftMarin;
                    btParams.topMargin = topMargin;
                    bt.setLayoutParams(btParams);
                    leftMarin += gridWidth;
                }
                else{
                    RelativeLayout.LayoutParams btParams = new RelativeLayout.LayoutParams(
                            gridWidth, gridWidth / 2);
                    btParams.leftMargin = leftMarin;
                    btParams.topMargin = topMargin;
                    bt.setLayoutParams(btParams);
                    leftMarin += gridWidth;
                }
                rl.addView(bt);
            }
            listBt.add(tempListBt);
            this.addView(rl, rlParams);
        }

    }

主要就是控制以下onlayout的布局就可以了。

调用的：

 <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <sudoku.myself.xhc.com.myapplication.ClassifyView
        android:id="@+id/classify_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
         />
 </ScrollView>

外面之所以有ScrollView，是因为很有可能会超出屏幕。

控件的位置就是用margin来控制的。好了。到这里。

源码下载

习大大说要早点休息

加好友：