Как сохранить плавную прокрутку gridsplitter в элементе управления ListBox

У меня есть ListBox с Grid в шаблоне данных. В Grid у меня есть элемент управления Splitter. Теперь проблема в том, что когда я привязываю источник элемента списка, тогда внутри создается несколько сеток, и из-за этих сеток мой элемент управления разделителем не работает. Работает непредсказуемо. Это означает, что когда я перемещаю элемент управления разделителем влево, он перемещается плавно, но когда я пытаюсь переместить его из другого ряда, он не возвращается. Пожалуйста, помогите мне в этом вопросе.

Дополнительные ссылки см. в примере кода:

<Window x:Class="MultiColumnList.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MultiColumnList"
Title="Window1" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="400" d:DesignWidth="400" SizeToContent="WidthAndHeight">
<Grid >
    <Grid.Resources>
        <XmlDataProvider x:Key="BlogData" XPath="Blogs/Blog">
            <x:XData>
                <Blogs xmlns="">
                    <Blog>
                        <BlogSite>simplegeek.com</BlogSite>
                        <Blogger OnlineStatus="Offline">Chris Anderson</Blogger>
                        <Url>http://simplegeek.com</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>fortes.com</BlogSite>
                        <Blogger OnlineStatus="Offline">Fil Fortes</Blogger>
                        <Url>http://fortes.com/work</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>Longhorn Blogs</BlogSite>
                        <Blogger OnlineStatus="Online">Rob Relyea</Blogger>
                        <Url>http://www.longhornblogs.com/rrelyea/</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>designerslove.net</BlogSite>
                        <Blogger OnlineStatus="Online">Nathan Dunlap</Blogger>
                        <Url>http://designerslove.net/</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>blogs.msdn.com</BlogSite>
                        <Blogger OnlineStatus="Online">Karsten Januszewski</Blogger>
                        <Url>http://blogs.msdn.com/karstenj</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>weblogs.asp.net</BlogSite>
                        <Blogger OnlineStatus="Online">Greg Schecter</Blogger>
                        <Url>http://weblogs.asp.net/greg_schechter</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>blogs.msdn.com</BlogSite>
                        <Blogger OnlineStatus="Online">Tim Sneath</Blogger>
                        <Url>http://blogs.msdn.com/tims/</Url>
                    </Blog>

                    <Blog>
                        <BlogSite>weblogs.asp.net</BlogSite>
                        <Blogger OnlineStatus="Offline">Marcelo Lopez-Ruiz</Blogger>
                        <Url>http://weblogs.asp.net/marcelolr/</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>blogs.msdn.com</BlogSite>
                        <Blogger OnlineStatus="Online">Kevin Moore</Blogger>
                        <Url>http://blogs.msdn.com/okoboji/default.aspx</Url>
                    </Blog>
                    <Blog>
                        <BlogSite>laurenlavoie.com</BlogSite>
                        <Blogger OnlineStatus="Offline">Lauren Lavoie</Blogger>
                        <Url>http://laurenlavoie.com/</Url>
                    </Blog>
                </Blogs>
            </x:XData>
        </XmlDataProvider>

        <DataTemplate x:Key="BlogDataTemplate">

            <Grid TextBlock.FontSize="12" LayoutUpdated="Grid_LayoutUpdated">

                <Grid.ColumnDefinitions>
                    <ColumnDefinition x:Name="LeftColumn" Width="Auto"   SharedSizeGroup="BloggerColumn"/>
                    <ColumnDefinition  x:Name="Center" Width="*"  SharedSizeGroup="BlogSiteColumn"/>
                    <ColumnDefinition x:Name="Right" Width="*"  SharedSizeGroup="OnlineStatusColumn"/>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0" Margin="10,0,10,0" Text="{Binding XPath=Blogger}"/>
                <GridSplitter Grid.Column="1" Width="2"  HorizontalAlignment="Center" Background="Black"  DragCompleted="GridSplitter_DragCompleted"/>

                <TextBlock Grid.Column="2" Margin="10,0,10,0" Text="{Binding XPath=Blogger/@OnlineStatus}"/>
            </Grid>
        </DataTemplate>

        <ControlTemplate x:Key="Header" TargetType="{x:Type Button}">
            <Border Background="LightGray" 
                TextBlock.Foreground="white" 
                TextBlock.FontSize="20" 
                Padding="10,3,10,4">
                <ContentPresenter/>
            </Border>
        </ControlTemplate>

        <Grid x:Key="ListHeader" Margin="5" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" SharedSizeGroup="BloggerColumn"/>
                <ColumnDefinition Width="*" SharedSizeGroup="BlogSiteColumn"/>
                <ColumnDefinition Width="*" SharedSizeGroup="BloggerOnlineStatusColumn"/>
            </Grid.ColumnDefinitions>
            <Button Grid.Column="0" Template="{StaticResource Header}">Blogger</Button>
            <GridSplitter Grid.Column="1" Width="2"  Background="Black" HorizontalAlignment="Stretch" DragCompleted="GridSplitter_DragCompleted"  />
            <Button Grid.Column="2" Template="{StaticResource Header}">Status</Button>
        </Grid>


        <Style x:Key="HeaderedScrollViewer" TargetType="{x:Type ScrollViewer}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ScrollViewer}">
                        <Grid Background="{TemplateBinding Background}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>

                            <DockPanel Margin="{TemplateBinding Padding}">
                                <ScrollViewer DockPanel.Dock="Top"
                                          local:SetHorizontalOffset.Offset="{Binding 
                                                RelativeSource={RelativeSource TemplatedParent}, 
                                                Path=HorizontalOffset}" 
                                          HorizontalScrollBarVisibility="Hidden"
                                          VerticalScrollBarVisibility="Hidden"
                                          Focusable="false"
                                          Content="{StaticResource ListHeader}">
                                </ScrollViewer>

                                <ScrollContentPresenter Name="PART_ScrollContentPresenter"
                                    KeyboardNavigation.DirectionalNavigation="Local"/>
                            </DockPanel>

                            <ScrollBar Name="PART_HorizontalScrollBar"
                                Orientation="Horizontal"
                                Grid.Row="1"
                                Maximum="{TemplateBinding ScrollableWidth}"
                                ViewportSize="{TemplateBinding ViewportWidth}"
                                Value="{TemplateBinding HorizontalOffset}"
                                Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>

                            <ScrollBar Name="PART_VerticalScrollBar"
                                Grid.Column="1"
                                Maximum="{TemplateBinding ScrollableHeight}"
                                ViewportSize="{TemplateBinding ViewportHeight}"
                                Value="{TemplateBinding VerticalOffset}"
                                Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="{x:Type ListBox}" TargetType="{x:Type ListBox}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <ScrollViewer Style="{StaticResource HeaderedScrollViewer}" 
                                      Grid.IsSharedSizeScope="True">
                            <StackPanel IsItemsHost="true"/>
                        </ScrollViewer>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Grid.Resources>

    <ListBox ItemsSource="{Binding Source={StaticResource BlogData}}" 
             ItemTemplate="{StaticResource BlogDataTemplate}" Height="400" Width="600"/>
</Grid>


person Bhaskar Singh    schedule 02.12.2011    source источник


Ответы (1)


Основная проблема, с которой вы сталкиваетесь, - это звезда для ширины столбца столбцов, содержащих ваши сплиттеры. Эти два столбца должны иметь ширину 2, чтобы соответствовать ширине 2 в GridSplitters. Вторая проблема заключается в том, что у вас разные минимальные размеры для левого заголовка и данных левого столбца. Кроме того, у обоих GridSplitter для HorizontalAlignment должно быть установлено значение Center.

person Brannon    schedule 08.08.2012
comment
Спасибо за ваш комментарий, но можете ли вы объяснить это логически. Чтобы я мог понять, что именно я должен сделать, чтобы в будущем не возникало такой проблемы. - person Bhaskar Singh; 10.08.2012
comment
Проблема в том, что разделитель сетки (как настроено в исходном коде) увеличивает столбец, в котором он находится, при перемещении. - person Brannon; 13.08.2012