布局聊天气泡的问题：TextView的所有填充屏幕 [英] Layout chat bubbles issues: TextView fills all the screen

问题描述

我正在泡聊天。我用两个布局，一个用于传入消息，另一个是我的消息的适配器。适配器运作良好。我的问题是与输入的布局，没有得到很好展现传入的时间文本。当消息文本增长，填满屏幕的整个宽度，而且它隐藏的消息时间的文本。

I'm working on bubble chat. I use a adapter with two layouts, one for incoming messages and other for my messages. The adapter is working well. My problems are with the incoming layout, don't get show well the incoming time text. When the message text grows, fills the entire width of the screen, and it hidden the text of the message time.

第一个问题：如何才能做到这一点。

First question: How can achieve this?

这是收到的消息布局：

<?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="fill_parent"
    android:orientation="horizontal"
    android:animateLayoutChanges="true"
    android:gravity="left">

    <TextView
        android:id="@+id/message_text_server"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5sp"
        android:background="@drawable/speech_bubble_orange"
        android:shadowColor="@color/textShadow"
        android:shadowDx="1"
        android:shadowDy="1"
        android:text="Medium Text"
        android:textColor="@color/textColor"
        android:textSize="20sp" />

    <RelativeLayout
        android:id="@+id/message_server"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="left"
        android:layout_gravity="left" >

        <TextView
            android:id="@+id/sended_server"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="9dp"
            android:layout_marginTop="10sp"
            android:text="Enviado"
            android:textSize="10sp"
            android:visibility="gone" />        

        <TextView
            android:id="@+id/time_server"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="18dp"
            android:layout_marginTop="23dp"
            android:text="23:48"
            android:textSize="10sp" />
    </RelativeLayout>

</LinearLayout>

第二个问题
我的消息的布局是相同的，但改变元素的位置和运作良好。为什么呢？

Second Question The layout of my messages is the same but changing the elements's position and are working well. Why?

这是问题的一个形象：

修改

我需要一个橙子气泡具有相同行为的green's当我只有在泡沫和相同的行为一个单词时，泡满的话（见绿色气泡）

I need that the oranges bubbles to have the same behaviour that the green´s when i have only a word in the bubble and the same behaviour when the bubble is full of words (see green bubbles)

推荐答案

设置 layout_weight 属性（集的android：layout_weight =1你的 message_text_server 的TextView 对象）来告诉父容器，你怎么想分配的可用空间，以它的孩子。

Set layout_weight attribute (set android:layout_weight="1" on your message_text_server TextView object in both bubble layouts) to tell parent container how you want it to distribute available space to its children.

在结果（除了我的风格剥离）你会得到你想要什么：

In result (aside from styles I stripped) you would get exactly what you want:

请参阅的文档或检查顶部答​​案的在这个问题，以了解更多关于 layout_weight 和使用它。

See the docs or check top answers in this question to find out more about layout_weight and use of it.

修改

您必须做一些错误的，因为父容器和服务器的文字和日期TextView的字段宽度设置为 match_parent 和服务器的文字 layout_width 应该是真的足以得到两个bubles。

You must do something wrong as setting parent container and server text and date textview fields width to match_parent and server text layout_width should be really sufficient to get that for both bubles.

编辑2

您（AB）使用margin和padding在你的布局。

You (ab)using margin and padding in your layout.

我需要一个橙子泡有行为相同
  green's当我在泡沫和相同的行为只有一个词
  当泡沫是满语（见绿色气泡）

I need that the oranges bubbles to have the same behaviour that the green´s when i have only a word in the bubble and the same behaviour when the bubble is full of words (see green bubbles)

您只需要使用 layout_width 和 layout_gravity 的 server_text TextView的。在这里，适当的布局镜头：

You just need to play with layout_width and layout_gravity of the server_text TextView. Here the proper layout shot:

和然后它背后的布局。不填充/保证金需要。刚重力和娱乐宽度高度和宽度加<​​code>重量。只是它的样式，你以后要和你回家：

and then the layout behind it. No padding/margin needed. Just gravity and play width height and width plus weight. Just style it as you want later and you're home:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:animateLayoutChanges="true"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left">
        <TextView
            android:id="@+id/TextView02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5sp"
            android:layout_weight="1"
            android:text="Foo bar foo foo foo"
            android:textSize="20sp" />
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="left"
                android:text="Enviado"
                android:textSize="10sp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="left"
                android:text="23:48"
                android:textSize="10sp" />
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:text="Enviado"
                android:textSize="10sp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:text="23:48"
                android:textSize="10sp" />
        </LinearLayout>
        <TextView
            android:id="@+id/TextView01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5sp"
            android:layout_weight="1"
            android:text="Foo bar foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo"
            android:textSize="20sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left">
        <TextView
            android:id="@+id/TextView02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5sp"
            android:layout_weight="1"
            android:text="Foo bar foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo"
            android:textSize="20sp" />
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="left"
                android:text="Enviado"
                android:textSize="10sp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="left"
                android:text="23:48"
                android:textSize="10sp" />
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:text="Enviado"
                android:textSize="10sp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:text="23:48"
                android:textSize="10sp" />
        </LinearLayout>
        <TextView
            android:id="@+id/TextView01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5sp"
            android:layout_weight="1"
            android:text="Foo bar foo foo"
            android:textSize="20sp" />
    </LinearLayout>

</LinearLayout>

基本上没有填充/保证金需要的。

Basically no padding/margin needed.

这篇关于布局聊天气泡的问题：TextView的所有填充屏幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！