(Android Control) interface layout for GridView (grid effect)

1Effects to be achieved:

To meet the business needs, you need to achieve the mesh effect. Specifically, the screen is divided into two rows, with one picture centered in the middle.

Additional requirements: when considering the interface design, mobile phone screens with different resolutions cannot be laid out in a fixed position.

 

Implementation interface:

 

2Magic control property: layout_weight

Layout_weightAttribute

Attribute meaning: Set the space allocated to the control. The default value is 0, and the control remains unchanged. If the property is greater than 0, the remaining controls on the screen are allocated to the control.

 

3Solution:

[General implementation method]

Set a horizontal layout, place controls, and set the interval between controls. However, for screens of different sizes, do multiple sets of interfaces.

 

[Solution of this article]

Set a horizontal layout, add several linear la s to the layout, set the property layout_weight = 1 in a unified manner, center, and place the required controls in the linear layout.Layout_weightThis attribute allows linear layout to be classified and ensures that the required controls are not out of shape.

 

 

4Practical implementation code:

 

   <LinearLayout
android:id="@+id/linearLayout1"
            android:layout_width="fill_parent"
            android:orientation="horizontal"
            android:layout_marginTop="15dp"
            android:layout_height="wrap_content" >

<LinearLayout
android:id="@+id/linearLayout_n1"
                    android:layout_width="fill_parent"
                    android:orientation="horizontal"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:layout_height="wrap_content" >
<ImageView
android:id="@+id/img_1"
                         android:adjustViewBounds="true"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
                         android:padding="4dp"
                         android:focusable="true"
                        android:clickable="true"
                         android:tag="1"
                         android:background="@drawable/imgselect"
                         android:src="@drawable/sl1_1" />
</LinearLayout>
<LinearLayout
android:id="@+id/linearLayout_n2"
                    android:layout_width="fill_parent"
                    android:layout_weight="1"
                    android:orientation="horizontal"

                    android:gravity="center"
                    android:layout_height="wrap_content" >
<ImageView
android:id="@+id/img_2"
                         android:adjustViewBounds="true"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
                         android:padding="4dp"
                         android:tag="2"
                         android:focusable="true"
                        android:clickable="true"
                         android:background="@drawable/imgselect"
                         android:src="@drawable/sl1_2" />
</LinearLayout>
</LinearLayout>