Android Untold Stories --- Selector and GridView

     Selector in Android is one of problems confusing developers. The reason is that it is very hard for developers to control attributes of selector, for ListView and GridView in particular. The paddings of selector, for instance, are very confusing. If you use Android's resources, such as android.R.drawable.gallery_thumb and set it as selector of GridView, the paddings are 16px(in WVGA). These paddings will be adding around the view in GridView but inside the selector, which means the selector will be stretched to contain your view and the paddings. But, if you put the same resources in your own package's resource folder /drawable/my_selector.xml, the images used in selector are the same. Set it as selector for GridView, the paddings are 0 and, what's worse, the selector won't be stretched to contain your view, which means the selector stays in its own size and might be smaller than your view. This is rather wierd and I wish the upcoming SDK release can fix such an issue.

     In addition to the difference between Android's resources and developer defined, such paddings of selector are unable to change for developers. Sometimes, our layout is a little bigger which almost reaches screen's edges. In such condition, after adding selector(Android's resource), the selector will stretch out of screen. This huants many developers a lot. It haunts me for a great while at least.

    To control the paddings, there are two ways:

1, also is the simpliest one, that is re-design the image resources to exactly fit your view. But this will limit the compatbility which will cause nightmare when maintaining.

2. Another way is implement desired GridView by yourself which enables you open interface to control these paddings when setting selectors. Note: simply inherit GridView or ListView and override method setSelector is not enough, because the fields controlling paddings inside AbsListView are package access control, which prevents classes in other packages including child classes. One referencable example is GridViewSpecial in Andorid's Gallery, which inherits View drectly and implement all it needs by itself.

3. Third way is use shape instead of images to implement desired selector, which enables you to control everything. Let's take a look at an example first:

<?xml version="1.0" encoding="utf-8" ?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_window_focused="false"> <shape> <stroke android:width="2dip" android:color="#dcdcdc" /> <solid android:color="000000"/> <padding android:left="10dip" android:top="10dip" android:right="10dip" android:bottom="10dip" /> </shape> </item> </selector>

This is a simple selector. For this selector, you can control everything: stroke width, strok color , most important the paddings. There are many other attributes of shape such as gradient, corner enabling you to create more impressive selectors.

    Although you can control the selector in more ideally way, it still causes troubles. The selector set to GridView, however, will affect your layout, even if you have set the vertical spacings and horizontal spacings. This needs you should adjust layout after setting selectors. So, implement your own GridView might be the best solution which is much easier to maintain, costly at first much easily after first pain, though.