Android GridLayout, places its children in a rectangular grid. At first glance it may seem like a TableLayout but it is much more convenient and functional. Android GridLayout was introduced with Android os 4.0 (Api level 14) and layout_columnWeight and layout_rowWeight etc. was introduced in api level 21.
We can consider Android LinearLayout as an special case of GridLayout. An Android gridLayout with columnCount equal to 1, will behave like a LinearLayout with vertical orientation and Android GridLayout with rowCount equals to 1 will behave like a LinearLayout with horizontal orientation.
In Android GridLayout, one child can be placed in a cell like Android TableLayout. In TableLayout, only column span is available, while in Android GridLayout both row and column span are available. In GridLayout, we can add a view by specifying row and column index which is not possible in Android TableLayout.
If minimum sdk version of our app is less than 14 and we want to use GridLayout, then we should use support library.
The min sdk of this sample is 8, so I used v7 support library. To use gridlayout support library add compile "com.android.support:gridlayout-v7:24.1.0" in dependency section of build.gradle. After this change, build.gradle will look like...
Click on "Sync project with Gradle files" toolbar icon to sync the dependencies.
|android:alignmentMode||When set to alignMargins, causes alignment to take place between the outer boundary of a view, as defined by its margins.|
|android:columnCount||The maxmimum number of columns to create when automatically positioning children.|
|android:columnOrderPreserved||When set to true, forces column boundaries to appear in the same order as column indices.|
|android:orientation||The orientation property is not used during layout.|
|android:rowCount||The maxmimum number of rows to create when automatically positioning children.|
|android:rowOrderPreserved||When set to true, forces row boundaries to appear in the same order as row indices.|
|android:useDefaultMargins||When set to true, tells GridLayout to use default margins when none are specified in a view's layout|
Let's move on to our demo. Result of this sample is represented in the screenshow below. When user click on any image, I am showing full size image in a dialog.
Note: Please don't be confuse with screenshot and layout xml. I wanted to column span and row span properties in the screenshot thats why scrolled 1 row up.
Step 1: Create a new project in Android Studio and name it Android Grid Layout.
Step 2: Open res -> layout -> activity_main.xml and add following code
Step 3: To add round corner border in ImageView, I am using round_shape.xml. Create a xml file inside res -> drawable and named it round_shape.xml. Add below given code in your round_shape.xml
Step 4: Now, open your MainActivity.java and place below given code.
Step 5: Now clean and run your program to see the result.
I tried to demonstrate all commonly used features of gridLayout, hopefully, you have enjoyed it. Thanks.