Question

我想自定义列表框滚动查看器的滚动条，使滚动条只包含一个用于向上滚动的RepeatButton和一个用于向下滚动的Repeatbutton。没有其他的。按钮之间不应该有滚动条（轨道）。一个按钮应位于ItemsPanel的左侧（向上滚动），另一个按钮位于ItemsPanel的右侧。

这可能吗？

Answer 1

我制作了一个只有重复按钮的垂直滚动条，请看看。

        <LinearGradientBrush x:Key="VerticalScrollBarBackground" EndPoint="1,0" StartPoint="0,0">
        <GradientStop Color="#E1E1E1" Offset="0"/>
        <GradientStop Color="#EDEDED" Offset="0.20"/>
        <GradientStop Color="#EDEDED" Offset="0.80"/>
        <GradientStop Color="#E3E3E3" Offset="1"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="ScrollBarDisabledBackground" Color="#F4F4F4"/>
    <Style x:Key="ScrollBarButton" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="IsTabStop" Value="false"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Rectangle Fill="White" Stroke="Black"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
            <Style x:Key="RepeatButtonStyle3" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="IsTabStop" Value="false"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Grid>
                        <Rectangle Fill="#FF9A2323" Stroke="#FF9B6363" StrokeThickness="2" RadiusX="2" RadiusY="2"/>
                        <Path Fill="#FF9A2323" Stretch="Fill" Stroke="#FF9B6363" StrokeThickness="1" Margin="6.619,5.209,4.317,2.207" RenderTransformOrigin="0.5,0.5" Data="M0.41792299,0.01261113 L10.7483,1.9116925 -0.026186385,10.702906 z">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform/>
                                    <SkewTransform/>
                                    <RotateTransform Angle="38.198"/>
                                    <TranslateTransform X="-0.74530940575247584" Y="-0.07455335808536212"/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="RepeatButtonStyle4" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="IsTabStop" Value="false"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Grid>
                        <Rectangle Fill="#FF9A2323" Stroke="#FF9B6363" StrokeThickness="2" RadiusX="2" RadiusY="2"/>
                        <Path Fill="#FF9A2323" Stretch="Fill" Stroke="#FF9B6363" StrokeThickness="1" Margin="6.119,2.209,4.817,5.207" Data="M0.41792299,0.01261113 L10.7483,1.9116925 -0.026186385,10.702906 z" RenderTransformOrigin="0.5,0.5">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform/>
                                    <SkewTransform/>
                                    <RotateTransform Angle="216.44"/>
                                    <TranslateTransform X="-0.74530940575247584" Y="-0.07455335808536212"/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

<Style  TargetType="{x:Type ScrollBar}">
        <Setter Property="Background" Value="{StaticResource VerticalScrollBarBackground}"/>
        <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
        <Setter Property="Stylus.IsFlicksEnabled" Value="false"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Width" Value="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}"/>
        <Setter Property="MinWidth" Value="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ScrollBar}">
                    <Grid x:Name="Bg" SnapsToDevicePixels="true">
                        <Grid.RowDefinitions>
                            <RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}"/>
                            <RowDefinition Height="0.00001*"/>
                            <RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}"/>
                        </Grid.RowDefinitions>
                        <RepeatButton Style="{DynamicResource RepeatButtonStyle3}" IsEnabled="{TemplateBinding IsMouseOver}"  Command="{x:Static ScrollBar.LineUpCommand}"/>
                        <Track x:Name="PART_Track" IsEnabled="{TemplateBinding IsMouseOver}" Grid.Row="1" IsDirectionReversed="true" Visibility="Visible">

                        </Track>
                        <RepeatButton Style="{DynamicResource RepeatButtonStyle4}" IsEnabled="{TemplateBinding IsMouseOver}" Grid.Row="2"  Command="{x:Static ScrollBar.LineDownCommand}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Background" TargetName="Bg" Value="{StaticResource ScrollBarDisabledBackground}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

    </Style>

WPF ListBox的scrollviewer可自定义，因此没有Scrollbar，只有RepeatButtons

1 个答案: