增加流式布局

在这里插入图片描述
activity 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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <EditText
            android:id="@+id/edit_keys"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>

        <Button
            android:id="@+id/btn_search"
            android:layout_width="80dp"
            android:layout_height="50dp"
            android:text="搜索"/>

    </LinearLayout>

    <com.example.addstreaming.addFlow
        android:id="@+id/flow_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:text="apple"
            android:textSize="20sp" />
    </com.example.addstreaming.addFlow>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onClick"
        android:text="清除历史记录"/>

</LinearLayout>

mian java界面

public class MainActivity extends AppCompatActivity implements View.OnClickListener{
    private EditText mEdit;
    private Button mSearch;
    private addFlow mFlowLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mEdit = findViewById(R.id.edit_keys);
        mSearch = findViewById(R.id.btn_search);
        mFlowLayout = findViewById(R.id.flow_layout);
        mSearch.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        if (v.getId()==R.id.btn_search) {
            String keys = mEdit.getText().toString();
            mFlowLayout.addTextView(keys);
        }else{
            mFlowLayout.removeAllViews();
        }
    }
}

中间要加的字

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:textSize="20sp"
    android:textColor="@color/colorPrimaryDark"
    android:background="@drawable/car_btn_bg">

自定义view界面

public class addFlow extends FrameLayout{
    private final static int H_DISTANCE = 20;//水平间距是20
    private final static int V_DISTANCE = 20;//竖直间距是20
    public addFlow(@NonNull Context context) {
        super(context);
    }

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

    public addFlow(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    public void addTextView(String keys){

        //*******加载xml布局的方式********
        TextView textView = (TextView) View.inflate(getContext(), R.layout.flow_item,null);
        //*******加载xml布局的方式********
        textView.setText(keys);

        //布局宽高自适应
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        textView.setLayoutParams(params);//控件设置上布局参数

        addView(textView);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        int width = getWidth();//获取本控件的宽度,用于计算换行
        int row = 0;//行数

        int disWidth = H_DISTANCE;//子控件左边的坐标

        for (int i = 0; i <getChildCount() ; i++) {

            View view = getChildAt(i);//查找子控件

            int viewWidth = view.getWidth();
            int viewHeight = view.getHeight();
            Log.i("dt","textHeight:"+viewHeight);

            if (disWidth+viewWidth>width){//接下来的控件的右边坐标超过了屏幕宽度
                row++;//行数增加
                disWidth = H_DISTANCE;//还原左边坐标
            }

            //第一个参数是左边坐标,第二个参数是上边坐标
            //左坐标应该是每行子控件宽度的总和disWidth
            //右坐标为左坐标+子控件宽度
            //上坐标应该是行数*控件高度
            //下坐标是上坐标+控件高度=(行数+1)*控件高度
            int viewTop =row*viewHeight+row*V_DISTANCE;
            view.layout(disWidth,viewTop,
                    disWidth+viewWidth,viewTop+viewHeight);//子控件布局

            disWidth+=(viewWidth+H_DISTANCE);//记录下一次子控件左边的坐标

        }
    }
}

猜你喜欢

转载自blog.csdn.net/qq_42828101/article/details/84651687