私はAndroid上にチャットクライアントを作成中ですが、クライアントにチャットバブルを設定する際に問題があります。私のチャット画面は、ListView
のテキストボックスと、下の[送信]ボタンで構成されています。送信メッセージの場合、テキストはListView
行に一列に並んでいます。受信メッセージの場合、テキストはListView
行に右揃えされます。ただし、チャットバブルは受信メッセージテキストの長さに合わせてサイズ変更されません。この問題は、左揃えの送信メッセージでは発生しません。AndroidはListViewでチャットバブルを実装しています
ここでのスクリーンショットは以下のとおりです。
Image http://i40.tinypic.com/5fgen6.png
チャットメッセージテキストは、データベースに格納され、カーソルアダプタを介してListView
で表示されます。チャットテキストの配置は、JavaソースコードMessageAdapter
でオンザフライで決定されます。両方のチャットバブルは、Androidの9つのパッチイメージを使用して行われます。以下は
が私のチャットアクティビティのレイアウトで、問題と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;
}
}
「チャットバブル」とはどういう意味ですか? – ethan
チャットバブルは、キャラクターの言葉を含む漫画本のバブルです。何人かの人々はそれをスピーチバブルと呼びます。 eBuddyのようなAndroidアプリは、あなたの友人とチャットしているときにそれを使用します。 – user1125567
あなたはこれの解決策を見つけましたか? – juned