Question

我必须创建一个棘手的布局，如下图所示。 enter image description here

每个方格都是ImageView。无论屏幕尺寸或分辨率布局如何，包含＆＃34; 1,2,3,4和5＆＃34;按宽度填充父级并保持配置，如上图所示（＆＃34; 4＆＃34;应位于＆＃34; 1＆＃34;＆＃34; 2＆＃34;，＆＃34; 5＆＃34;在＆＃34; 2＆＃34;和＆＃34; 3＆＃34;）之下和之间。

我尝试使用两种线性布局，其中包含＆＃34; weight＆＃34;指定，尝试使用＆＃34;网格布局＆＃34;，甚至＆＃34;表格布局＆＃34;但没有运气 - 即使我得到正确的初始配置，它也不会保留在不同的屏幕尺寸上。

你可以帮我解决这个问题吗？如何实现像图片一样的布局？

Answer 1

我做了什么。步骤1,2,3,4,5,6,7和8是非常基本的，如果你知道该做什么就可以跳过它们（只是打开你的应用程序文件，并使布局看起来就像你做的那样简单可能的。）

第1步： 打开Eclipse。

第2步： 打开你的申请（在包浏览器中，展开您的应用）

第3步： 双击src，包名称，然后双击Java文件。（默认情况下，它将被称为mainActivityJava，或者你命名的任何东西）这会打开你的java文件，你应该看到你的java文件，让它保持打开状态。

第4步： 返回包浏览器，双击res，layout，然后双击您的布局名称。（默认情况下它应该是main_activity.xml）你现在应该打开你的布局和java文件，你可以通过点击那些名称在它们之间导航，你可以将它们看作彼此的标签。

第5步： 打开您的XML文件，如果您查看右上角，您将看到布局中的所有内容。删除除顶部布局之外的所有内容。（通过右键单击它们，然后单击“删除”。）

第6步： 然后右键单击顶部的布局，然后单击更改布局，然后选择相对布局并单击确定。（如果已经是相对布局，请跳过此步骤。）

第7步： 在图形布局屏幕的左侧，打开图像和媒体，然后将图像视图拖放到您希望的位置。还要注意，在拖放图像视图后，您可以通过右键单击来更改大小。然后单击宽度并输入您想要的数字，并在数字类型dp（它与数字之间没有空格）后猜测和测试是获得正确大小的最简单方法。更改高度的方式与更改宽度的方式相同，但不是单击宽度单击高度。

第8步： 现在我知道你现在可能和以前完全一样，但那很好。

第9步： 转到您的包浏览器并右键单击您的布局文件夹（而不是XML文件）然后单击“复制”

第10步： 右键单击您的res文件夹，然后单击粘贴

第11步： 弹出一个盒子不要只是点击确定。将写入更改为布局 - 小然后点击确定。

第12步： 打开名为layout-small的新创建的文件夹，您应该看到与原始XML布局完全相同的XML布局文件。打开新的XML布局文件。

第13步： 屏幕尺寸应该看起来像一个小屏幕（如果不是更改屏幕大小并单击一个小屏幕。）布局看起来应该搞砸了。

第14步： 再次执行步骤5,6和7（或者如果有更好的方法创建布局使用该方法）也不要更改屏幕尺寸使布局看起来很好在该屏幕尺寸。现在，基于该设备的系统将决定使用哪种布局。

此外，如果您想为大屏幕和超大屏幕制作布局，只需再次执行步骤9,10,11,12,13和14，而不是在步骤11中键入layout-small并确保您进行每个布局适当的屏幕尺寸大到16＆＃34;平板电脑默认为标准手机，如nexus 5或4，小巧的小手机，超大型平板电脑。

适用于大型布局 - 大型   对于超大型布局-xlarge
  中等是默认布局

另外要知道这可以用于多个布局，比如你在两个布局之间切换，你会在每个文件夹中有两个布局，如果你只有默认布局文件夹中的布局，它看起来和它一样，但是当你切换屏幕尺寸时，它会全部搞砸。

查看此主题的一个很好的链接：

http://developer.android.com/guide/practices/screens_support.html

Answer 2

试试这个布局文件。它几乎和你想要的一样。

<?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">


<TextView
    android:text="RED"
    android:id="@+id/TextView01"
    android:layout_height="wrap_content"
    android:background="#f00"
    android:gravity="center"
    android:textColor="#000"
    android:layout_width="wrap_content"
    android:padding="25dp"></TextView>




<TextView
    android:text="ORANGE"
    android:layout_height="wrap_content"
    android:background="#ffa500"
    android:gravity="center"
    android:textColor="#000"
    android:id="@+id/TextView02"
    android:layout_width="wrap_content"
    android:layout_centerHorizontal="true"
    android:padding="25dp"></TextView>




<TextView
    android:text="YELLOW"
    android:layout_height="wrap_content"
    android:background="#ffff00"
    android:gravity="center"
    android:textColor="#000"
    android:id="@+id/TextView03"
    android:layout_width="wrap_content"
    android:layout_alignParentRight="true"
    android:padding="25dp"></TextView>



<TextView
    android:text="GREEN"
    android:layout_height="wrap_content"
    android:background="#0f0"
    android:gravity="center"
    android:textColor="#000"
    android:id="@+id/TextView04"
    android:layout_width="wrap_content"
    android:layout_toLeftOf="@+id/TextView05"
    android:padding="25dp"
    android:layout_centerVertical="true"></TextView>



<TextView
    android:text="BLUE"
    android:layout_height="wrap_content"
    android:background="#00f"
    android:gravity="center"
    android:textColor="#fff"
    android:id="@+id/TextView05"
    android:layout_width="wrap_content"
    android:layout_centerInParent="true"
    android:layout_margin="10dp"
    android:padding="25dp"></TextView>




<TextView
    android:text="INDIGO"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:textColor="#fff"
    android:id="@+id/TextView06"
    android:layout_width="wrap_content"
    android:layout_toRightOf="@+id/TextView05"
    android:background="#4b0082"
    android:padding="25dp"
    android:layout_centerVertical="true"></TextView>



<TextView
    android:text="VIOLET"
    android:layout_height="wrap_content"
    android:background="#ee82ee"
    android:gravity="center"
    android:textColor="#000"
    android:id="@+id/TextView07"
    android:layout_alignParentBottom="true"
    android:layout_width="fill_parent"
    android:padding="25dp"></TextView>

</RelativeLayout>

参考：code.tutplus.com

Answer 3

试试这个布局。这可能不是一个完美的解决方案，但我希望你能得到一个想法：）

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <ImageView
            android:id="@+id/imageView5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>

</LinearLayout>

Android表格式布局建议

3 个答案: