Tip: after the article is written, the directory can be generated automatically. Please refer to the help document on the right for how to generate it

Android layout

In the Android APP project, there are several layout methods: linear layout, relative layout, flat layout, absolute layout, etc. The most used are linear layout and relative layout. Due to the serious customization of Android mobile phone resolution, there is no unified resolution standard, and the absolute layout is the least used.

1, LinearLayout

1. Format

<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"
    android:orientation="vertical"
    tools:context=".MainActivity">

	<TextView
	....
	/>
	....Controls, layouts, etc

</LinearLayout>

2. Other attributes

Arrangement
Vertical: android:orientation = "vertical"
Horizontal: android:orientation = "horizontal"

Split line properties
android:divider separates controls

The code is as follows:

<?xml version="1.0" encoding="utf-8"?>
<!-- LinearLayout Linear layout-->
<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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <!--    android:orientation="" transverse/Linear arrangement, only linear layout-->

    <!--    margin demonstration-->
    <LinearLayout
        android:id="@+id/LL_1"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#ff0000"
        android:orientation="horizontal">

        <View
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:background="#00FF00" />

        <!--        android:layout_margin="" Margin -->

    </LinearLayout>

    <!--    Weight demonstration-->
    <LinearLayout
        android:id="@+id/LL_2"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:background="#000000"
        android:orientation="horizontal">

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#ffffff" />

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#0000ff" />

    </LinearLayout>

    <!--    Centered presentation-->
    <!--    Weight demonstration-->
    <LinearLayout
        android:id="@+id/LL_3"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_marginTop="15dp"
        android:background="#000000"
        android:baselineAligned="false"
        >

        <!--        Horizontally and vertically centered-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#ffffff"
            android:gravity="center"
            >

            <!--            android:gravity="" Used for child control-->

            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#0000ff"
                />

        </LinearLayout>

        <!--        horizontally-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#0000ff"
            android:gravity="center_horizontal"
            >
            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#ffffff"
                />
        </LinearLayout>

        <!--        Vertical center-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#0000ff"
            android:gravity="center_vertical"
            >
            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#ffffff"
                />
        </LinearLayout>

    </LinearLayout>

</LinearLayout>

2, RelativeLayout

Relative layout

<RelativeLayout></RelativeLayout>

example:

<?xml version="1.0" encoding="utf-8"?>
<!-- RelativeLayout Relative layout-->
<RelativeLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <!--    android:orientation="" transverse/Linear arrangement is only available for linear layout, but not for relative layout-->

    <!--    margin demonstration-->
    <RelativeLayout
        android:id="@+id/LL_1"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#ff0000">

        <View
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:background="#00FF00" />

        <!--        android:layout_margin="" Margin -->

    </RelativeLayout>

    <!--    Weight demonstration-->
    <LinearLayout
        android:id="@+id/LL_2"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_below="@+id/LL_1"
        android:layout_marginTop="10dp"
        android:background="#000000">

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#ffffff" />

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:background="#0000ff" />

    </LinearLayout>

    <!--    Centered presentation-->
    <LinearLayout
        android:id="@+id/LL_3"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_below="@+id/LL_2"
        android:layout_marginTop="15dp"
        android:background="#000000"
        android:baselineAligned="false">

        <!--        Horizontally and vertically centered-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:background="#ffffff"
            android:layout_weight="1"
            android:gravity="center">

            <!--            android:gravity="" Used for child control-->

            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#0000ff" />

        </LinearLayout>

        <!--        horizontally-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:background="#0000ff"
            android:layout_weight="1"
            android:gravity="center_horizontal">

            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#ffffff" />
        </LinearLayout>

        <!--        Vertical center-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:background="#0000ff"
            android:layout_weight="1"
            android:gravity="center_vertical">

            <View
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_margin="0dp"
                android:background="#ffffff" />
        </LinearLayout>

    </LinearLayout>

    <!--    Alignment presentation-->
    <RelativeLayout
        android:id="@+id/LL_4"
        android:layout_width="match_parent"
        android:layout_height="210dp"
        android:layout_below="@id/LL_3"
        android:layout_marginTop="15dp"
        android:background="#000000"
        >

        <RelativeLayout
            android:id="@+id/LL_4_1"
            android:layout_width="100dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:background="#00ff00"
            >

        </RelativeLayout>

        <!--        android:layout_toRightOf Align the right boundary of the target image-->
        <RelativeLayout
            android:id="@+id/LL_4_2"
            android:layout_width="100dp"
            android:layout_height="match_parent"
            android:layout_margin="15dp"
            android:background="#00ffff"
            android:layout_toRightOf="@id/LL_4_1"
            >

        </RelativeLayout>

        <!--        android:layout_alignParentTop Align upper boundary of parent control-->
        <RelativeLayout
            android:id="@+id/LL_4_3"
            android:layout_width="100dp"
            android:layout_height="40dp"
            android:layout_margin="15dp"
            android:background="#00ffff"
            android:layout_toRightOf="@id/LL_4_2"
            android:layout_alignParentTop="true"
            >


        </RelativeLayout>

        <!--        android:layout_below Align target lower boundary-->
        <RelativeLayout
            android:id="@+id/LL_4_4"
            android:layout_width="100dp"
            android:layout_height="40dp"
            android:layout_margin="15dp"
            android:background="#00ffff"
            android:layout_below="@id/LL_4_3"
            android:layout_toRightOf="@id/LL_4_2"
            >

        </RelativeLayout>

        <!--        android:layout_alignParentBottom Align lower boundary of parent control-->
        <RelativeLayout
            android:id="@+id/LL_4_5"
            android:layout_width="100dp"
            android:layout_height="40dp"
            android:layout_margin="15dp"
            android:background="#00ffff"
            android:layout_toRightOf="@id/LL_4_2"
            android:layout_alignParentBottom="true"
            >

        </RelativeLayout>

    </RelativeLayout>

