RelativeLayoutのTextViewを正しく整列する

Question

大学のコースのインスタントメッセージアプリケーションを開発しています.WithSappに似ていますが、添付のスクリーンショットのアイコンを見れば分かるはずです。

私はListFragmentにカスタムCursorAdapterを取り込みました。 2つのタイプのビュー、送信メッセージ（右揃え）、受信メッセージ（左揃え）を提供します。

送信されたメッセージのレイアウトはうまく動作しますが、受信したメッセージについても同じことを言うことはできません。ここで

はスクリーンショットです：

送信されたメッセージのレイアウト：

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

    <RelativeLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:background="#FFCCCCCC" 
     android:padding="5dp" > 

     <TextView 
      android:id="@+id/ceo_timestamp" 
      android:layout_width="60sp" 
      android:layout_height="wrap_content" 
      android:layout_alignParentLeft="true" 
      android:background="#FFBBBBBB" 
      android:gravity="center" 
      android:textSize="10sp" /> 

     <TextView 
      android:id="@+id/ceo_text" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_toRightOf="@+id/ceo_timestamp" 
      android:background="#FFAAAAAA" 
      android:gravity="right" 
      android:textSize="16sp" /> 
    </RelativeLayout> 

</RelativeLayout> 

受信したメッセージのレイアウト：

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

    <RelativeLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:background="#FF999999" 
     android:padding="5dp" > 

     <TextView 
      android:id="@+id/cei_timestamp" 
      android:layout_width="60sp" 
      android:layout_height="wrap_content" 
      android:layout_alignParentRight="true" 
      android:background="#FF888888" 
      android:gravity="center" 
      android:textSize="10sp" /> 

     <TextView 
      android:id="@+id/cei_text" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_toLeftOf="@+id/cei_timestamp" 
      android:background="#FF777777" 
      android:gravity="right" 
      android:textSize="16sp" /> 
    </RelativeLayout> 

</RelativeLayout> 

これらの醜い背景色がちょうど見に追加されます各ビューとレイアウトに必要なスペース。あなたがスクリーンショットで見ることができるように、メッセージの送信（右揃え）は素晴らしい仕事です。受信したメッセージ（左詰め）はうまく整列していません。なぜなら、RelativeLayoutはコンテンツをラップするだけで、すべての水平スペースを利用できるからです。

誰でもどのように修正するか、または私が必要なものを達成するためのより良いレイアウト設計を知っていますか？

ありがとうございます。

Answer 1

送信メッセージのレイアウトでは、アンドロイド：layout_alignParentRight = "true"のパラメータをandroid：layout_alignParentLeft = "true"に置き換えます。

Answer 2

RelativeLayoutの子がalignParentRightの場合、その幅はmatch_parentに自動的に変更されます。 TextView cei_timestampのandroid:layout_alignParentRight="true"親の幅をwrap_contentからmatch_parentにサイレントに変更します。

1. は両方が60dpのような特定の幅を使用し、wrap_contentを使用していないRelativeLayout

   <?xml version="1.0" encoding="utf-8"?> 
   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"> 
   
       <LinearLayout 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentLeft="true" 
        android:background="#FF999999" 
        android:padding="5dp" > 
   
        <TextView 
         android:id="@+id/cei_text" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:background="#FF777777" 
         android:gravity="right" 
         android:textSize="16sp" /> 
   
        <TextView 
         android:id="@+id/cei_timestamp" 
         android:layout_width="60sp" 
         android:layout_height="wrap_content" 
         android:background="#FF888888" 
         android:gravity="center" 
         android:textSize="10sp" /> 
   
       </LinearLayout> 
   
   </RelativeLayout> 
   

   
   

2. を使用しないでください：
   Uは、修正するために2つの方法があります。

Answer 3

私はそれが遅いと知っていますが、同じ問題の解決策を探している人のために投稿しています。 受信したメッセージを左に揃えるには、受信したメッセージのxmlの2番目のTextViewからこの行を削除します。

android:layout_toLeftOf="@+id/cei_timestamp" 

私は簡単な例で試してみました。ここ はコードや画面は、すべての物語のスクリーンショットの

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    tools:context="com.example.android.myapplication1.MainActivity"> 
<RelativeLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="#FF4081"> 

    <TextView 
     android:id="@+id/textView" 
     android:layout_width="60sp" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:gravity="center" 
     android:text="Hello" 
     android:textSize="23sp" /> 


    <TextView 
     android:id="@+id/textView2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_toLeftOf="@+id/textView" 
     android:gravity="right" 
     android:text="New Text" 
     android:textColor="#FFF" 
     android:textSize="23sp" /> 
</RelativeLayout> 

<Button 
    android:id="@+id/button2" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout centerHorizontal="true" 
    android:layout marginTop = "104dp" 
    android:text="New Button" /></RelativeLayout>`