效果是:點擊按鈕使一個自定義布局里的的控件交叉

初始化一下數(shù)據(jù):
自定義控件的代碼:

package test.pgl.com.customviewgroupcrosslayout;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by Administrator on 2017/5/28.
 */

public class MyViewGroup extends ViewGroup {
    public MyViewGroup(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        //遍歷所有的子view
        int left=0;
        int top=0;
        for (int i = 0; i < getChildCount(); i++) {
            //根據(jù)索引獲取到當(dāng)前的子view
            View childView = getChildAt(i);
            if(i%2==0){
                left = 0;
            }else{
                left = getMeasuredWidth()-childView.getMeasuredWidth();
            }
            //給每一個子view 擺放到一個合適的位置
            childView.layout(left,top,left+childView.getMeasuredWidth(),top+childView.getMeasuredHeight());
            //修改top實現(xiàn)每一個子view從上到下的疊放效果
            top+=childView.getMeasuredHeight();
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //主動測量所有的孩子
        measureChildren(0,0);
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

}

布局代碼:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="test.pgl.com.customviewgroupcrosslayout.MainActivity">

    <Button
        android:onClick="Cross"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按鈕" />
    <test.pgl.com.customviewgroupcrosslayout.MyViewGroup
        android:id="@+id/myViewGroup"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <View
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:background="#ff0000"/>
        <View
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:background="#00ff00"/>
        <View
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:background="#0000ff"/>
        <View
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:background="#000000"/>
    </test.pgl.com.customviewgroupcrosslayout.MyViewGroup>
</LinearLayout>

效果:

Paste_Image.png

現(xiàn)在來處理點擊按鈕后的邏輯:

package test.pgl.com.customviewgroupcrosslayout;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

    private MyViewGroup myViewGroup;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        myViewGroup = (MyViewGroup) findViewById(R.id.myViewGroup);
    }

    public void Cross(View view) {
        myViewGroup.setFlag(!myViewGroup.isFlag());
    }
}

自定義控件的代碼:

package test.pgl.com.customviewgroupcrosslayout;

        import android.content.Context;
        import android.util.AttributeSet;
        import android.view.View;
        import android.view.ViewGroup;

/**
 * Created by Administrator on 2017/5/28.
 */

public class MyViewGroup extends ViewGroup {
    private boolean flag=false;

    public MyViewGroup(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    public void setFlag(boolean flag) {
        this.flag = flag;
        //重新布局 使原有的布局無效 重新執(zhí)行l(wèi)ayout階段    request 請求 要求
        requestLayout();
    }
    public boolean isFlag(){
        return flag;
    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        //遍歷所有的子view
        int left=0;
        int top=0;
        for (int i = 0; i < getChildCount(); i++) {
            //根據(jù)索引獲取到當(dāng)前的子view
            View childView = getChildAt(i);
            if(flag){
                if(i%2==0){
                    left = 0;
                }else{
                    left = getMeasuredWidth()-childView.getMeasuredWidth();
                }
            }else{
                if(i%2==0){
                    left = getMeasuredWidth()-childView.getMeasuredWidth();
                }else{
                    left = 0;
                }
            }
            //給每一個子view 擺放到一個合適的位置
            childView.layout(left,top,left+childView.getMeasuredWidth(),top+childView.getMeasuredHeight());
            //修改top實現(xiàn)每一個子view從上到下的疊放效果
            top+=childView.getMeasuredHeight();
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //主動測量所有的孩子
        measureChildren(0,0);
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

}

點擊按鈕后的設(shè)計邏輯是:
讓布局交叉:就兩種情況所以用true和false來區(qū)分:
這種布局點擊按鈕交叉無非就重新布局一次
所以:
點擊按鈕之前的布局 isFlag為false

兩種情況 兩種布局 一一對應(yīng)

Paste_Image.png

當(dāng)按鈕點擊,布局要改變就得讓flag改變
所以要setFlag

 public void setFlag(boolean flag) {
        this.flag = flag;
        //重新布局 使原有的布局無效 重新執(zhí)行l(wèi)ayout階段    request 請求 要求
        requestLayout();
    }

注意: requestLayout();必須寫上,只有前一個布局無效后才能再次布局