滚动WPF TabItems(不是整个TabControl)

时间:2014-08-05 04:26:45

标签: c# .net wpf xaml vsto

我有以下xaml:

<UserControl x:Class="MyProject.Word.Addin.Presentation.MainTaskPane" 
         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:local="clr-namespace:MyProject.Word.Addin.Presentation" 
         mc:Ignorable="d">
<d:UserControl.DataContext>
    <local:MyProjectPaneViewModelHandler />
</d:UserControl.DataContext>
<!--<Grid>-->

    <DockPanel Name="MainDockPanel" Background="red">
        <local:ExToolBar DockPanel.Dock="Top" />
        <Button DockPanel.Dock="Top" Click="ButtonGetHeightDimensions" Content="Show Dimensions" Height="40"></Button>
        <TabControl DockPanel.Dock="Top" x:Name="TabControl1" Background="LightSkyBlue">
            <TabItem x:Name="Tab1" Background="LightGreen"> 
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Ellipse Width="10" Height="10" Fill="DarkGray"/>
                        <TextBlock>Filters</TextBlock>
                    </StackPanel>
                </TabItem.Header>
                <ScrollViewer Name="ScrollViewer1" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
                <StackPanel Name="Tab1StackPanel" Orientation="Vertical" MaxHeight="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type TabControl}}, Path=ActualHeight}" >
                        <TextBlock FontSize="24" FontWeight="Bold" Foreground="DarkSlateGray" FontStyle="Normal">
                        Filters
                    </TextBlock>
                    <Button x:Name="ClearFiltersButton" Click="ClearFilters_OnClick" Background="DarkRed" Foreground="White"
                            FontSize="20" FontWeight="Bold" MaxWidth="124" HorizontalAlignment="Left">
                        Clear Filters
                    </Button>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock>
                            <Run>Total Paragraphs </Run><Run Text="{Binding ResearchLanguageViewModel.TotalCount}"></Run>
                        </TextBlock>
                    </StackPanel>
                    <ItemsControl ItemsSource="{Binding ResearchLanguageViewModel.Filters, Mode=OneWay}">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>

                                <StackPanel>
                                    <TextBlock Text="{Binding Path=Type}"></TextBlock>
                                    <TextBox Text="Search...."></TextBox>
                                    <ItemsControl ItemsSource="{Binding Path=Values, Mode=OneWay}">
                                        <ItemsControl.ItemTemplate>
                                            <DataTemplate>
                                                <CheckBox Content="{Binding Mode=OneWay}"></CheckBox>
                                            </DataTemplate>
                                        </ItemsControl.ItemTemplate>
                                    </ItemsControl>
                                </StackPanel>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>
                    </ScrollViewer>
            </TabItem>
            <TabItem x:Name="Tab2">
                <TabItem.Header>
                        <TextBlock>A 2nd Tab</TextBlock>
                </TabItem.Header>
                <StackPanel Orientation="Horizontal">
                        <TextBlock>
                            <Run>Mama always said lifes like a box of chocolates...</Run>
                        </TextBlock>
                </StackPanel>
            </TabItem>
        </TabControl>
    </DockPanel>
<!--</Grid>-->

以下对象......

public class FilterViewModel
{
    public string Type { get; set; }
    public ObservableCollection<string> Values { get; set; }
}

public class ResearchLanguageViewModel
{
    public int FirmCount { get; set; }
    public ObservableCollection<FilterViewModel> Filters { get; set; } 
}

我使用INotifyPropertyChanged等进行绑定设置......一切正常。我的最后一个问题是在第一个选项卡中滚动TabItem内容。要求仅调用具有溢出内容的选项卡以滚动而不是整个选项卡控件。即 - 选项卡标题应该仍然可见,包括选项卡控件本身上方的控件,滚动条应显示在Tab1的TabItem区域的里面。我玩了好几个小时都无济于事。我在这里显然做错了,可以使用一些帮助。

更详细一点:在Values集合上的CheckBox(es)/ ItemControls上的绑定可以有超过200到500个控件,从而导致一切都被淘汰出局。

1 个答案:

答案 0 :(得分:0)

您可以使用Grid容器代替StackPanel,我试图为您制作样本

样品

        <ScrollViewer Name="ScrollViewer1"
                      HorizontalScrollBarVisibility="Auto"
                      VerticalScrollBarVisibility="Auto">
            <Grid Name="Tab1StackPanel">
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="auto" />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <TextBlock FontSize="24"
                           FontWeight="Bold"
                           Foreground="DarkSlateGray"
                           FontStyle="Normal">
                    Filters
                </TextBlock>
                <Button x:Name="ClearFiltersButton"
                        Grid.Row="1"
                        Background="DarkRed"
                        Foreground="White"
                        FontSize="20"
                        FontWeight="Bold"
                        MaxWidth="124"
                        HorizontalAlignment="Left">
                    Clear Filters
                </Button>
                <StackPanel Orientation="Horizontal"
                            Grid.Row="2">
                    <TextBlock>
                        <Run>Total Paragraphs </Run><Run Text="{Binding ResearchLanguageViewModel.TotalCount}"></Run>
                    </TextBlock>
                </StackPanel>
                <ItemsControl ItemsSource="{Binding ResearchLanguageViewModel.Filters, Mode=OneWay}" 
                              Grid.Row="3">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <TextBlock Text="{Binding Path=Type}"></TextBlock>
                                <TextBox Text="Search...."></TextBox>
                                <ItemsControl ItemsSource="{Binding Path=Values, Mode=OneWay}">
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <CheckBox Content="{Binding Mode=OneWay}"></CheckBox>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                            </StackPanel>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </Grid>
        </ScrollViewer>

具有自动高度行定义的网格与堆栈面板的行为相同,除了最后一个占用剩余空间的网格。

我们可以进一步调整以符合确切的需求