TextView宽度超过了LinearLayout宽度。

Question

我在布局中遇到一个奇怪的问题：

<?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="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="15dp">
    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:background="#ff3333"
        android:layout_weight="0.2"
        />
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_weight="0.8">
        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#ff134415"
            android:layout_weight="1"
            />
        <View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="3dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="5dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#ff8833"
            android:paddingRight="10dp"
            android:paddingLeft="15dp"
            android:paddingTop="5dp"
            android:paddingBottom="5dp"
            android:text="this is a longgggggggggggggggggggggggg text"
            />
    </LinearLayout>
</LinearLayout>

当TextView中的文本过长时，一部分超出了LinearLayout的宽度。我做错了什么？

- Mbt925

---

请解释一下您希望它看起来是什么样子，我不太清楚。 - ci_

它应该换到第二行。 - Mbt925

你尝试过使用 android:maxLines 吗？ - ci_

@ci_ 我没有看到maxLines与我的问题有关系。 - Mbt925

你需要在嵌套的线性布局中按照给定的视图宽度进行设置，还是可以使用任意随机值？ - Prashant

@prashant 是的。我认为它们的宽度不会有任何影响。 - Mbt925

Answer 1

问题的原因在于，在您的80%布局中，并非所有子元素都指定了权重，而有些没有指定权重的子元素具有首选大小，这使得所有子元素的总和大于父元素所能提供的大小。

在这种情况下，layout_weight的工作方式是：让每个人都占用他需要的空间，我会占用剩余的空间，最多不超过我的父元素允许的空间。问题在于，在这种情况下，没有剩余空间（或者如果我这么说是负数）。我不太理解布局算法的详细内容，但我认为具有权重!=0的布局将推动其后的所有布局-因此，您示例中较大的TextView会超出屏幕。

为了验证我的假设，我构建了一个更简单的布局，只有两个TextView：第一个宽度为0，权重为1，文本较短；第二个宽度为wrap，文本较长-基本上是您示例中80％布局的第一个和最后一个视图。看一下，可以发现同样的事情发生了。只要在第二个TextView上加上权重，它就会停止，因为现在布局算法基于所有子元素的权重进行计算。

<?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="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="15dp">
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#008833"
        android:paddingRight="10dp"
        android:paddingLeft="15dp"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        android:text="short text"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ff8833"
        android:paddingRight="10dp"
        android:paddingLeft="15dp"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        android:text="this is an even longgggggggggggggggggggggggggggggeeerrrr text" />
</LinearLayout>

我猜这个案例教训是：除非绝对保证布局所需的空间小于父容器的尺寸，否则不要仅在某些子视图上使用权重。

一开始看起来似乎只是一个简单的布局问题，但是我从中学到了很多……我只能希望我现在已经弄对了 :-)

- N.T.

---

这没有意义。我们不知道第二个TextView需要多少空间，因此我们无法为其指定权重。而且，布局管理器有责任防止第二个TextView超出屏幕范围。 - Mbt925

我真的无法与您争论 :-) 我只是解释了我发现的事情以及我认为事情发生的原因。现在，您可能想要覆盖LinearLayout或寻找替代方案 - 例如为第二个（在您的示例中最后一个）布局指定maxWidth。 - N.T.

Answer 2

添加另一个LinearLayout来填充文本视图的剩余部分，然后原始的LinearLayout负责填充绿色视图的剩余部分。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="15dp">
    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:background="#ff3333"
        android:layout_weight="0.2"
        />
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_weight="0.8">
        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#ff134415"
            android:layout_weight="1"
            />
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <View
                android:layout_width="2dp"
                android:layout_height="match_parent"
                android:background="#ff8833"
                android:layout_marginRight="2dp"
                />
            <View
                android:layout_width="3dp"
                android:layout_height="match_parent"
                android:background="#ff8833"
                android:layout_marginRight="2dp"
                />
            <View
                android:layout_width="5dp"
                android:layout_height="match_parent"
                android:background="#ff8833"
                android:layout_marginRight="2dp"
                />
            <View
                android:layout_width="10dp"
                android:layout_height="match_parent"
                android:background="#ff8833"
                android:layout_marginRight="2dp"
                />
            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#ff8833"
                android:paddingRight="10dp"
                android:paddingLeft="15dp"
                android:paddingTop="5dp"
                android:paddingBottom="5dp"
                android:text="this is a longgggggggggggggggggggggggg text"
                />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

- tachyonflux

---

你能解释一下这两段代码的区别吗？为什么我的代码不起作用，而你的却可以？！？！ - Mbt925

@Mbt925，你原来的代码中 wrap_content 作为宽度，所以子项认为它可以占据父项减去自身内边距后的同样宽度。 - tachyonflux

@karaokyo 谢谢，但是我的代码中的奇怪问题还没有解决。 - Mbt925

Answer 3

给TextView设置权重，以使TextView的宽度相同。

还要设置以下两个属性：

    android:singleLine="true"
    android:ellipsize="end"


   <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="#ff8833"
        android:layout_weight="1"
        android:paddingRight="10dp"
        android:paddingLeft="15dp"
        android:singleLine="true"
        android:ellipsize="end"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        android:text="this is a longgggggggggggggggggggggggg text"
        />

- Saritha G

---

这不是一个单行的文本视图。 - Mbt925

如果您想查看完整的内容，那就必须为TextView添加onClick事件，然后在对话框中显示完整的文本或者显示一些Toast提示。 - Saritha G

Answer 4

你需要从LinearLayout和View中移除0dp的宽度。使用weight参数，像这样：

    <?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="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="15dp">
    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ff3333"
        android:layout_weight="1"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_weight="1">
        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#ff134415"
            android:layout_weight="1"
            />
        <View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="3dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="5dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />
        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#ff8833"
            android:layout_marginRight="2dp"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#ff8833"
            android:paddingRight="40dp"
            android:paddingLeft="15dp"
            android:paddingTop="5dp"
            android:paddingBottom="5dp"
            android:text="this is a longgggggggggggggggggggggggg text"
            />
    </LinearLayout>
</LinearLayout>

你可以在文本视图中添加很多填充（例如30-40dp），以避免文字溢出。

- br00

---

为了让重量参数起作用，宽度必须为零。你的代码和我的代码有同样的问题。 - Mbt925

在您的TextView中添加大量填充（例如30-40dp），以避免文本溢出。 - br00

不，我不想剪切文本。我需要多行文本。 - Mbt925

谢谢你的提示，但我正在寻找我的代码中的问题，而不是在进行黑客攻击！ - Mbt925