针对正常屏幕尺寸的Android布局设计

Question

我是一个最懒的应用程序开发人员，我感觉我对android基本知识有很好的把握，但我最关心的是应用程序设计。我了解如何开发不同的屏幕尺寸和密度。但我最大的焦点是正常尺寸和其他尺寸，它们涵盖了各自尺寸范围内的尺寸范围。我一直在搜索和搜索，而不是打包找到解决方案。

我遇到的主要问题是使用eclipse进行设计时，我在设计中使用nexus进行设计，当我换到像3.2 HVGA或甚至nexus galaxy这样的小屏幕时，正常大小的图像，我的图像的位置已移动。因此，对于其他正常屏幕尺寸来说，看起来完美的连接看上去很糟糕。

可以做些什么来确保图像是否与另一个图像直接相邻，以保持图像在不同屏幕上的显示。我将举一个我正在设计的当前设计的例子，我希望有人能够解释我做错了什么/我该如何改进。

Nexus One的设计：

3.2 HVGA：

the xml generated: 
<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/RelativeLayout1" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:columnCount="4" 
    android:orientation="vertical" > 

    <Button 
     android:id="@+id/Button1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:background="@drawable/i1" 
     android:text="Button" /> 

    <Button 
     android:id="@+id/button1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentTop="true" 
     android:background="@drawable/i2" /> 

    <Button 
     android:id="@+id/button2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignLeft="@+id/Button1" 
     android:layout_alignTop="@+id/Button1" 
     android:layout_marginLeft="106dp" 
     android:layout_marginTop="160dp" 
     android:background="@drawable/i3" /> 

    <Button 
     android:id="@+id/button3" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignBaseline="@+id/button2" 
     android:layout_alignBottom="@+id/button2" 
     android:layout_alignRight="@+id/Button1" 
     android:layout_marginRight="112dp" 
     android:background="@drawable/i4" /> 

    <Button 
     android:id="@+id/button4" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/button3" 
     android:layout_alignLeft="@+id/button3" 
     android:background="@drawable/i5" /> 

</RelativeLayout> 

Answer 1

尝试增加另一个布局侧按钮将它们分组在一起，然后居中该布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:id="@+id/RelativeLayout1" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:columnCount="4" 
       android:orientation="vertical" 
       android:layout_alignParentTop="true" 
       android:layout_alignParentLeft="true" 
       android:layout_alignParentStart="true"> 

    <Button 
     android:id="@+id/Button1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:background="@drawable/i1" 
     android:text="Button" /> 

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        android:id="@+id/RelativeLayout2" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerInParent="true"> 

     <Button 
      android:id="@+id/button1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentRight="false" 
      android:layout_alignParentTop="true" 
      android:background="@drawable/i2" 
      android:layout_alignParentLeft="true"/> 

     <Button 
      android:id="@+id/button2" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/i3" 
      android:layout_below="@+id/button1" 
      android:layout_alignParentLeft="true"/> 

     <Button 
      android:id="@+id/button3" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/i4" 
      android:layout_below="@+id/button4" 
      android:layout_toRightOf="@+id/button2"/> 

     <Button 
      android:id="@+id/button4" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/i5" 
      android:layout_toRightOf="@+id/button2" 
      android:layout_alignParentTop="true"/> 
    </RelativeLayout> 
</RelativeLayout> 

Answer 2

您需要为每个屏幕分辨率的创建不同的图像，并把它们放到相应的drawable文件夹drawable--hdpi,drawable-mdpi,drawable-xhdpi等。另外请确保您在您的xml文件中使用了dp。只要确保你总是这样做。

为不同屏幕设计可能会很棘手，因为您必须创建相同的图像4次或5次。

此外，请确保您正在测试实际的手机，因为模拟器并不总是给你一个准确的布局。