ParentViewModel
にはReactiveList
のChildViewModels
が含まれています。私はそれをListView
にバインドして、ChildViews
と表示したいと思います。 ChildView
はLabel
にいくつかのテキストを結合し、状態の列挙型に基づいてImage
リソース設定:シンプルなコンテナChildViewModels
ビューモデルのReactiveListをビューモデルのビューを含むListViewにバインドする方法
public class ParentViewModel : ReactiveObject
{
public ReactiveList<ChildViewModel> Children { get; }
= new ReactiveList<ChildViewModel>();
}
ChildViewModel.csため
ParentViewModel.csをいくつかのテキストとStatus
を持っています
public class ChildViewModel : ReactiveObject
{
public string SomeText { get; set; }
public enum Status
{
Unknown,
Known
}
public Status CurrentStatus { get; set; } = Status.Unknown;
}
親ビューxデータテンプレートにChildView
を使用してListView
をラップするamlUserControl
を使用します。私はDataTemplate
にViewModel="{Binding}"
を必ず追加しました。
<UserControl x:Class="MyProject.UI.ParentView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:vm="clr-namespace:MyProject.View_Models"
xmlns:ui="clr-namespace:MyProject.UI">
<ListView x:Name="ChildList" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<!--I have also tried the following line, didn't work -->
<!--<DataTemplate DataType="{x:Type vm:ChildViewModel}">-->
<ui:ChildView ViewModel="{Binding}"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</UserControl>
ParentView.xaml.csはそのParentViewModel
のための依存関係プロパティを作成し、ビューモデルのChildren
たchildList ListViewコントロール
Image
と public partial class ParentView : UserControl, IViewFor<ParentViewModel>
{
public static readonly DependencyProperty ViewModelProperty
= DependencyProperty.Register(
"ViewModel",
typeof(ParentViewModel),
typeof(ParentView));
object IViewFor.ViewModel
{
get { return ViewModel; }
set { ViewModel = (ParentViewModel)value; }
}
public ParentViewModel ViewModel
{
get { return (ParentViewModel)GetValue(ViewModelProperty); }
set
{
SetValue(ViewModelProperty, value);
BindToViewModel(value);
}
}
private void BindToViewModel(ParentViewModel viewModel)
{
this.OneWayBind(viewModel, vm => vm.Children, v => v.ChildList.ItemsSource);
}
}
ChildView.xamlシンプルUserControl
へと結合し、 a Label
<UserControl x:Class="MyProject.UI.ChildView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel Orientation="Horizontal">
<Image Name="StatusIcon" Margin="2" />
<Label Name="DisplayName" />
</StackPanel>
</UserControl>
が
public partial class ChildView : UserControl, IViewFor<ChildViewModel>
{
public static readonly DependencyProperty ViewModelProperty
= DependencyProperty.Register(
"ViewModel",
typeof(ChildViewModel),
typeof(ChildView));
public ChildView()
{
InitializeComponent();
}
object IViewFor.ViewModel
{
get { return ViewModel; }
set { ViewModel = (ChildViewModel)value; }
}
public ChildViewModel ViewModel
{
get { return (ChildViewModel)GetValue(ViewModelProperty); }
set
{
SetValue(ViewModelProperty, value);
BindToViewModel(value);
}
}
private void BindToViewModel(ChildViewModel viewModel)
{
viewModel
.WhenAnyValue(vm => vm.CurrentStatus)
.Subscribe(status =>
{
// set StatusIcon's image based on status
});
this.Bind(viewModel, vm => vm.DisplayName, v => v.SomeText);
}
}
画像データをChildViewModel
をバインドし、設定
ChildView.xaml.cs私はViewModelにプロパティがヒットかどうかを確認するためにChildView
にブレークポイントを設定しているが、彼らは決してしません。 ChildViewModels
をParentVieWModel.Children
に追加すると、ChildView
が作成されますが、正しくバインドされません。 Children
のCollectionChanged
イベントを購読して手作業でバインディングを設定することができましたが、これを適切なXAML/ReactiveUIの方法で行いたいと思います。私は何が欠けていますか?
これは素晴らしい動作です!あなたのご意見ありがとうございます。 –