2012-01-02 3 views
12

Я нахожусь в процессе написания чата на Android, но у меня возникают некоторые проблемы с помещением чата в мой клиент. Экран моего чата состоит из ListView с текстовым полем и кнопкой отправки внизу. Для исходящего сообщения тексты выравниваются влево в строке ListView. Для входящего сообщения тексты выравниваются по правому краю в строке ListView. Тем не менее, чат-пузырь не изменяется на длину текста входящих сообщений. Эта проблема не возникает для выровненного слева исходящего сообщения.Android Реализация чата Bubble в ListView

Здесь снимок экрана ниже.

Image http://i40.tinypic.com/5fgen6.png

чат тексты сообщений хранятся в базе данных и отображаются в ListView через адаптер курсора. Выравнивание текстов чата определяется на лету в исходном коде Java в MessageAdapter. Оба чата-пузыря сделаны с использованием девяти патч-изображений Android.

Ниже мое расположение чата активность, ListView с вопросом является messageHistoryList:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:padding="10dip" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 

    <ListView 
     android:id="@+id/messageHistoryList" 
     android:layout_width="wrap_content" 
     android:layout_height="0px" 
     android:layout_weight="1"/> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" > 

     <EditText 
     android:id="@+id/message" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:gravity="top" 
     android:layout_weight="1"/> 

     <Button 
      android:id="@+id/sendMessageButton" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_weight="4" 
      android:text="Send"/> 

    </LinearLayout> 

</LinearLayout> 

ListView строки раскладка:

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

    <RelativeLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/userAndMessage"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/textUser" 
      android:textStyle="bold" 
      android:textColor="@color/blue"/> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/textMessage" 
      android:textColor="@color/blue" 
      android:textStyle="bold"/> 

    </RelativeLayout> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/textTime" 
     android:textColor="@color/blue"/> 

</RelativeLayout> 

адаптер Сообщение:

public class MessageAdapter extends SimpleCursorAdapter { 

    static final String[] FROM = { ChatHistoryManager.C_TIME }; 
    static final int[] TO = { R.id.textTime }; 

    static final int MESSAGE_INCOMING_DIR = 1; 

    private String incomingMessageUserName; 
    private String selfUserName; 

    public MessageAdapter(Context context, Cursor cursor) { 
     super(context, R.layout.message_list_item, cursor, FROM, TO); 
    } 

    @Override 
    public void bindView(View row, Context context, Cursor cursor) { 
     super.bindView(row, context, cursor); 

     int messageDir = cursor.getInt(cursor.getColumnIndex(ChatHistoryManager.C_DIR)); 
     if(messageDir == MESSAGE_INCOMING_DIR) { 

      RelativeLayout.LayoutParams userNameAndChatMessageParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      userNameAndChatMessageParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, RelativeLayout.TRUE); 

      RelativeLayout.LayoutParams userNameParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      userNameParams.addRule(RelativeLayout.LEFT_OF, R.id.textMessage); 

      RelativeLayout.LayoutParams chatMessageParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      chatMessageParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, R.id.textUser); 

      RelativeLayout.LayoutParams timeParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      timeParams.addRule(RelativeLayout.ALIGN_RIGHT, R.id.userAndMessage); 
      timeParams.addRule(RelativeLayout.BELOW, R.id.userAndMessage); 

      row.setBackgroundResource(R.color.grey); 

      // Set the chat message 
      String chatMessage = cursor.getString(cursor.getColumnIndex(ChatHistoryManager.C_TEXT)); 
      TextView textMessage = (TextView) row.findViewById(R.id.textMessage); 
      textMessage.setText(chatMessage.trim()); 
      textMessage.setLayoutParams(chatMessageParams); 

      // Format the time stamp of the message 
      long timestamp = cursor.getLong(cursor.getColumnIndex(ChatHistoryManager.C_TIME)); 
      TextView textTime = (TextView) row.findViewById(R.id.textTime); 
      String readableTimeStamp = (String) DateUtils.getRelativeTimeSpanString(timestamp); 
      textTime.setText(readableTimeStamp.trim()); 
      textTime.setLayoutParams(timeParams); 

      // Format the message owner and the message 
      TextView textUser = (TextView) row.findViewById(R.id.textUser); 
      textUser.setText(incomingMessageUserName + ": "); 
      textUser.setLayoutParams(userNameParams); 
      row.setBackgroundResource(R.drawable.incoming_chat_bubble); 
     } 
     else { 
      RelativeLayout.LayoutParams userNameAndChatMessageParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      userNameAndChatMessageParams.addRule(RelativeLayout.RIGHT_OF, R.id.userImage); 

      RelativeLayout.LayoutParams userImageParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      userImageParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, RelativeLayout.TRUE); 

      RelativeLayout.LayoutParams userNameParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      userNameParams.addRule(RelativeLayout.ALIGN_LEFT, R.id.userAndMessage); 

      RelativeLayout.LayoutParams chatMessageParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      chatMessageParams.addRule(RelativeLayout.RIGHT_OF, R.id.textUser); 

      RelativeLayout.LayoutParams timeParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT); 
      timeParams.addRule(RelativeLayout.ALIGN_LEFT, R.id.userAndMessage); 
      timeParams.addRule(RelativeLayout.BELOW, R.id.userAndMessage); 

      // Set the chat message 
      String chatMessage = cursor.getString(cursor.getColumnIndex(ChatHistoryManager.C_TEXT)); 
      TextView textMessage = (TextView) row.findViewById(R.id.textMessage); 
      textMessage.setText(chatMessage); 
      textMessage.setLayoutParams(chatMessageParams); 

      // Format the time stamp of the message 
      long timestamp = cursor.getLong(cursor.getColumnIndex(ChatHistoryManager.C_TIME)); 
      TextView textTime = (TextView) row.findViewById(R.id.textTime); 
      textTime.setText(DateUtils.getRelativeTimeSpanString(timestamp)); 
      textTime.setLayoutParams(timeParams); 

      // Format the message owner and the message 
      TextView textUser = (TextView) row.findViewById(R.id.textUser); 
      textUser.setText(selfUserName + ": "); 
      textUser.setLayoutParams(userNameParams); 
      row.setBackgroundResource(R.drawable.outgoing_chat_bubble); 
     } 
    } 

    public void setIncomingMessageUserName(String inputUserName) { 
     this.incomingMessageUserName = inputUserName; 
    } 

    public void setSelfUserName(String inputUserName) { 
     this.selfUserName = inputUserName; 
    } 
} 
+0

Что вы подразумеваете под «chat bubble»? – ethan

+0

Чат-пузырь пузырь в комиксе, который содержит слова персонажа. Некоторые люди называют это речевым пузырем. Android-приложение, например, eBuddy использует его, когда вы общаетесь со своим другом. – user1125567

+0

Вы нашли решение этого? – juned

ответ

5

использование LinearLayout вместо Относительная компоновка. Это решит вашу проблему. У меня была такая же проблема. Я решил это с помощью LinearLayout

Смежные вопросы