【问题标题】:Android Layout, limiting the width of a RelativeLayout childAndroid Layout,限制一个RelativeLayout子的宽度
【发布时间】:2014-02-16 17:17:10
【问题描述】:

我正在尝试为聊天页面制作一个带有气泡的 Android 平台聊天应用程序。

我通过使用LinearLayout成功为对话右侧制作气泡,并且当Message TextView有多行时,它将换行而不会将Status TextView推出屏幕。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:baselineAligned="false"
    android:gravity="right"
    android:orientation="horizontal" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="0"
        android:gravity="bottom|right"
        android:orientation="vertical"
        android:paddingLeft="5dip" >

        <TextView
            android:id="@+id/status"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/bubble_status"
            android:textColor="#5D5958"
            android:textSize="9sp" />

        <TextView
            android:id="@+id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:singleLine="true"
            android:text="@string/bubble_time"
            android:textColor="#5D5958"
            android:textSize="9sp" />
    </LinearLayout>

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_tosca"
        android:gravity="center|left"
        android:paddingLeft="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/white"
        android:textSize="15sp" />

</LinearLayout>

但是当我建立对话的左侧时,会发生不同的事情。
首先,我使用的是相同的 LinearLayout,但只是从右到左切换侧面和重力,它不起作用。
Message TextView 会将状态推送到屏幕之外。
因此,我使用 RelativeLayout 对其进行了更改。
这仅适用于短文本,因为 TextView 没有换行,但是当我在其中放入长文本时,它会换行并将状态 TextView 推出屏幕。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_odd_grey"
        android:gravity="center|left"
        android:paddingRight="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/black"
        android:textSize="15sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_alignBottom="@id/bubble"
        android:layout_toRightOf="@id/bubble"
        android:text="@string/bubble_time"
        android:textColor="#5D5958"
        android:textSize="9sp" />

</RelativeLayout>

你能帮帮我吗?

【问题讨论】:

  • 移除这个属性android:singleLine="true"
  • @kaushik 我不认为这是问题所在,我将 android:singleLine='true' 放入,所以它不会换行

标签: android android-layout chat android-relativelayout


【解决方案1】:

在与朋友讨论后,我终于找到了答案。所以这是预期的代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:gravity="left">

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/time"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_odd_grey"
        android:gravity="center|left"
        android:paddingRight="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/black"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_toLeftOf="@+id/fakeLayout"
        android:layout_alignBottom="@+id/bubble"
        android:text="@string/bubble_time"
        android:textColor="#5D5958"
        android:textSize="9sp" />

    <FrameLayout
        android:id="@+id/fakeLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:visibility="invisible" >
    </FrameLayout>

</RelativeLayout>

谢谢

【讨论】:

    【解决方案2】:

    试试这样:

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
    
        <TextView
            android:id="@+id/bubble"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@+id/bubble2"
            android:layout_alignParentTop="true"
            android:layout_margin="5dip"
            android:background="@drawable/bubble_odd_grey"
            android:gravity="center|left"
            android:paddingRight="10dip"
            android:text="@string/bubble_content"
            android:textColor="@android:color/black"
            android:textSize="15sp" />
    
        <TextView
            android:id="@+id/bubble2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:singleLine="true"
            android:layout_alignParentRight="true"
            android:layout_alignBottom="@+id/bubble"
            android:text="@string/bubble_time"
            android:textColor="#5D5958"
            android:textSize="9sp" />
    
    </RelativeLayout>
    

    这是截图:

    【讨论】:

    • 它给出了“渲染期间引发的异常:RelativeLayout 中不存在循环依赖项”我认为是因为您在 @id/bubble 中调用 @id/bubble2,反之亦然
    • 哇,你是对的.. 我认为这是因为我写的是 android:layout_toLeftOf="@id/bubble2" 而不是 "@+id/bubble2" 但这适用于长短信,但是如果它的小短信不包裹更小
    • 您是否希望右侧气泡的顶部与左侧气泡的顶部对齐?
    猜你喜欢
    • 1970-01-01
    • 2016-10-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-12-21
    • 2023-04-03
    • 2011-10-26
    相关资源
    最近更新 更多