流式布局

1、XML(主布局)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">

    <com.example.zhoukao1.weight.HeaderView
        android:id="@+id/headerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.zhoukao1.weight.HeaderView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:text="最近搜索"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:text="删除"/>
    </RelativeLayout>

    <com.example.zhoukao1.weight.FlowView
        android:id="@+id/zuijinsousuo"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.zhoukao1.weight.FlowView>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="搜索发现"/>

    <com.example.zhoukao1.weight.FlowView
        android:id="@+id/sousuofaxian"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.zhoukao1.weight.FlowView>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="常用分类"/>

    <com.example.zhoukao1.weight.FlowView
        android:id="@+id/changyongfenlei"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.zhoukao1.weight.FlowView>

</LinearLayout>

2、 FlowView 流式布局

public class FlowView extends LinearLayout {

    private int mWidth;

    public FlowView(Context context, AttributeSet attrs) {
        super(context, attrs);
        //获取屏幕的宽高
        DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        mWidth = metrics.widthPixels;
        setOrientation(VERTICAL);
    }

    public void removeChile(){
        removeAllViews();
    }

    public void setData(List<String> data){
        LinearLayout linearLayout = getLin();
        for (int i = 0; i < data.size(); i++) {
            String temp = data.get(i);
            int width=0;
            int childCount = linearLayout.getChildCount();
            for (int j = 0; j < childCount; j++) {
                TextView tv = (TextView) linearLayout.getChildAt(j);
                LayoutParams params = (LayoutParams) tv.getLayoutParams();
                int leftMargin = params.leftMargin; //设置一个左边距
                tv.measure(getMeasuredWidth(),getHeight());
                width+=tv.getMeasuredWidth()+leftMargin+tv.getPaddingLeft()+tv.getPaddingRight();
            }
            TextView tv = getText();
            LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
            params.topMargin = 10;
            params.leftMargin = 10;
            tv.setLayoutParams(params);
            tv.setText(temp);
            tv.measure(getMeasuredWidth(),getMeasuredHeight());
            int tvWidth = tv.getMeasuredWidth()+tv.getPaddingLeft()+tv.getPaddingRight();
            if(mWidth>=width+tvWidth){
                linearLayout.addView(tv);
            }else{
                linearLayout = getLin();
                linearLayout.addView(tv);
            }
        }
    }

    private LinearLayout getLin(){
        LinearLayout linearLayout = new LinearLayout(getContext());
        LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT);
        linearLayout.setLayoutParams(params);
        this.addView(linearLayout);
        return linearLayout;
    }

    private TextView getText(){
        TextView textView = new TextView(getContext());
        textView.setTextColor(Color.BLACK);
        textView.setTextSize(20);
        textView.setPadding(10,10,10,10);
        return textView;
    }
}

3、MainActivity

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private String[] data1 = {"尤尼考拉三周年人气热销榜", "电动牙刷", "尤妮佳", "豆豆鞋", "沐浴露", "日东红茶", "榴莲", "电动牙刷", "尤妮佳", "雅诗兰黛", "豆豆鞋"};
    private String[] data2 = {"基本护肤", "面部清洁", "面膜", "兰蔻", "雅诗兰黛", "资生堂", "眼部护理", "悦诗风吟", "脸部护肤"};
    private List<String> list1 = new ArrayList<>();  //最近搜索
    private List<String> list2 = new ArrayList<>();  //搜索发现
    private List<String> list3 = new ArrayList<>();  //常用分类
    private HeaderView headerView;
    private FlowView zuijinsousuo;
    private FlowView sousuofaxian;
    private FlowView changyongfenlei;

    private String name;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initData();
        initView();
    }

    private void initData() {
        for (int i = 0; i < data1.length; i++) {
            list2.add(data1[i]);
        }
        for (int i = 0; i < data2.length; i++) {
            list3.add(data2[i]);
        }
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.add:
                String name = headerView.getStr().trim();
                zuijinsousuo.removeChile();
                list1.add(name);
                zuijinsousuo.setData(list1);
                break;
        }
    }

    private void initView() {
        headerView = findViewById(R.id.headerView);
        headerView.getAdd().setOnClickListener(this);
        zuijinsousuo = findViewById(R.id.zuijinsousuo);
        sousuofaxian = findViewById(R.id.sousuofaxian);
        sousuofaxian.setData(list2);
        changyongfenlei = findViewById(R.id.changyongfenlei);
        changyongfenlei.setData(list3);
    }
}

4、XML——HeadView 自定义View

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <EditText
        android:id="@+id/search"
        android:layout_width="0dp"
        android:layout_weight="5"
        android:layout_height="wrap_content"
        android:hint="在千万海外商品中搜索"
        android:drawableLeft="@mipmap/ic_launcher"
        android:drawablePadding="10dp"/>

    <Button
        android:id="@+id/add"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="添加"/>

</LinearLayout>

4、HeadView

public class HeaderView extends LinearLayout {

    private EditText search;
    private Button add;

    public HeaderView(Context context,AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.header,this);
        search = findViewById(R.id.search);
        add  = findViewById(R.id.add);
    }

    public String getStr(){
        return search.getText().toString();
    }

    public Button getAdd(){
        return add;
    }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值