Как отобразить новый элемент на MvxListView на кнопке Нажмите в Android Xamarin Visual Studio

Question

Я хочу отображать новую строку TextView каждый раз, когда я нажимаю кнопку. Я использую MvvmCross, и я знаю, что я должен использовать MvxListView, который назначен шаблону макета, но я не знаю, как отображать его на экране при нажатии кнопки.

Может кто-нибудь дать мне простой пример кода, сделанный из ViewModel, и очень короткое объяснение о том, какая строка кода инициирует отображение нового TextView?

UPDATE

Я обеспечиваю мой код ниже:

ViewModel.cs

public class FirstViewModel 
    : MvxViewModel 
{ 
    private ObservableCollection<Unit> unitCodes; 
    public ObservableCollection<Unit> UnitCodes 
    { 
     get { return unitCodes; } 
     set { unitCodes = value; RaisePropertyChanged(() => UnitCodes); } 
    } 

    public IMvxCommand ButtonCommand { get; private set; } 
    public FirstViewModel() 
    { 
     unitCodes = new ObservableCollection<Unit>(); 
     ButtonCommand = new MvxCommand(() => 
     { 
      UnitCodes = UnitCodes ?? new ObservableCollection<Unit>(); 
      UnitCodes.Add(new Unit("123", "Test Name")); 
     }); 
    } 

    public class Unit : MvxViewModel 
    { 
     private string unitCode; 
     public string UnitCode 
     { 
      get { return unitCode; } 
      set { unitCode = value; RaisePropertyChanged(() => UnitCode); } 
     } 
     private string unitName; 
     public string UnitName 
     { 
      get { return unitName; } 
      set { unitName = value; RaisePropertyChanged(() => UnitName); } 
     } 

     public Unit() { } 
     public Unit(string unitCode, string unitName) 
     { 
      UnitCode = unitCode; 
      UnitName = unitName; 
     } 
    } 
} 

View.axml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:local="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
    <Button 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:textSize="40dp" 
     local:MvxBind="Click ButtonCommand" 
     android:text="Click To Add" /> 
    <Mvx.MvxListView 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     local:MvxItemTemplate="@layout/unitcodeitemlayout" 
     local:MvxBind="ItemSource UnitCodes" /> 
</LinearLayout> 

unitcodeitemlayout.axml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:local="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 
    <TextView 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:textSize="20dp" 
     local:MvxBind="Text UnitName" /> 
    <TextView 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:textSize="30dp" 
     local:MvxBind="Text UnitCode" /> 
</LinearLayout> 

Мой код не имеет никакой компиляции или ошибки времени выполнения, однако ничего не происходит по нажатию кнопки. Я хочу, чтобы каждый раз, когда я нажимаю кнопку, я добавляю «123» и «Test Name».

Answer 1

Ваш код правильно. Тем не менее, вы опечатали ItemsSource под MvxListView axml.

Оно должно быть:

<Mvx.MvxListView 
    ... 
    local:MvxBind = "ItemsSource UnitCodes"/> 

Answer 2

Для того, чтобы установить ListView, посмотрите на эту MvvmCross tutorial

Вы могли бы в конечном итоге с чем-то вроде этого:

ViewModel:

public class MyListViewModel : MvxViewModel 
    { 
     private ObservableCollection<TextViewCellViewModel> _listItems; 

     public virtual ObservableCollection<TextViewCellViewModel> ListItems { 
      get { 
       return _listItems; 
      } 
      set { 
       _listItems = value; 
       RaisePropertyChanged(() => ListItems); 
      } 
     } 

     private IMvxCommand _addTextViewCommand; 

     public IMvxCommand AddTextViewCommand { 
      get { 
       _addTextViewCommand = _addTextViewCommand ?? new MvxCommand(AddTextView); 
       return _addTextViewCommand; 
      } 
     } 


     private void AddTextView() 
     { 
      ListItems = ListItems ?? new ObservableCollection<TextViewCellViewModel>(); 

      ListItems.Add(new TextViewCellViewModel()); 
     } 


     public class TextViewCellViewModel : MvxViewModel 
     { 
      private string _text; 
      public string Text { get { return _text; } set { _text = value; RaisePropertyChanged(() => Text); } } 

      public TextViewCellViewModel() { } 
     } 
    } 

Layout Android ListView:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:local="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:gravity="fill_vertical" 
    android:paddingRight="20dp" 
    android:paddingLeft="20dp"> 
    <FrameLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_above="@id/frameLayout" 
     android:paddingBottom="50dp"> 
     <MvxListView 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:scrollbars="vertical" 
      android:id="@+id/list_view_tripplanner_result" 
      android:divider="@android:color/transparent" 
      android:paddingTop="10dp" 
      android:clipToPadding="false" 
      android:dividerHeight="7dp" 
      android:descendantFocusability="afterDescendants" 
      local:MvxItemTemplate="@layout/cell_textview" 
      local:MvxBind="ItemsSource ListItems;" /> 
    </FrameLayout> 
    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:paddingTop="5dp" 
     android:paddingBottom="10dp"> 
     <Button 
      android:layout_width="match_parent" 
      android:layout_height="40dp" 
      local:MvxBind="Click AddTextViewCommand" 
      android:text="Add TextView" 
      android:textColor="@color/primary_white" 
      android:background="@android:color/darker_gray" /> 
    </LinearLayout> 
</RelativeLayout> 

Что должно выглядеть так: (кнопка уведомления на b ottom из Listview)

Где @ макет/cell_textview будет выглядеть примерно так:

макет для ItemTemplate для ListView будет:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:local="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:orientation="horizontal" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 
    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:ellipsize="end" 
     android:textSize="20dp" 
     local:MvxBind="Text Text"/> 
</LinearLayout>