MVVM树形所选项目 [英] MVVM Treeview selected item

问题描述

我希望有人愿意帮助我在这里。
我真的pretty新MVVM，一个读曼尼后和实例后，我仍然无法想出解决办法。

I hope someone is willing to help me out here. I`m pretty new to MVVM, an after reading manny post and examples i still cant figure this out.

我充满了属于每个项目项和计算EF数据库。
我真的出了使用TreeView和HierarchicalDataTemplate项目和计算。
当我在一个TreeView项单击，我想绑定一个标签的文本以

i have EF database filled with items and calculations that belong to each Item. i`m showing the items and calculations using a treeview and HierarchicalDataTemplate. when i click on a treeview item, i want to bind the text of a label to be set at

public string totaalPrijs

但我只是无法弄清楚如何做到这一点！

but i just cant figure out how to do that!

这是我的CalculationViewModel外观

this is how my CalculationViewModel looks

namespace Treeview_test1.ViewModel
{
public class CalculationViewModel : ViewModelBase
{
    public CalculationViewModel(TableItemChildren child)
    {
        this.Child = child;
        IsChecked = false;
    }

    public TableItemChildren Child { get; protected set; }

    public string totaalPrijs
    {
        get { return Child.dbTotaalPrijs; }
        set
        {
            if (Child.dbTotaalPrijs != value)
            {
                Child.dbTotaalPrijs = value;
                RaisePropertyChanged("totaalPrijs");
            }
        }
    }

    private bool _isChecked;
    public bool IsChecked
    {
        get { return _isChecked; }
        set
        {
            if (_isChecked != value)
            {
                _isChecked = value;
                RaisePropertyChanged("IsChecked");
            }
        }
    }

}

和这里是我的ItemViewModel

and here is my ItemViewModel

namespace Treeview_test1.ViewModel
{
public class ItemViewModel : ViewModelBase
{
    public ItemViewModel()
    {
        calcVMColl = new ObservableCollection<CalculationViewModel>();
        foreach (TableItemChildren calc in Service.getItemCalculations("1"))
        {
            calcVMColl.Add(new CalculationViewModel(calc));
        }
    }

    // Switch between real and mock data
    private IGetCalculations _service;
    public IGetCalculations Service
    {
        get
        {
            if (_service == null)
            {
                if (IsInDesignMode)
                    _service = new MockCalculations();
                else
                    _service = new GetCalculations();
            }
            return _service;
        }
        set
        {
            _service = value;
        }
    }

    private ObservableCollection<CalculationViewModel> _calcVMColl;
    public ObservableCollection<CalculationViewModel> calcVMColl
    {
        get { return _calcVMColl; }
        set
        {
            if (calcVMColl != value)
            {
                _calcVMColl = value;
                RaisePropertyChanged("calcVMColl");
            }
        }
    }
}

和XAML

<Window x:Class="Treeview_test1.MainWindow" xmlns="http://schemas.microsoft.com/   winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525" xmlns:ViewModel="clr-namespace:Treeview_test1.ViewModel">
<Window.DataContext>
    <ViewModel:ItemViewModel />
</Window.DataContext>
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="204" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <TreeView x:Name="tree" Width="195" HorizontalAlignment="Left" ItemsSource="{Binding calcVMColl}" Background="LightGray" Grid.Column="0" RenderTransformOrigin="1.016,0.509">
        <TreeView.ItemContainerStyle>
            <Style TargetType="{x:Type TreeViewItem}">
                <Setter Property="IsSelected" Value="{Binding IsChecked, Mode=TwoWay}" />
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="FontSize" Value="10" />
                    </Trigger>
                </Style.Triggers>
            </Style>
        </TreeView.ItemContainerStyle>
        <TreeView.Resources>
            <DataTemplate DataType="{x:Type ViewModel:CalculationViewModel}">
                <Label Content="{Binding totaalPrijs}" />
            </DataTemplate>
        </TreeView.Resources>
    </TreeView>
    <Label Grid.Column="1" HorizontalAlignment="Left" Margin="39,39,0,0" VerticalAlignment="Top" Content="{Binding....?}" Foreground="Black" FontFamily="segeo ui" FontSize="20" />
</Grid>

因此​​，在短期：如何绑定我的标签为当前选择的TreeView项文本

So in short: How do i bind the text of my label to the current selected treeview item?

在此先感谢

阿迪

推荐答案

绑定 TreeView控件的的SelectedItem 来一个标签（或的TextBlock ）是相当简单：

Binding the SelectedItem of a TreeView to a Label (or TextBlock) is fairly simple:

<TreeView Name="myTreeview"/>
<TextBlock Text="{Binding SelectedItem, ElementName=myTreeview, Mode=OneWay}"/>

但事实上这并不会显示你想要什么，因为的SelectedItem 的 TreeView控件的是一个典型的对象，你需要一个字符串在的TextBlock 显示。

However this won't actually display what you want, since the SelectedItem of the TreeView is typically an Object and you need a string to display in the TextBlock.

要处理的一种方法是使用转换上的约束力。您可以实施的IValueConverter ，并将它从返回所需的字符串的SelectedItem 。

One way to handle this is to use a Converter on the binding. You can implement IValueConverter and have it return the needed string from the SelectedItem.

   class GetTextFromItemConverter : IValueConverter
   {
      object IValueConverter.Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
      {
         TreeViewItem itm = (TreeViewItem)value;
         string myString = null;
         //Retrieve whatever portion of the TreeViewItem you want to put in myString.
         return myString;
      }

      object IValueConverter.ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
      {
         throw new NotImplementedException();
      }
   }

然后绑定你的的TextBlock 将是这样的：

<TextBlock Text="{Binding SelectedItem, Converter={StaticResource GetTextFromItemConverter}, ElementName=myTreeview, Mode=OneWay}"/>

这篇关于MVVM树形所选项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！