User Interface Design Using MVVM Template

Question

I am trying to choose the best way to implement this interface in MVVM. I am new to WPF (e.g. 2 months), but I have vast experience with WinForms.

The ListBox here acts like a TabControl (so it switches the view to the right) and basically contains the type of item displayed in the tables. The entire user interface is dynamic (ListBox, TabItems, and columns are defined at runtime). The application is designed for WPF and Silverlight.

Classes required for ViewModel:

public abstract class ViewModel : INotifyPropertyChanged {}
public abstract class ContainerViewModel : ViewModel
{
    public IList<ViewModel> Workspaces {get;set;}
    public ViewModel ActiveWorkspace {get;set;}
}
public class ListViewModel<TItem> where TItem : class
{
    public IList<TItem> ItemList { get; set; }
    public TItem ActiveItem { get; set; }
    public IList<TItem> SelectedItems { get; set; }
}
public class TableViewModel<TItem> : ListViewModel<TItem> where TItem : class
{
    public Ilist<ColumnDescription> ColumnList { get; set; }
}

Now the question is how to relate this to the View.

There are two basic approaches that I see here:

• With XAML: due to the lack of Generics support in XAML, I will lose strong typing.
• Without XAML: I can reuse the same ListView<T> : UserControl.

, , 3 ( XAML ). DataBinding DataGrid TabControl TabItems, , , :

• DataBinding IValueConverter: , WPF | Silverlight , , , . ( , , ).

• , INotifyPropertyChanged : ViewModel.PropertyChanged + =.... ViewModel.ColumnList.CollectionChanged + =....

• , : , ( , WPF , , , )

---

: 28.02.2011 , TreeView ListBox, . , , TreeView.SelectedItems - readonly, . Ummm , - , viewmodel. , DisplayMemberPath TreeView ( , ToString()). ViewModel.SelectedItem TreeView:

private void UpdateTreeViewSelectedItem()
{
    //uiCategorySelector.SelectedItem = ReadOnly....

    //((TreeViewItem) uiCategorySelector.Items[uiCategorySelector.Items.IndexOf(Model.ActiveCategory)]).IsSelected = true;
    // Will not work Items are not TreeViewItem but Category object......

    //((TreeViewItem) uiCategorySelector.ItemContainerGenerator.ContainerFromItem(Model.ActiveCategory)).IsSelected = true;
    //Doesn't work too.... NULL // Changind DataContext=Model and Model = new MainViewModel line order doesn't matter.
    //Allright.. figure this out later...
}

, , ...

, Control Library Hell MVVM: http://cid-b73623db14413608.office.live.com/self.aspx/.Public/MVVMDemo.zip

Answer 1

, , , .

http://alexburtsev.wordpress.com/2011/03/05/mvvm-pattern-in-silverlight-and-wpf/

Answer 2

Maciek , . . :

• , . , Text, , .

• DataTemplate , DataType .

• .

• TabControl ItemsSource ItemTemplate, Text .

, ( Text, , , CLR), ,

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:sys="clr-namespace:System;assembly=mscorlib"
  xmlns:coll="clr-namespace:System.Collections;assembly=mscorlib">
  <DockPanel>  
   <DockPanel.Resources>
        <coll:ArrayList x:Key="Data">
          <sys:String>This is a string.</sys:String>
          <sys:Int32>12345</sys:Int32>
          <sys:Decimal>23456.78</sys:Decimal>
        </coll:ArrayList>
        <DataTemplate DataType="{x:Type sys:String}">
          <TextBlock Text="{Binding}"/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type sys:Int32}">
          <StackPanel Orientation="Horizontal">
           <TextBlock>This is an Int32:</TextBlock>
           <TextBlock Text="{Binding}"/>
          </StackPanel>
        </DataTemplate>
        <DataTemplate DataType="{x:Type sys:Decimal}">
          <StackPanel Orientation="Horizontal">
           <TextBlock>This is a Decimal: </TextBlock>
           <TextBlock Text="{Binding}"/>
          </StackPanel>
        </DataTemplate>
   </DockPanel.Resources>
    <TabControl ItemsSource="{StaticResource Data}">  
      <TabControl.ItemTemplate>
       <DataTemplate>
        <TextBlock Text="{Binding}"/>
       </DataTemplate>
      </TabControl.ItemTemplate>
    </TabControl>
  </DockPanel>
</Page>

, MVVM- DataTemplate UserControl :

<DataTemplate DataType="{x:Type my:ViewModel}">
   <my:View DataContext="{Binding}"/>
</DataTemplate>

Answer 3

Maciek Robert , .

DataGrid Meleak .

, ( ) - ViewModel MVVM.

, WPF , . , , . , PRISM.

Answer 4

ViewModel , ViewConttext. .

public View()
{
    DataContext = new ViewModel();
}

, XAML, View, DataContext StaticResource.

<UserControl
xmlns:vm="clr-namespace:MyViewModels
>
    <UserControl.Resources>
         <vm:MyViewModel x:Key="MyVM"/>
    </UserControl.Resources>
    <MyControl DataContext={StaticResource MyVM}/>
</UserControl>

( , -)

, , TabControl, :

• ViewModels ObservableCollection.
• Items TabControls
• , TabItem
• .
• IDisposable yoour child ViewModels .

, , , .