具有非9补丁按钮的可扩展应用程序大小

Question

我目前正在学习android开发，在我陷入一个大项目之前，我决定我需要学习如何让一个应用程序可以从尽可能多的设备上访问。

所以我有一个使用RelativeLayout的测试应用程序。顶层活动上有6个大的菜单按钮。这些按钮是正方形的图形图像(不是9补丁按钮，据我所知，它们在图形上过于原始)。在我用来测试的设备上，这些按钮以2x3的完美排列出现，如下所示：

​

​

但是，当我尝试在更大的设备上运行此应用程序时，按钮将如下所示：

​

​

有没有一种方法可以根据屏幕的大小缩放非9补丁按钮，使它们始终像第一张图像一样显示？这是推荐的吗？如果没有，有没有其他方法可以为不同的屏幕尺寸做这样的布局？

我的理想布局应该是可以跨不同设备扩展的，如下所示：

​

​

Answer 1

我正在使用类似的菜单。这是它的第一行。此菜单中的按钮也有标签。

        <LinearLayout
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dip"
                    android:layout_marginRight="20dip"
                    android:gravity="center" >

                    <RelativeLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dip" >

                        <Button
                            android:id="@+id/screen_home_btn_profile"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@drawable/selector_ic_my_profile" />

                        <LinearLayout
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentBottom="true"
                            android:layout_centerHorizontal="true"
                            android:paddingBottom="5dip" >

                            <TextView
                                style="@style/label_text_style_home_screen"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/screen_home_label_my" />

                            <TextView
                                style="@style/label_text_style_home_screen"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/screen_home_label_profile"
                                android:textStyle="bold" />
                        </LinearLayout>
                    </RelativeLayout>

                    <RelativeLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="5dip" >

                        <Button
                            android:id="@+id/screen_home_btn_application"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@drawable/selector_ic_my_application" />

                        <LinearLayout
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentBottom="true"
                            android:layout_centerHorizontal="true"
                            android:paddingBottom="5dip" >

                            <TextView
                                style="@style/label_text_style_home_screen"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/screen_home_label_my" />

                            <TextView
                                style="@style/label_text_style_home_screen"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/screen_home_label_application"
                                android:textStyle="bold" />
                        </LinearLayout>
                    </RelativeLayout>
                </LinearLayout>

看起来你给按钮增加了外边距。将它们居中对齐，并在两个按钮之间留出空格，而不是屏幕边框和按钮。