C# MVVMCross：创建消息气泡列表视图样式

我想创建一个类似listview的气泡式对话

例如，以Facebook的messenger为例

我的问题是：如何为每条消息（发送和接收）创建一个mvxitemplate

发送邮件时，我希望使用我的项目_sendedmessage.xml 但当我收到消息时，它是我的项目_receivedmessage.xml

我不知道如何使用转换的（比如Xamarin表单）

我的消息实体

public class MessageEntity
{
     public string Message { get; set; }
     public bool IsSended { get; set; }
}

和我的列表（RecyclerView）

当my messageEntity.IsSend=true时，我希望使用红色的右侧itemTemplate，当它为false时，使用蓝色和左侧

谢谢

编辑：用于ListView，但不用于RecyclerView

 <MvvmCross.Droid.Support.V7.RecyclerView.MvxRecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:MvxBind="ItemsSource Messages"
        android:layout_weight="1" />

编辑2：

item_sendedmessage.axml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              //NOT WORKING ->
              android:layout_gravity="right"
              //NOT WORKING ->
              android:background="@drawable/sended_message_style"
              android:layout_margin="10dp"  >

  <TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/whiteColor"
    app:MvxBind="Text Message">

  </TextView>

</LinearLayout>

android:layout\u gravity=“右”
//不工作->
android:background=“@drawable/sended_message_style”
android:layout_margin=“10dp”>

您可以向Droid项目添加一个新类，该类实现了

IMvxTemplateSelector

接口。这是一个要实现的简单接口。在

GetItemLayoutId

中，您将返回Resource.Layout。取决于邮件的发件人。以下是一个例子：

public class MessageItemTemplate : IMvxTemplateSelector
{
    protected const int FromDriver = 0;
    protected const int FromOther = 1;
    protected readonly string DriverEmployeeId;

    public MessageItemTemplate(string driverEmployeeId)
    {
        DriverEmployeeId = driverEmployeeId;
    }

    public int GetItemViewType(object forItemObject)
    {
        var messageModel = forItemObject as MessageModel;
        if (messageModel == null) return FromOther;
        return messageModel.SenderId == DriverEmployeeId ? FromDriver : FromOther;
    }

    public int GetItemLayoutId(int fromViewType)
    {
        switch (fromViewType)
        {
            case FromDriver:
                return Resource.Layout.listitem_message_from_driver;
            default:
                return Resource.Layout.listitem_message_from_peer;
        }
    }
}

最后，您可以通过以下代码将此模板选择器与RecyclerView关联：

var mvxRecyclerView = FindViewById<MvxRecyclerView>(Resource.Id.messages_recycler);
if (_mvxRecyclerView != null)
{
    _mvxTemplateSelector = new MessageItemTemplate("TEST");
    _mvxRecyclerView.ItemTemplateSelector = _mvxTemplateSelector;
    var layoutManager = new LinearLayoutManager(this)
    {
        StackFromEnd = true
    };
    _mvxRecyclerView.SetLayoutManager(layoutManager);
}

var mvxRecyclerView=findviewbyd（Resource.Id.messages\u recycler）；
如果（_mvxRecyclerView！=null）
{
_mvxTemplateSelector=新消息项模板（“测试”）；
_mvxRecyclerView.ItemTemplateSelector=\u mvxTemplateSelector；
var layoutManager=新的LinearLayoutManager（此）
{
StackFromEnd=true
};
_mvxRecyclerView.SetLayoutManager（layoutManager）；
}

---

您可以使用MvvmCross颜色插件控制颜色，或者只使用两个不同的模板，就像我在上面的示例代码中所做的那样。

您可以向Droid项目添加一个新类，该类实现了

IMvxTemplateSelector

接口。这是一个要实现的简单接口。在

GetItemLayoutId

中，您将返回Resource.Layout。取决于邮件的发件人。以下是一个例子：

public class MessageItemTemplate : IMvxTemplateSelector
{
    protected const int FromDriver = 0;
    protected const int FromOther = 1;
    protected readonly string DriverEmployeeId;

    public MessageItemTemplate(string driverEmployeeId)
    {
        DriverEmployeeId = driverEmployeeId;
    }

    public int GetItemViewType(object forItemObject)
    {
        var messageModel = forItemObject as MessageModel;
        if (messageModel == null) return FromOther;
        return messageModel.SenderId == DriverEmployeeId ? FromDriver : FromOther;
    }

    public int GetItemLayoutId(int fromViewType)
    {
        switch (fromViewType)
        {
            case FromDriver:
                return Resource.Layout.listitem_message_from_driver;
            default:
                return Resource.Layout.listitem_message_from_peer;
        }
    }
}

最后，您可以通过以下代码将此模板选择器与RecyclerView关联：

var mvxRecyclerView = FindViewById<MvxRecyclerView>(Resource.Id.messages_recycler);
if (_mvxRecyclerView != null)
{
    _mvxTemplateSelector = new MessageItemTemplate("TEST");
    _mvxRecyclerView.ItemTemplateSelector = _mvxTemplateSelector;
    var layoutManager = new LinearLayoutManager(this)
    {
        StackFromEnd = true
    };
    _mvxRecyclerView.SetLayoutManager(layoutManager);
}

var mvxRecyclerView=findviewbyd（Resource.Id.messages\u recycler）；
如果（_mvxRecyclerView！=null）
{
_mvxTemplateSelector=新消息项模板（“测试”）；
_mvxRecyclerView.ItemTemplateSelector=\u mvxTemplateSelector；
var layoutManager=新的LinearLayoutManager（此）
{
StackFromEnd=true
};
_mvxRecyclerView.SetLayoutManager（layoutManager）；
}

---

您可以使用MvvmCross颜色插件控制颜色，或者像我在上面的示例代码中那样使用两个不同的模板。

谢谢您的回答，它可以工作，但我发送的消息位于左侧，而不是右侧。查看我的原始帖子。你可以通过将

LinearLayout

更改为

RelativeLayout

来解决这个问题。然后，您的

TextView

可以更改XML中的

android:layout\u alignParentRight=“true”

，或者代码中的

RelativeLayout.LayoutParams

。感谢您的回答，它可以工作，但我发送的消息位于左侧，而不是右侧。查看我的原始帖子。你可以通过将

LinearLayout

更改为

RelativeLayout

来解决这个问题。然后您的

TextView

可以更改XML中的

android:layout\u alignParentRight=“true”

，或者代码中的

RelativeLayout.LayoutParams

。