Question

我是Xamarin Android和MvvmCross的新手，我一直在尝试为MvxListView实现备用行背景。下面是我的MvxListView代码

<Mvx.MvxListView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:divider="@null"
android:layout_centerHorizontal="true"
android:layout_alignParentTop="true"
android:layout_above="@+id/llSubtotal"
android:cacheColorHint="@android:color/transparent"
local:MvxBind="ItemsSource Items;ItemClick ItemSelectedCommand"
local:MvxItemTemplate="@layout/listviewitem"
android:id="@+id/mvxLVCustomerItemList" />

我从ViewModel绑定listview的itemource。

以上Listview的模板是ListViewItem.axml，如下所示 -

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:id="@+id/lvItemTemplate"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/odd">
<Mvx.MvxImageView
android:layout_width="150dp"
android:layout_height="fill_parent"
android:id="@+id/ivItemImage"
android:textSize="40dp"
android:layout_gravity="center_horizontal|center"
local:MvxBind="ImageUrl StripUrl" />
<TextView
android:layout_marginTop="20dp"
android:layout_width="fill_parent"
android:id="@+id/tvItemName"
android:layout_height="fill_parent"
local:MvxBind="Text Title" />
</LinearLayout>

我尝试使用自定义适配器实现备用行，但在这种情况下，listview不显示数据。不知何故，由于我对Android或MvvmCross缺乏了解，我失败了。

任何帮助都将受到高度赞赏。

请注意，此项目位于Xamarin，并且只有Android应用程序。在我的项目中没有UWP或其他，这完全是带有MvvmCross的Xamarin Android。

Answer 1

这样做的一种方法是在ViewModel中有一个bool属性，你可以绑定它并使用转换器设置相应的背景图像，例如：

的ViewModels：

public class MyItemViewModel
{
    public MyItemViewModel(bool changeBackground)
    {
        this.ChangeBackground = changeBackground;
    }

    public bool ChangeBackground { get; set; }
}

public class MyListViewModel
{
    public ObservableCollection<MyItemViewModel> MyItems { get; set; }

    private void MyItemsInit()
    {
         this.MyItems = new ObservableCollection<MyItemViewModel>();

         for (int i = 0; i < 10; i++)
             this.MyItems.Add(new MyItemViewModel(i % 2 == 0));
    }
}

转换器：

public class BoolToMyImageToggleConverter : MvxValueConverter<bool, string>
{
    protected override string Convert(bool value, Type targetType, object parameter, CultureInfo culture)
    {
        // this is just for android but you can take advantage of CrossDeviceInfo plugin to return the path to the image depending on the platform you are on.
        return value ? "@drawable/my_image_1" : "@drawable/my_image_2";
    }
}

项目视图：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:id="@+id/lvItemTemplate"
android:layout_width="match_parent"
android:layout_height="match_parent"
local:MvxBind="DrawableName BoolToMyImageToggle(ChangeBackground)">

    <Mvx.MvxImageView
    android:layout_width="150dp"
    android:layout_height="match_parent"
    android:id="@+id/ivItemImage"
    android:textSize="40dp"
    android:layout_gravity="center_horizontal|center"
    local:MvxBind="ImageUrl StripUrl" />
    <TextView
    android:layout_marginTop="20dp"
    android:layout_width="match_parent"
    android:id="@+id/tvItemName"
    android:layout_height="match_parent"
    local:MvxBind="Text Title" />

</LinearLayout>

HIH

如果来自viewmodel的itemsource绑定，则实现MvxListView备用行背景图像

1 个答案: