views:

184

answers:

1

Hi I would like to customize the scrollbars of a listbox's scrollviewer in such a way that the scrollbar only consists of a RepeatButton for scrolling up and a Repeatbutton for scrolling down. Nothing else. There should be no scrollbar (track) between the buttons. One button should be to the left of the ItemsPanel (scroll up) and the other on the right of the ItemsPanel.

Is that possible?

A: 

I made a Vertical scrollbar with only repeat buttons and pls have look.

        <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>
Kishore Kumar