WPF ScrollViewer没有“条”,只有左右两个按钮

时间:2018-10-04 13:39:53

标签: c# wpf

如何实现拥有TabControl的选项卡在ScrollViewer中可滚动但没有滚动查看器的“栏”以及围绕选项卡的导航按钮的实现。就像互联网浏览器一样

enter image description here

我在如下所示的scrollviewer中添加了选项卡,但我不知道是否可以根据我的需要自定义滚动查看器。

<ScrollViewer 
    HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"
    Grid.Row="0" Grid.Column="1">
    <TabPanel 
        Panel.ZIndex ="1" 
        KeyboardNavigation.TabIndex="1"
        Margin="2,2,2,0"
        IsItemsHost="true"/>

1 个答案:

答案 0 :(得分:1)

您可以尝试this或下面的代码。 该代码不是我的,我只是从here复制而来的,但是我认为这是您正在寻找的代码。

<TabControl x:Name="myTab" >
<TabControl.Resources>
    <LinearGradientBrush x:Key="TabItemDefaultBackgroundBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Offset="0.0" Color="#FFF" />
                <GradientStop Offset="1.0" Color="#EEE" />
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />
    <SolidColorBrush x:Key="TabItemSelectBackgroundBrush" Color="#AAA" />
    <SolidColorBrush x:Key="TabItemMouseoverBrush" Color="#BBB" />

    <SolidColorBrush x:Key="CloseButtenBackgroundBrush" Color="#169" />
    <SolidColorBrush x:Key="CloseButtenMouseoverBrush" Color="#E5E" />
    <SolidColorBrush x:Key="CloseButtenPressBrush" Color="#E0E" />
    <Style TargetType="{x:Type TabItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border
                            Name="tabBorder"
                            MinWidth="100"
                            MinHeight="30"
                            Margin="0,0,20,0"
                            Background="{StaticResource TabItemDefaultBackgroundBrush}"
                            BorderBrush="{StaticResource SolidBorderBrush}"
                            BorderThickness="1"
                            CornerRadius="3,15,0,0">
                            <Grid>
                                <Button
                                    x:Name="tabButton"
                                    Width="15"
                                    Height="15"
                                    Margin="90,10,0,0"
                                    Click="tabButton_Click"
                                    Visibility="Hidden">
                                    <Button.Template>
                                        <ControlTemplate TargetType="{x:Type Button}">
                                            <Grid>
                                                <Grid.Background>
                                                    <VisualBrush Viewbox="0,0,1024,1024" ViewboxUnits="Absolute">
                                                        <VisualBrush.Visual>
                                                            <Path
                                                                x:Name="mypath"
                                                                Data="M509.953388 63.243393c-246.709915 0-446.708971 200.00008-446.708971 446.708971 0 246.711961 200.00008 446.708971 446.708971 446.708971 246.711961 0 446.708971-199.998033 446.708971-446.708971C956.662359 263.243473 756.664326 63.243393 509.953388 63.243393zM735.3683 670.450778c17.933441 17.933441 17.933441 46.984081 0 64.917522-8.965186 8.965186-20.712741 13.44829-32.456203 13.44829-11.746532 0-23.493064-4.483104-32.459273-13.44829L509.953388 574.868863 349.455997 735.3683c-8.968256 8.965186-20.712741 13.44829-32.459273 13.44829s-23.493064-4.483104-32.459273-13.44829c-17.933441-17.933441-17.933441-46.984081 0-64.917522l160.499437-160.497391L284.537452 349.452927c-17.933441-17.933441-17.933441-46.984081 0-64.917522 17.933441-17.931395 46.984081-17.931395 64.917522 0l160.497391 160.499437 160.499437-160.499437c17.931395-17.931395 46.984081-17.931395 64.915475 0 17.933441 17.933441 17.933441 46.984081 0 64.917522L574.87091 509.953388 735.3683 670.450778z"
                                                                Fill="{StaticResource CloseButtenBackgroundBrush}" />
                                                        </VisualBrush.Visual>
                                                    </VisualBrush>
                                                </Grid.Background>
                                                <ContentPresenter
                                                    Margin="{TemplateBinding Padding}"
                                                    HorizontalAlignment="Center"
                                                    VerticalAlignment="Center" />
                                            </Grid>
                                            <ControlTemplate.Triggers>
                                                <Trigger Property="IsMouseOver" Value="true">
                                                    <Setter TargetName="mypath" Property="Fill" Value="{StaticResource CloseButtenMouseoverBrush}" />
                                                </Trigger>
                                                <Trigger Property="IsPressed" Value="true">
                                                    <Setter TargetName="mypath" Property="Fill" Value="{StaticResource CloseButtenPressBrush}" />

                                                </Trigger>
                                            </ControlTemplate.Triggers>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                                <ContentPresenter
                                    x:Name="ContentSite"
                                    Margin="12,2,12,2"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    ContentSource="Header"
                                    RecognizesAccessKey="True" />
                            </Grid>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="tabBorder" Property="Background" Value="{StaticResource TabItemSelectBackgroundBrush}" />
                            <Setter TargetName="tabBorder" Property="BorderThickness" Value="2" />
                            <Setter TargetName="tabButton" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="tabBorder" Property="Background" Value="{StaticResource TabItemMouseoverBrush}" />
                            <Setter TargetName="tabBorder" Property="BorderThickness" Value="2" />
                            <Setter TargetName="tabButton" Property="Visibility" Value="Visible" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ScrolltoLeft" TargetType="{x:Type RepeatButton}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border
                        x:Name="border"
                        Background="Transparent"
                        BorderBrush="Gray"
                        BorderThickness="0"
                        CornerRadius="0"
                        TextBlock.Foreground="White">
                        <Grid>
                            <Viewbox Margin="-5,-2,0,0">
                                <Path
                                    x:Name="BPath"
                                    Data="M269.6 535.8l462.9 319.3c30.6 21.1 72.3-0.8 72.3-38V177.5c0-34.1-38.2-54.2-66.3-34.8L269.6 466.2c-24.3 16.8-24.3 52.8 0 69.6z"
                                    Fill="Gray" />
                            </Viewbox>
                            <ContentPresenter
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center" />
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="BPath" Property="Fill" Value="Green" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter TargetName="BPath" Property="Fill" Value="{StaticResource CloseButtenPressBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ScrolltoRight" TargetType="{x:Type RepeatButton}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border
                        x:Name="border"
                        Background="Transparent"
                        BorderBrush="Gray"
                        BorderThickness="0"
                        CornerRadius="0"
                        TextBlock.Foreground="White">
                        <Grid>
                            <Viewbox Margin="-5,-2,0,0">
                                <Path
                                    x:Name="BPath"
                                    Data="M767.6 547.8L304.7 867.1c-30.6 21.1-72.3-0.8-72.3-38V189.5c0-34.1 38.2-54.2 66.3-34.8l468.9 323.5c24.3 16.8 24.3 52.8 0 69.6z"
                                    Fill="Gray" />
                            </Viewbox>
                            <ContentPresenter
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center" />
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="BPath" Property="Fill" Value="Green" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter TargetName="BPath" Property="Fill" Value="{StaticResource CloseButtenPressBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TabControl.Resources>

