了解 Android 线性布局答案

【问题标题】：Understanding Android Linear Layouts了解 Android 线性布局
【发布时间】：2015-12-11 02:21:36
【问题描述】：

在对线性布局以及如何使用线性布局完成定位任务进行大量搜索后，我发现了很多问题，流行的答案是“使用相对布局”。

我想深入了解线性布局，但很难找到一个解释来解决我认为应该很简单的任务。一个有意义的解决方案似乎也是合理的。

如果我将屏幕视为井字棋盘并想在每个位置放置一个按钮，我该如何在不依赖前一个按钮的宽度进行堆叠或边距的情况下做到这一点。

例如，如果我想跳过广场上的某个位置，我跳过的位置将保持空白。

{1} {2} {3}
{4} {5} {6}
{7} {8} {9}

根据我阅读的 XML，我的按钮应该位于 1 3 5 7 9 但这不是那个结果。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:id="@+id/myLayout" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/Button1"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top|left"
            android:text="@string/btn1" />

        <Button
            android:id="@+id/Button2"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:text="@string/btn2" />
</LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <Button
            android:id="@+id/Button3"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/btn3" />

</LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/Button4"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|left"
            android:text="@string/btn4" />

        <Button
            android:id="@+id/Button5"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:text="@string/btn5" />
    </LinearLayout>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/background"
        android:background="@drawable/background"/>

</LinearLayout>

我的结果是，

{1} {2} { }
{ } {5} { }
{7} {8} { }

我差一点就成功了！（我认为...）

将 2 和 8 向右移动一个空格我缺少什么？我没有按照指示使用线性布局吗？

这是我的目标。

{1} { } {2}
{ } { } { }
{ } { } { }
{ } {3} { }
{ } { } { }
{ } { } { }
{4} { } {5}

【问题讨论】：

如果你有这么多水平和垂直视图，为什么不使用RelativeLayout 或FrameLayout 而不是LinearLayout？
因为我正在努力学习如何使用线性布局。
这种布局会对性能产生影响，因为计算每个布局的屏幕密度需要时间，而且数量很多。最好尝试不同的方法学习LinearLayouts。
我不是在尝试构建企业应用程序。我试图了解线性布局如何深入工作。我不相信我在互联网上找到的关于线性布局的每个问题的解决方案都是“使用相对布局”。我只是想学习控制它们，所以当我制作企业应用程序并且需要线性布局时，我将能够正确使用它。

标签： android xml android-layout android-linearlayout

【解决方案1】：

您没有得到直接答案的真正原因是 LinearLayout 不是做您想做的事情的好方法。

由于您的目标是了解 LinearLayout 而不是真正实现最终结果，因此我将评论一些我已经注意到的事情。

这里的一个关键点是layout_gravity 的使用。它不会做你想做的事。在 LinearLayout 中，layout_gravity 一次只能在一个方向上工作。在水平 LinearLayout 中，layout_gravity 仅影响元素垂直的位置，而在垂直 LinearLayout 中，layout_gravity 仅影响元素水平位置。所以你不能做一个水平的LinearLayout，在里面放两个按钮，然后用layout_gravity让一个在左边，另一个在右边。

在 LinearLayout 中，子项始终按照它们在 xml 布局中的输入顺序一个接一个地放置（从左到右或从上到下）。那么如何创造差距呢？

我想到了两种主要方式：

您可以使用layout_margin。这定义了在特定元素（如按钮）之外留出的空间量。因此，如果您希望按钮 1 和按钮 2 之间有 100dp 的间隙，您可以在按钮 1 上添加 android:layout_marginRight="100dp"，或者您可以在按钮 1 的右侧添加 50dp，在按钮 2 的左侧添加 50dp。

另一种方法是包含一个宽度为 100dp 的空白视图以留出该空间。这是您的布局修改以在实践中显示这两种方法：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/myLayout" >

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/Button1"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="@string/btn1" 
        android:layout_marginRight="100dp"/>

    <Button
        android:id="@+id/Button2"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="@string/btn2" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >
    <View
        android:layout_width="100dp"
        android:layout_height="0dp"/>
    <Button
        android:id="@+id/Button3"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="@string/btn3" />

</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/Button4"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="@string/btn4" />
    <View
        android:layout_width="100dp"
        android:layout_height="0dp"/>

    <Button
        android:id="@+id/Button5"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="@string/btn5" />
</LinearLayout>

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/background"
    android:background="@drawable/background"/>

</LinearLayout>

