我发现 BubbleCell 的iOS的xamarin应用程序，但我需要相同布局的机器人应用。我找不到任何好的教程或例如谷歌。任何人都可以请我提供的教程或链接，这样的一个例子。

I found BubbleCell an xamarin application for ios but I need the same layout for an android application. I couldn't find any good tutorial or example on google. Can anyone please provide me a tutorial or link for an example of this.

推荐答案

我HAVA还搜索显示如何使一个聊天应用程序，但coundn't找到一个Xamarin示例项目。也许你可以从像 AndroidChatBubbles

I hava also searched for a Xamarin Sample project that displays how to make a chat application, but coundn't find one. Maybe you could get help from an android java sample project like AndroidChatBubbles

下面是我自己的项目的一些布局

Here is some layouts of my own project

该活动的XML视图：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
<!-- Displays the text chat -->
    <ListView
        android:id="@+id/forms_centralfragments_chat_chat_listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_above="@+id/forms_centralfragments_chat_chat_editLayout"
        android:background="@color/list_line_seperate"
        android:clipToPadding="false"
        android:listSelector="#00000000"
        android:divider="@null"
        android:paddingBottom="@dimen/controlcenter_layout_height" />
    <LinearLayout
        android:id="@+id/forms_centralfragments_chat_chat_editLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:layout_alignParentBottom="true"
        android:stackFromBottom="true"
        android:transcriptMode="alwaysScroll"
        android:orientation="horizontal">
        <EditText
            android:id="@+id/forms_centralfragments_chat_chat_editText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:inputType="textMultiLine"
            android:layout_marginRight="10dp"
            android:paddingBottom="10dp"
            android:paddingTop="12dp"
            android:layout_weight="1"
            android:background="#FFFFFF" />
        <Button
            android:id="@+id/forms_centralfragments_chat_chat_sendButton"
            android:layout_width="70dp"
            android:layout_height="40dp"
            android:background="@drawable/button_style"
            android:text="Senden"
            android:textColor="#FFFFFF" />
    </LinearLayout>
</RelativeLayout>

泡沫的xml：

the bubble xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
 <TextView
        android:id="@+id/list_bubble_userName"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_margin="10dp"
        android:maxLines="1"
        android:singleLine="true"
        android:textColor="@color/text_color_black" />
    <TextView
        android:id="@+id/list_bubble_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxWidth="230dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:background="@drawable/bubble_green"
        android:paddingLeft="10dp"
        android:textColor="@color/text_color_black" />
</LinearLayout>

和适配器：

public class BubbleAdapter : ArrayAdapter<BubbleEntity>
    {

        /// <summary>
        /// The context of the activity
        /// </summary>
        private Activity _context;

        /// <summary>
        /// The list that holds the bubble strings
        /// </summary>
        private List<BubbleEntity> _bubbleList;

        /// <summary>
        /// Creates a new Instance of the <see cref="FloatStringAdapter"/> - Class
        /// </summary>
        /// <param name="context"></param>
        /// <param name="floatStringList"></param>
        public BubbleAdapter(Activity context, List<BubbleEntity> bubbleList)
            : base(context, Resource.Layout.list_bubble, bubbleList)
        {
              this._context = context;
              this._bubbleList = bubbleList;
        }

     public override View GetView(int position, View convertView, ViewGroup parent)
            {

                // Get our object for this position
                var item = this._bubbleList[position];
                var view = (convertView ??
                       this._context.LayoutInflater.Inflate(
                       Resource.Layout.list_bubble,
                       parent,
                       false)) as LinearLayout;

                TextView username = view.FindViewById<TextView>(Resource.Id.list_bubble_userName);
                TextView message = view.FindViewById<TextView>(Resource.Id.list_bubble_message);
                username.TextFormatted = Html.FromHtml(item.UserNameText);
                message.Text = item.Text;
                if(item.IsTheDeviceUser == false)
                {
                    view.SetGravity(GravityFlags.Left);
                    message.SetBackgroundResource(Resource.Drawable.bubble_other);     
                }
                else
                {
                    view.SetGravity(GravityFlags.Right);
                    message.SetBackgroundResource(Resource.Drawable.bubble_user);
                }

                 return view;
            }
}

注意BubbleEntity（即传输信息的数据的实体）包含一个布尔场IsDeviceUser，指示该消息来自（设备用户或者其他唠叨），因此它改变了图像和绘制的定位的泡沫。不要忘了，你应该使用9片图像的气泡，否则就会有问题，缩放。

Notice that BubbleEntity (the entity that transfers the data of a message) contains a bool field IsDeviceUser that indicates where the message comes from (the device user or the other chatter), accordingly it changes the alignment of the image and the drawable of the bubble. Do not forget that you should use 9 patch images for the bubbles, otherwise you will have problems with the scaling.