Most efficient way to implement Dashboard UI pattern?

Question

I want to do the Dashboard pattern. I currently do this for each home button:

<FrameLayout
    android:layout_weight="1"
    android:focusable="true"
    android:onClick="onHomeButtonClicked"
    android:background="@drawable/button_background">
    <TextView
        android:text="@string/button_text"
        android:drawableTop="@drawable/button_icon"
        android:layout_gravity="center"
        android:gravity="center"
        android:background="@android:color/transparent" />
</FrameLayout>

The reason I wrap my button inside a FrameLayout is I want to:

Maximize the clickable area
Make the icon and text properly centered.

I tried doing this in the past but gave up because I couldn't figure out a screensize-independent way of centering the text and icon:

<Button
    android:layout_weight="1"
    android:background="@drawable/button_background"
    android:text="@string/button_text"
    android:onClick="onHomeButtonClicked"
    android:drawableTop="@drawable/button_icon"
    android:drawablePadding="DONT_KNOW_WHAT_TO_PUT_IN_HERE" />

My question: Is it possible to do all these:

Not wrap the Button inside other layout (using only 1 view per button)
Maximize the clickable area
Properly center the icon and text in a screensize-independent way

Many thanks.

After checking the link you provided, is there a reason not to go with GridView for creating Dashboard pattern? Or is it how you're populating these layouts to display anyway? — harism, May 07 '11 at 09:17
Is it possible to declare the content of `GridView` in the XML layout, or I have to populate them in Java? — Phil, May 07 '11 at 18:32

score 0 · Answer 1 · answered May 08 '11 at 07:27

Here's some code that I use to build a dashboard programmatically:

@Override public View getView(int position, View convertView,
        ViewGroup parent) {
    TextView v = (TextView) convertView;
    if (v == null) {
        v = new TextView(DashboardActivity.this);
        v.setGravity(Gravity.CENTER);
    }
    v.setCompoundDrawablesWithIntrinsicBounds(0,
        mIcons[position].drawableId, 0, 0);
    v.setText(mIcons[position].labelId);

    return v;
}

You could instead use android:drawableTop in an XML file if you could build the dashboard beforehand.

Most efficient way to implement Dashboard UI pattern?

1 Answers1