实现仪表板 UI 模式的最有效方法？答案

【问题标题】：Most efficient way to implement Dashboard UI pattern?实现仪表板 UI 模式的最有效方法？
【发布时间】：2011-08-20 15:57:12
【问题描述】：

我想做Dashboard pattern。我目前为每个主页按钮执行此操作：

<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>

我将按钮包装在 FrameLayout 中的原因是我想要：

最大化可点击区域
正确制作图标和文本居中。

我过去曾尝试过这样做，但后来放弃了，因为我想不出一种与屏幕尺寸无关的方式来使文本和图标居中：

<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" />

我的问题：是否有可能做到所有这些：

不将 Button 包裹在其他内部布局（每个仅使用 1 个视图按钮）
最大化可点击区域
将图标和文本正确居中一种与屏幕尺寸无关的方式

非常感谢。

【问题讨论】：

检查您提供的链接后，是否有理由不使用 GridView 来创建仪表板模式？还是您如何填充这些布局以显示？
是否可以在 XML 布局中声明 GridView 的内容，或者我必须用 Java 填充它们？

标签： android design-patterns dashboard ui-design ui-patterns

【解决方案1】：

以下是我用来以编程方式构建仪表板的一些代码：

@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;
}

如果您可以预先构建仪表板，则可以在 XML 文件中使用 android:drawableTop。

【讨论】：