Saturday, November 2, 2019

Android GridLayout example

Introduction to this Android GridLayout
The layout to be introduced today is a new layout introduced after Android 4.0, which is similar to the TableLayout android (Table layout) I learned earlier, but he has many things that the former does not have, and it is more convenient.

You can set the arrangement of the components in the layout yourself.
You can customize how many rows and how many columns the grid layout has.
You can directly set the component to a column in a row.
You can set the component to span several rows or columns
In addition, in addition to the above, this section will also give you the problems you will encounter when using gridLayout in Android, and how to solve the low-level sdk how to use GridLayout method! Let's start the course in this section!
2. Use case: implementation of calculator android layout:
Running renderings:
Android GridLayout example

Implementation code:
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/GridLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:orientation="horizontal"
    android:rowCount="6" >
    <TextView
        android:layout_columnSpan="4"
        android:layout_gravity="fill"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:background="#FFCCCC"
        android:text="0"
        android:textSize="50sp" />
    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="回退" />
    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="清空" />
    <Button android:text="+" />
    <Button android:text="1" />
    <Button android:text="2" />
    <Button android:text="3" />
    <Button android:text="-" />
    <Button android:text="4" />
    <Button android:text="5" />
    <Button android:text="6" />
    <Button android:text="*" />
    <Button android:text="7" />
    <Button android:text="8" />
    <Button android:text="9" />
    <Button android:text="/" />
    <Button
        android:layout_width="wrap_content"
        android:text="." />
    <Button android:text="0" />
    <Button android:text="=" />
</GridLayout> 
Code parsing: The code is very simple, except that the fallback and clear buttons span two columns, while the others are added directly. By default, each component is in a row and a column. There is one more thing to note: We pass: android: layout_rowSpan and android:layout_columnSpan set the component across multiple rows or columns, if you want the component to fill the crossed rows or columns, you need to add the following property: android:layout_gravity = "fill"! ! ! Just like this computer shows the digital part!
3. Usage induction:
 GridLayout android uses dashed lines to divide the layout into rows, columns and cells, and also supports staggering on rows and columns. 2 Use flow:

Step 1: First define the way of the component android: orientation horizontal or vertical, how many rows and how many columns
Step 2: Set the row or column where the component is located. Remember to count from 0. Do not set the default for each component.
Step 3: Set the component to span several rows or columns; after setting, you need to set a padding: android:layout_gravity = "fill"
4. Use GridLayout to pay attention to:
Because GirdLayout was introduced after 4.0, the minSDK version should be changed to 14 or above. Otherwise, when writing the layout code, this stuff will be inexplicably wrong, saying that the GridLayout cannot be found. Of course, if you want a low version. If you are compatible, you have to look at the following!

5. How to use GridLayout for low version sdk:
The solution is simple: just import the gridlayout package of the v7 package! The v7 package is generally under sdk: sdk\extras\android\support\v7\gridlayout directory. If you don't have one, you can also download it here: gridlayout_v7_jay. Rar But when used, the label is written like this:
<android.support.v7.widget.GridLayout>

No comments:

Post a Comment