自定義佈局子流佈局實現標籤功能

在這裏我先簡單的對我自己在寫自定義佈局之流佈局的一個總結
1.流佈局我個人認爲就是當前子View的寬度大於當前行剩餘寬度時當前子View就自動換到下一行進行顯示
所以在寫該功能最大的挑戰就是算出什麼時候當前子View需要進行換行
2.在寫該佈局的時候一定要對當前佈局和子View進行測量不然我們會獲取不到當前子View和佈局的寬度和高度
3.因爲是初學者可能有些地方不規範請各位大神指導

這裏我直接貼出代碼 自定義View類的代碼

public class FlowLayout extends ViewGroup {
    private static final String TAG ="test" ;
    //子Viwe之間的間隔
    private int childSpace;
    //用戶設置子View的高度
    private int userSetChildHight;
    public FlowLayout(Context context) {
        this(context, null);
    }

    public FlowLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public FlowLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.FlowLayout);
        //自定義屬性獲取每個孩子之間的寬度
        childSpace =typedArray.getDimensionPixelSize(R.styleable.FlowLayout_childSpace,10);
        //每個孩子的寬度
        userSetChildHight = typedArray.getDimensionPixelSize(R.styleable.FlowLayout_childHight,35);
    }

    /**
     * 進行添加view
     * @param view
     */
    public void addView(List<View> view){
        for (View v:view) {
            //使用該方法將自己的子view添加到ViewGroup中如果沒有佈局將是空白
            this.addView(v,new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
        }
    }
    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        //子View的行數
        int row =1;
        int left =0;
        int right =0;
        int top =0;
        int bottom =0;
        int paddingLeft = getPaddingLeft();
        int paddingTop = getPaddingTop();
        int lastWidth =0;
        int width =getWidth();
        for(int i =0;i<getChildCount();i++) {
            //獲取除過當前子View前面所有子View的寬度
            if (i != 0) {
                lastWidth += getChildAt(i - 1).getWidth();
            } else {
                lastWidth = 0;
            }
            View view = getChildAt(i);
            //進行判斷是否需要換行
            // 換行條件判斷當前子View的寬度是否小於或者等於最大寬度減去獲取除過當前子View前面所有子View的寬度再減去所有子View之間的距離
            if (view.getMeasuredWidth() <= width - lastWidth - childSpace * (i)) {
                left = paddingLeft + right + childSpace;
                right = left+view.getMeasuredWidth()+childSpace;
                top = paddingTop * row + userSetChildHight * (row - 1);
                bottom = top + userSetChildHight;
                view.layout(left, top, right, bottom);
            } else {
                row++;
                right = 0;
                left = paddingLeft + right + childSpace;
                right =left+view.getMeasuredWidth()+childSpace;
                top = paddingTop * row + userSetChildHight * (row - 1);
                bottom = top + userSetChildHight;
                view.layout(left, top, right, bottom);
            }
            Log.d(TAG,view.getMeasuredWidth()+"width"+width+"lastWidth"+lastWidth+"childSpace * (i - 1)"+childSpace * (i - 1));
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
    {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        // 獲得它的父容器爲它設置的測量模式和大小
        int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
        int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
        int modeWidth = MeasureSpec.getMode(widthMeasureSpec);
        int modeHeight = MeasureSpec.getMode(heightMeasureSpec);

        // 如果是warp_content情況下，記錄寬和高
        int width = 0;
        int height = 0;

        int cCount = getChildCount();

        // 遍歷每個子元素測量子View的寬和高是非常重要的不然在onLayout中view.getMeasuredWidth()會一直爲0
        for (int i = 0; i < cCount; i++)
        {
            View child = getChildAt(i);
            // 測量每一個child的寬和高
            measureChild(child, widthMeasureSpec, heightMeasureSpec);

        }
        setMeasuredDimension((modeWidth == MeasureSpec.EXACTLY) ? sizeWidth
                : width, (modeHeight == MeasureSpec.EXACTLY) ? sizeHeight
                : height);

  }
}

佈局中使用

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.as.myapplication.MainActivity">

    <com.example.as.myapplication.FlowLayout
        android:id="@+id/myView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:childHight="35dp"
        app:childWidth="150dp"
        app:childSpace="10dp"
        android:padding="20dp"
       /> 
</RelativeLayout>

這裏xmlns:app=”http://schemas.android.com/apk/res-auto”該代碼是進行使用自己自定義屬性的

自定義屬性
路徑res/values/文件名.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="FlowLayout">
        <attr name="childSpace" format="dimension"/>
        <attr name="childWidth" format="dimension"/>
        <attr name="childHight" format="dimension"/>
    </declare-styleable>
</resources>

這裏dimension表示尺寸
activity中的使用

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        FlowLayout myview = (FlowLayout) findViewById(R.id.myView);

        List<View> textView  =new ArrayList<>();
        TextView textView1 = new TextView(this);
        textView1.setText("aaaaaa000a1");
        textView.add(textView1);
        TextView textView2 = new TextView(this);
        textView2.setText("aaaaa00aa2");
        textView.add(textView2);
        TextView textView3 = new TextView(this);
        textView3.setText("aaaaaa0000000000a3");
        textView.add(textView3);
        TextView textView4 = new TextView(this);
        textView4.setText("aaa00000000000000000000000000000000aaaa4");
        textView.add(textView4);
        TextView textView5 = new TextView(this);
        textView5.setText("aaaa0000000000000000000aaa5");
        textView.add(textView5);


        myview.addView(textView);
    }

在Activity中就是手動穿件幾個TextVIew然後通過我們自定義View類中的addVIew進行添加View addView中需要一個List泛型爲VIew的集合

這裏我的自定義View就算完了 這裏也會有一些問題如Merage屬性不支持後續會加上