</RelativeLayout>

3, FrameLayout

This layout directly opens up a blank area on the screen. When we add controls to it, they will be placed in the upper left corner of this area by default. However, this layout method does not have any positioning method, so it does not have many application scenarios; The size of the frame layout is determined by the largest child control in the control. If the size of the control is the same, only the top component can be seen at the same time! Subsequent added controls will overwrite the previous one! Although the control will be placed in the upper left corner by default, we can also use layout_gravity attribute, specify to another location

Common properties

FrameLayout rarely has two attributes, but before we talk about it, let's introduce one thing:
Foreground image: always at the top of the frame layout, the image directly facing the user is the image that will not be covered.
Two properties:
android:foreground: * set the foreground image of the framing layout container
android:foregroundGravity: set the display position of foreground image

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/FrameLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    tools:context=".MainActivity"     
    android:foreground="@drawable/logo"    
    android:foregroundGravity="right|bottom">    
    
    <TextView    
        android:layout_width="200dp"    
        android:layout_height="200dp"    
        android:background="#FF6143" />    
    <TextView    
        android:layout_width="150dp"    
        android:layout_height="150dp"    
        android:background="#7BFE00" />    
     <TextView    
        android:layout_width="100dp"    
        android:layout_height="100dp"    
        android:background="#FFFF00" />    
        
</FrameLayout> 

4, ConstraintLayout

5, ListView

    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </ListView>

  private String data[] = {"horse","cattle","pig","rabbit","rat","dog","pig","aa","bb","cc","dd","aa","bb","cc","dd"};//False data
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ListView listView = (ListView) findViewById(R.id.listview);//Find ListView in view
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,data);//Create and configure ArrayAapeter
        listView.setAdapter(adapter);
    }

Add listening method

    listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                switch (i){
                    case 0:
                        Toast.makeText(MainActivity.this,"You clicked"+i+"Button",Toast.LENGTH_SHORT).show();
                        break;//When we click on an item, we can toast which item we ordered
 
                    case 1:
                        Toast.makeText(MainActivity.this,"You clicked"+i+"Button",Toast.LENGTH_SHORT).show();
                        break;
 
                    case 2:
                        Toast.makeText(MainActivity.this,"You clicked"+i+"Button",Toast.LENGTH_SHORT).show();
                        break;
 
                    case 3:
                        Toast.makeText(MainActivity.this,"You clicked"+i+"Button",Toast.LENGTH_SHORT).show();
                        break;
 
                    case 4:
                        Toast.makeText(MainActivity.this,"You clicked"+i+"Button",Toast.LENGTH_SHORT).show();
                        break;
                }
            }
        });

6, RecyclerView

Examples

summary

Tip: here is a summary of the article:
For example, the above is what we want to talk about today. This paper only briefly introduces the use of pandas, which provides a large number of functions and methods that enable us to process data quickly and conveniently.