最后是 ImageView。没有特别提到，所以我可能对此有误，但由于可绘制名称是背景，我猜测这些按钮可能是有意显示在 ImageView 前面的。如果是这样，那么值得一提的是，LinearLayouts 中的子级不会重叠。该 ImageView 将始终位于带有按钮的布局之后。如果您确实想要按钮后面的背景，您可以通过将 android:background="@drawable/background" 添加到父 LinearLayout 的开始标记（尽管它可能被拉伸）来为父 LinearLayout 本身添加背景，或者您可以使用不同类型的布局确实允许重叠。

【讨论】：

非常感谢您回答我的问题。是的，当我复制代码时，我不小心把背景留在了代码中，但我很高兴你的解释让答案变得更好。

【解决方案2】：

对于井字游戏，您需要为每个按钮保留空间，但文本将包含 X 或 O 或空格。这将解决任何格式问题。

我不清楚你的目标是什么。

您是否尝试在 X x X 网格中进行井字游戏？如果是这样，我的上述观点仍然适用。

【讨论】：

请在我的问题底部查看我的目标示例。我希望能够在线性布局上定位按钮右上角左上中心中心左下右下

【解决方案3】：

如您所知，您可以使用水平和垂直线性布局。此外，您可以应用布局权重以使布局具有相同大小以覆盖全屏。对于这种情况，您可以使用 3 个具有全高和相同重量的垂直线性布局来覆盖屏幕。然后你可以根据你想要的数字用相同重量的全宽按钮填充它们的内部。

【讨论】：

【解决方案4】：

试试这个：

它是 xml：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:layout_width="@dimen/btnwidth"
            android:layout_height="wrap_content"
            android:text="{1}"
            android:layout_weight="1"
            android:id="@+id/b1" />

        <Button
            android:layout_width="@dimen/btnwidth"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/b2"
            android:visibility="invisible"/>

        <Button
            android:layout_width="@dimen/btnwidth"
            android:layout_height="wrap_content"
            android:text="{2}"
            android:layout_weight="1"
            android:id="@+id/b3" />

    </LinearLayout>
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/b4"
        android:visibility="invisible"/>

    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b5" />

    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b6" />

</LinearLayout><LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b7" />

<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b8" />

<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b9" />
</LinearLayout><LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b10" />
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="{3}"
    android:id="@+id/b11" />
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b12" />   </LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b13" />
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:clickable="false"
    android:visibility="invisible"
    android:id="@+id/b14" />
<Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:visibility="invisible"
    android:id="@+id/b15" /></LinearLayout>
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b16" />
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b17" />
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b18" />
</LinearLayout>
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="{4}"
        android:id="@+id/b19" />
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:visibility="invisible"
        android:id="@+id/b20" />
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="{5}"
        android:id="@+id/b21" /> </LinearLayout></LinearLayout>

对于：

对于它的xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:layout_width="@dimen/btnwidth"
            android:layout_height="wrap_content"
            android:text="{1}"
            android:layout_weight="1"
            android:id="@+id/b1" />
       <android.support.v4.widget.Space
           android:layout_width="@dimen/btnwidth"
           android:layout_height="wrap_content" />

        <Button
            android:layout_width="@dimen/btnwidth"
            android:layout_height="wrap_content"
            android:text="{2}"
            android:layout_weight="1"
            android:id="@+id/b3" />
    </LinearLayout>  <LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
  <android.support.v4.widget.Space
      android:layout_width="@dimen/btnwidth"
      android:layout_height="wrap_content" />
  <Button
    android:layout_width="@dimen/btnwidth"
    android:layout_height="wrap_content"
    android:text="{3}"
    android:id="@+id/b11" />
  <android.support.v4.widget.Space
      android:layout_width="@dimen/btnwidth"
      android:layout_height="wrap_content" />  </LinearLayout>
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="{4}"
        android:id="@+id/b19" />
    <android.support.v4.widget.Space
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content" />
    <Button
        android:layout_width="@dimen/btnwidth"
        android:layout_height="wrap_content"
        android:text="{5}"
        android:id="@+id/b21" />
</LinearLayout>

第 1 次和第 2 次的黑白差异是：首先，我们使用不可见的按钮.. 在第二我们使用空间...... 在第一个我们不能为整行使用空间（意味着所有 3 个按钮不能被空格替换..如果我们这样做，那么它将在页面末尾以空白 spce 堆叠..它不会在 b/w 中放置空间两行。

【讨论】：