具有动态列数的WPF网格

时间:2012-06-11 04:31:31

标签: c# wpf .net-4.0 treeview

我对WPF很陌生,并且正在努力完成视觉效果 - 我希望有一个二维网格对象,数据驱动的列数。我试图与MVVM一起使用零代码。我已经看了几个这方面的帖子,并提出了以下建议:

<UserControl x:Class="Demo.Views.SideBySideStackPanelView"
             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:views="clr-namespace:Demo.Views"
             xmlns:viewModels="clr-namespace:Demo.ViewModels"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <DataTemplate x:Key="ColumnTemplate">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="400"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*" SharedSizeGroup="TreeView"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*" SharedSizeGroup="DetailView"/>
                </Grid.RowDefinitions>

                <DockPanel Grid.Row="0" LastChildFill="True">
                    <TextBlock Text="{Binding Name}" DockPanel.Dock="Left"/>
                    <Button Command="{Binding Close}" DockPanel.Dock="Right" HorizontalAlignment="Right">
                        <Image Width="10" Height="10" Source="/Demo;component/Images/Close.png" />
                    </Button>
                </DockPanel>

                <views:TreeView Grid.Row="1"/>

                <GridSplitter 
                    ResizeDirection="Rows" 
                    VerticalAlignment="Center"
                    HorizontalAlignment="Stretch"
                    Height="5"
                    Grid.Row="2"
                    Name="sideBySideSplitter"/>

                <views:TreeDetail Grid.Row="2"/>

            </Grid>
        </DataTemplate>
    </UserControl.Resources>

    <Grid d:DataContext="{d:DesignInstance viewModels:MainWindowViewModel}" Grid.IsSharedSizeScope="True">
        <ItemsControl ItemsSource="{Binding PluginItem}" ItemTemplate="{StaticResource ColumnTemplate}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>
</UserControl>

TreeView视图是一个基本的绑定TreeView,TreeDetail视图是一个简单的绑定网格。

控件确实根据需要渲染我的内容,但是当我与列的上部的树视图交互时,控件会垂直展开,而不是在树中显示的滚动条。 GridSplitter根本不起作用;实际上它似乎在细节对象的中间呈现。

我在TabControl.ContentTemplate中有一个类似的DataTemplate,它可以根据需要运行。移动GridSplitter会导致滚动条在必要时显示在任一侧,并且打开TreeView项会导致滚动条显示在该控件中。

我所追求的是类似Excel的演示文稿,用户可以使用水平和垂直“分割器”控制单元格的大小,并且单元格内的用户对象可以根据需要在单元格内滚动。我现在可以使用固定大小的列。

感谢您提供的任何帮助。感谢。

0 个答案:

没有答案