2

mvvm ライト ツールキットの最新バージョンを使用していますが、イベント TreeViewItem.Expanded に EventToCommand を使用する方法がわかりません。

これはうまくいきません...何が間違っていますか？

<TreeView Grid.Column="0" Grid.Row="0" ItemsSource="{Binding Path= MonitoredDatabases}">
        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Queues}">

                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding ServerName}" />
                    <TextBlock Text="\" />
                    <TextBlock Text="{Binding DatabaseName}" />
                </StackPanel>

                <HierarchicalDataTemplate.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding QueueName}" />
                    </DataTemplate>
                </HierarchicalDataTemplate.ItemTemplate>

            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="TreeViewItem.Expanded">
                <cmd:EventToCommand Command="{Binding Path=NodeExpanded}"
                                    CommandParameter="Expanded" />
            </i:EventTrigger>
            <i:EventTrigger EventName="TreeViewItem.Collapsed">
                <cmd:EventToCommand Command="{Binding Path=NodeCollapsed}"
                                    CommandParameter="Collapsed" />
            </i:EventTrigger>
        </i:Interaction.Triggers>
    </TreeView>

大変助かります。

よろしく。

ゲイリー

4

2 に答える 2

1

TreeViewのカスタムItemContainerStyleを作成することで、これを行うことができました。これを次のコード スニペットと組み合わせることができるはずです。

1. TreeView の ViewModel

public class TreeViewModelView
{
    public IEnumerable<object> Values
    {
        get { /* return hierarchical data source here ... */ }
    }

    /// <summary>
    /// Command executed when the TreeViewItem expanding event is raised. The data item is passed in as a parameter.
    /// </summary>
    public RelayCommand<object> ExpandedCommand
    {
        get { return new RelayCommand<object>( o => MessageBox.Show( o.GetType().Name ) ); }
    }

    /// <summary>
    /// Command executed when the TreeViewItem collapsing event is raised.
    /// </summary>
    public RelayCommand CollapsedCommand
    {
        get { return new RelayCommand( () => MessageBox.Show( "Collapsed" ) ); }
    }

}

2. TreeView を定義し、必要なデータ バインディングをセットアップします。

 <TreeView x:Name="lstItems" HorizontalAlignment="Left" Margin="21,19,0,80" Width="283" 
          DataContext="{DynamicResource TreeViewModelView}"
          ItemsSource="{Binding Values, Mode=OneWay}" 
          ItemTemplate="{DynamicResource TreeViewDataTemplate}" 
          ItemContainerStyle="{DynamicResource TreeViewItemStyle}">
    <TreeView.Resources>
        <mv:TreeViewModelView x:Key="TreeViewModelView" />

        <HierarchicalDataTemplate x:Key="TreeViewDataTemplate" ItemsSource="{Binding Items}">
            <Grid>
                <TextBlock Text="{Binding Name}" />
            </Grid>
        </HierarchicalDataTemplate>
    </TreeView.Resources>
</TreeView>

3. Expression Blend では、 ItemContainerStyleテンプレートのコピーを作成および編集できます。

<Style x:Key="TreeViewItemStyle" TargetType="{x:Type TreeViewItem}">

    ...

</Style>

4.次に、 ToggleButtonを次のように置き換えます。

<ToggleButton x:Name="Expander" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ExpandCollapseToggleStyle}">

    <i:Interaction.Triggers>
        <!-- When the Checked event is raised execute the ExpandedCommand with the data item as a parameter. -->
        <i:EventTrigger EventName="Checked">
            <GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding Path=DataContext.ExpandedCommand, RelativeSource={RelativeSource AncestorType={x:Type TreeView}}, Mode=OneWay}" 
                CommandParameter="{Binding}" />
        </i:EventTrigger>
        <!-- When the Unchecked event is raised execute the CollapsedCommand. -->
        <i:EventTrigger EventName="Unchecked">
            <GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding Path=DataContext.CollapsedCommand, RelativeSource={RelativeSource AncestorType={x:Type TreeView}}, Mode=OneWay}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>

</ToggleButton>
于 2010-10-20T04:53:24.530 に答える
0

イベントからコマンドへの動作は、FrameworkElement に添付する必要がある添付プロパティとして実装されます。サンプルには、 Expanded または Collapsed イベントを持たない TreeView に添付された Triggers 添付プロパティがあります。イベント名として「TreeViewItem.Expanded」を使用しようとしましたが、そのようには機能しません。

TreeViewItems を XAML で静的に作成するか、コード ビハインドで手動で作成する場合は、各 TreeViewItem にアタッチできます。残念ながら、HierarchicalDataTemplate から TreeViewItem にアタッチする方法を知りません。TemplatedParent RelativeSource にバインドできますが、アタッチすることはできません。唯一の解決策は、コード ビハインドで TreeViewItems を反復処理し、イベントを手動で処理することですが、それでも、TreeView コントロールがデータ バインドされてレンダリングされた後にのみ、VisualTreeHelper を使用してこれを行う必要があります。これは巨大なハックです。 .

于 2010-07-15T15:44:45.257 に答える