【问题标题】:Scrolling for WPF TabItems (not entire TabControl)滚动 WPF TabItems(不是整个 TabControl)
【发布时间】:2014-08-05 04:26:44
【问题描述】:

我有以下 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 内容的滚动。要求仅滚动具有溢出内容的选项卡,而不是滚动整个选项卡控件。 IE。 - 选项卡标题应该仍然可见,包括选项卡控件本身上方的控件,并且滚动条应该出现在 Tab1 的 TabItem 区域的内部。我已经玩了几个小时无济于事。我显然在这里做错了什么,可以使用一些帮助。

更详细一点:Values 集合上的 CheckBox(es)/ItemControls 上的绑定可以有 200 到 500 个控件,因此会导致所有内容都变得异常。

【问题讨论】:

  • A TabItem 指的是选项卡标题和内容,所以为了澄清,您想要滚动内容。请指教。
  • 是的,我想滚动仅包含复选框的区域(内容)。选项卡标题等......都应该单独留下。但是 StackPanel 及其所有子项都应该是可滚动的。从 ScrollViewer 向下。
  • 您现有的代码 sn-p 是正确的,并且可以按预期工作。那么您面临的具体问题是什么?
  • 这对我不起作用。要提到的另一件事是,它位于 VSTO 任务窗格内。也许这就是问题所在。我看到的问题是右侧的滚动条滚动 UserControl 中的所有内容。当只有 StackPanel 中的内容应该滚动时。当我检查堆栈面板的尺寸时,它们从 500 像素变为 ~5000 像素。
  • 据我所知,滚动条是由 UserControl 而不是 ScrollViewer 生成的。如果我删除 ScrollViewer 控件,滚动条在加载复选框后仍会出现

标签: c# .net wpf xaml vsto


【解决方案1】:

您可以使用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>

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

我们可以进一步调整它以满足确切的需求

【讨论】:

  • 奇怪,结果还是一样...如果我在网格上设置了最大高度,则溢出是不可查看/可滚动的
  • grid 将从其容器中获取高度,因此不需要显式设置。用户控件是否放置在另一个堆栈面板内?您是否可以发布可以重现该问题的应用程序的工作示例?
  • 我会尽快发布样本
猜你喜欢
  • 2011-04-08
  • 1970-01-01
  • 2011-02-09
  • 1970-01-01
  • 2012-01-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多