<TabControl.Template>
    <ControlTemplate TargetType="TabControl">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="30" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="30" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <RepeatButton
                x:Name="ScrolltoLeft_Btn"
                Grid.Row="0"
                Grid.Column="0"
                VerticalAlignment="Top"
                Command="{x:Static ScrollBar.LineLeftCommand}"
                CommandTarget="{Binding ElementName=sv}"
                Style="{StaticResource ScrolltoLeft}" />

            <ScrollViewer
                x:Name="sv"
                Grid.Row="0"
                Grid.Column="1"
                HorizontalScrollBarVisibility="Hidden"
                PreviewMouseWheel="ScrollViewer_PreviewMouseWheel"
                VerticalScrollBarVisibility="Disabled">
                <TabPanel
                    x:Name="HeaderPanel"
                    Panel.ZIndex="1"
                    IsItemsHost="true"
                    KeyboardNavigation.TabIndex="1" />
            </ScrollViewer>
            <ContentPresenter
                x:Name="PART_SelectedContentHost"
                Grid.Row="1"
                Grid.ColumnSpan="2"
                Grid.Column="0"
                Margin="{TemplateBinding Padding}"
                ContentSource="SelectedContent"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />

            <RepeatButton
                x:Name="ScrolltoRight_Btn"
                Grid.Row="0"
                Grid.Column="2"
                VerticalAlignment="Top"
                Command="{x:Static ScrollBar.LineRightCommand}"
                CommandTarget="{Binding ElementName=sv}"
                Style="{StaticResource ScrolltoRight}" />
        </Grid>
    </ControlTemplate>
</TabControl.Template>

<TabItem Background="AliceBlue" Header="test1" >
    <Label Content="test1 Content goes here..." />
</TabItem>
<TabItem Background="AliceBlue" Header="test2" >
    <Label Content="test2 Content goes here..." />
</TabItem>
<TabItem Background="AliceBlue" Header="test3" >
    <Label Content="test3 Content goes here..." />
</TabItem>
<TabItem Header="test4" />
<TabItem Header="test5" />
<TabItem Header="test6" />
<TabItem Header="test7" />
<TabItem Header="test8" />
<TabItem Header="test9" />
<TabItem Header="test10" />
<TabItem Header="test11" />
<TabItem Header="test12" />
<TabItem Header="test13" />
<TabItem Header="test14" />

private void tabButton_Click(object sender, RoutedEventArgs e)
    {
        Button b = sender as Button;
        TabItem item = FindParent<TabItem>(b);
        myTab.Items.Remove(item);
    }
    public  T FindParent<T>(DependencyObject child) where T : DependencyObject
    {
        //get parent item
        DependencyObject parentObject = VisualTreeHelper.GetParent(child);

        //we've reached the end of the tree
        if (parentObject == null) return null;

        //check if the parent matches the type we're looking for
        T parent = parentObject as T;
        if (parent != null)
            return parent;
        else
            return FindParent<T>(parentObject);
    }

    private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
    {
        ScrollViewer scrollviewer = sender as ScrollViewer;
        if (e.Delta > 0)
            scrollviewer.LineLeft();
        else
            scrollviewer.LineRight();
        e.Handled = true;
    }