2012-01-02 13 views
12

Sono in procinto di scrivere un client di chat su Android ma sto riscontrando alcuni problemi con la creazione di una bolla di chat nel mio client. La schermata della mia chat è composta da un ListView con una casella di testo e un pulsante Invia in basso. Per un messaggio in uscita, i testi vengono allineati a sinistra nella riga ListView. Per un messaggio in arrivo, i testi sono allineati a destra nella riga ListView. Tuttavia, il fumetto della chat non viene ridimensionato in base alla lunghezza dei messaggi dei messaggi in entrata. Questo problema non si verifica per il messaggio in uscita allineato a sinistra.Bolla di chat per l'implementazione di Android in ListView

Qui la schermata è sotto.

testi di segnalazione

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

la chat sono memorizzati in un database e vengono visualizzati nella ListView tramite un adattatore cursore. L'allineamento dei testi della chat è determinato al volo nel codice sorgente Java in MessageAdapter. Entrambe le chat sono fatte usando nove immagini patch di Android.

Qui di seguito è il mio layout di attività di chat, il ListView con problema è 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 layout di fila:

<?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> 

adattatore Messaggio:

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

cosa intendi per "chat bubble"? – ethan

+0

La bolla di chat è una bolla nel fumetto che contiene le parole del personaggio. Alcuni lo chiamano fumetto. L'app per Android come eBuddy la usa quando chatti con il tuo amico. – user1125567

+0

hai trovato la soluzione? – juned

risposta

5

uso LinearLayout invece di Layout relativo. Risolverà il tuo problema. Ho avuto lo stesso problema. L'ho risolto usando LinearLayout