CHAPTER 8: Android UI Design: Using Advanced ViewGroup Layout Containers 273Since your RelativeLayout design clearly used four rows and two columns to hold the EditText and
Button UI widgets, the rowCount GridLayout engine parameter (GridLayout engine configuration
attribute or data value) would be set to “ 4 ,” and the columnCount parameter (attribute) would be
set to a data value of “ 2 .” Do this using the following XML markup, which you can see inside of the
android:id="@+id/gridLayout" android:rowCount="4" android:columnCount="2"
Figure 8-5. Add the android:id, android:rowCount and android:columnCount parameters to the parent GridLayout
Notice that I’m leaving the background image plate and the white textColor and textColorHint
settings (parameters) to maintain the visuals of this UI design, and to show how to easily change a
UI design while the graphic design elements remain unchanged, simply by changing a parent tag
along with a few of its configuration parameters.
If you add the android:rowCount="4" parameter first, and then click the Graphical Layout Editor tab,
you will not see any change in your GridLayout, which means you will see what is shown in
Figure 8-4. This is because the default columnCount parameter for the GridLayout engine is one,
and you have not specified any row and column layout parameters inside of the child UI widgets,
which we are going to do a bit later on in this chapter.
Once you add in the android:columnCount="2" parameter, you will see the UI grid rendering results
which are shown in Figure 8-6. As you can see, the GridLayout engine is getting amazingly close
to the optimal UI design by using only two of the global (parent tag) GridLayout configuration
parameters (these are listed in Table 8-2).