1. 程式人生 > >簡單易懂的瀑布流

簡單易懂的瀑布流

最原始簡單易懂的瀑布流的佈局方式

<?xml version="1.0" encoding="utf-8"?>


<com.example.app_work_three.TitleCustomView
android:id="@+id/title"
android:layout_width=“match_parent”
android:layout_height=“wrap_content”/>

<com.example.app_work_three.TextViewCustomView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="搜尋歷史"
    />
<com.example.app_work_three.OnSizeCustomView
    android:id="@+id/fl_search"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"/>
<com.example.app_work_three.TextViewCustomView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="熱門搜尋"
    />
<com.example.app_work_three.OnSizeCustomView
    android:id="@+id/fl_hot"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"/>
## 自定義View搜尋框 包括一些獲取輸出狂的值 進行往Activity傳值 用到的介面回撥 package com.example.app_work_three;

import android.content.Context;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.EditText;
import android.widget.LinearLayout;

import com.example.app_work.R;

public class TitleCustomView extends LinearLayout {

private Context context;

public TitleCustomView(Context context) {
    super(context);
    this.context = context;
    initData();
}

public TitleCustomView(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
    this.context = context;
    initData();
}

private void initData() {
    //首先要拿到首頁面的自定義View輸入框和圖片
    View view = View.inflate(context, R.layout.three_title,null);
    final EditText editText = view.findViewById(R.id.edit_text);
    view.findViewById(R.id.title_serach).setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View v) {
            if(mButtonLenstener!=null)
            {
                mButtonLenstener.onButtonClick(editText.getText().toString());
            }
        }
    });
    addView(view);
}

//第三不 設定成員變數

ButtonLenstener mButtonLenstener;

//第四步  並且給成員賦值
public void setOnBuutonClickListener(ButtonLenstener buttonLenstener){
    mButtonLenstener = buttonLenstener;
}
//第一步
public interface ButtonLenstener{
    //第二部步 寫一個方法和引數
    void onButtonClick(String str);
}

}

設定螢幕的寬高大小 來判斷我們歷史記錄的長度

package com.example.app_work_three;

import android.content.Context;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.LinearLayout;

public class OnSizeCustomView extends LinearLayout {

//元素中最高的一個
private int mChildMaxHeight;

//左間距 和右間距
private int mHspace = 20;
private int mVspace = 20;


public OnSizeCustomView(Context context) {
    super(context);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    //拿到父視窗寬高的度數
    int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
    int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);

    //測量孩子的大小
    measureChildren(widthMeasureSpec,heightMeasureSpec);
    //便利迴圈每個資源的找到最高的一個
    findMaxSzieHeight();
    //初始化值
    int left = 0,top = 0;

    //迴圈所有的子佈局
    int childCount = getChildCount();
    for(int i = 0;i<childCount;i++)
    {
        View childAt = getChildAt(i);
        //是否為一行的開頭
        if(left!=0)
        {
            //需要換行 因為放不下
            if((left+childAt.getMeasuredWidth())>sizeWidth)
            {
                //計算出下一行的top
                top+=mChildMaxHeight+mVspace;
                left = 0;
            }
        }
        left+=childAt.getMeasuredWidth()+mHspace;
    }
    setMeasuredDimension(sizeWidth,(top+mChildMaxHeight)>sizeHeight?sizeHeight:top+mChildMaxHeight);
}

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
    super.onLayout(changed, l, t, r, b);

    //開始安排子元素的位置

    int top = 0,left = 0;
    int childCount = getChildCount();
    for(int i=0;i<childCount;i++)
    {
        View childAt = getChildAt(i);
        if(left!=0)
        {
            //需要換行
            if((left+childAt.getMeasuredWidth())>getWidth())
            {
                top+=mChildMaxHeight+mVspace;
                left = 0;
            }
        }
        //安排孩子的位置
        childAt.layout(left,top,left+childAt.getMeasuredWidth(),top+mChildMaxHeight);
        left+=childAt.getMeasuredWidth()+mHspace;
    }
}

private void findMaxSzieHeight() {
    mChildMaxHeight = 0;
    int childCount = getChildCount();
    for(int i = 0;i<childCount;i++)
    {
        View childAt = getChildAt(i);
        if(childAt.getMeasuredHeight()>mChildMaxHeight)
        {
            mChildMaxHeight=childAt.getMeasuredHeight();
        }
    }
}

public OnSizeCustomView(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
}

}

佈局使用xml來調理不同的樣式

package com.example.app_work_three;

import android.annotation.SuppressLint;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.widget.TextView;

import com.example.app_work.R;

@SuppressLint(“AppCompatCustomView”)
public class TextViewCustomView extends TextView {

public TextViewCustomView(Context context) {
    super(context);
}

public TextViewCustomView(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);


    TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.WeekFlowLayout);
    int color = typedArray.getColor(R.styleable.WeekFlowLayout_textColor, Color.BLACK);

    setTextColor(color);

    typedArray.recycle();
}

}

Activity操作package com.example.app_work_three;

import android.graphics.Color;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

import com.example.app_work.R;

import java.util.UUID;

public class MainAtivity extends AppCompatActivity {

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.three_activity);

    final OnSizeCustomView fl_search = findViewById(R.id.fl_search);
    OnSizeCustomView fl_hot = findViewById(R.id.fl_hot);

    TitleCustomView title = findViewById(R.id.title);

    title.setOnBuutonClickListener(new TitleCustomView.ButtonLenstener() {
        @Override
        public void onButtonClick(String str) {
            final UUID uuid = UUID.randomUUID();
            TextView textView = new TextView(MainAtivity.this);
            textView.setTag(uuid);
            textView.setTextColor(Color.RED);
            textView.setText(str);
            textView.setBackgroundResource(R.drawable.edit_bg);
            fl_search.addView(textView);

            textView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    String uuid = String.valueOf(v.getTag());
                    Toast.makeText(MainAtivity.this,uuid,Toast.LENGTH_LONG).show();
                }
            });
        }
    });

    for(int i = 0;i<30;i++)
    {
        TextView textView = new TextView(MainAtivity.this);
        textView.setText("資料"+i);
        textView.setTextColor(Color.RED);
        textView.setBackgroundResource(R.drawable.edit_bg);
        fl_hot.addView(textView);
    }
}

}