Qfyilyi

I would like to change the size of the RepeatButton UP and DOWN of a ScrollViewer, to get a touchable size on industrial touch panels.

How can I access these properties?

I was able to change the size of the ScrollViewer globally within a ResourceDictionary like this:

<Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">

<Setter Property="Stylus.IsFlicksEnabled" Value="True" />

<Style.Triggers>

    <Trigger Property="Orientation" Value="Horizontal">

        <Setter Property="Height" Value="{StaticResource widthScrollbarNormal}" />

        <Setter Property="MinHeight" Value="{StaticResource widthScrollbarNormal}" />

    </Trigger>

    <Trigger Property="Orientation" Value="Vertical">

        <Setter Property="Width" Value="{StaticResource widthScrollbarNormal}" />

        <Setter Property="MinWidth" Value="{StaticResource widthScrollbarNormal}" />

    </Trigger>

</Style.Triggers>

But I cannot find the way to change the RepeatButton size.

Thanks

In yout view, in case if is datagrid, add this resource:

<DataGrid.Resources>

     <Style TargetType="{x:Type ScrollBarStyle}" BasedOn="{StaticResource ScrollBarStyle}"/>

 </DataGrid.Resources>

Then create all of this styles in styles file (if you don't have it, check how you can create and use one!!):
(add the normal one, the horizontal and the vertical!

Normal:

<!--scroll bar style (normal/large one)-->

    <Style x:Key="ScrollBarStyle" TargetType="{x:Type ScrollBar}">

        <Setter Property="SnapsToDevicePixels" Value="True"/>

        <Setter Property="OverridesDefaultStyle" Value="true"/>

        <Style.Triggers>

            <Trigger Property="Orientation" Value="Horizontal">

                <Setter Property="Width" Value="Auto"/>

                <Setter Property="Height" Value="30"/>

                <Setter Property="MinHeight" Value="0"/>

                <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}" />

            </Trigger>

            <Trigger Property="Orientation" Value="Vertical">

                <Setter Property="Width" Value="30"/>

                <Setter Property="MinWidth" Value="0"/>

                <Setter Property="Height" Value="Auto" />

                <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" />

            </Trigger>

        </Style.Triggers>

    </Style>

And for horizontal:

 <!--horizontal scrollbar itself template (normal)-->

    <ControlTemplate x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}">

        <Grid >

            <Grid.ColumnDefinitions>

                <ColumnDefinition MaxWidth="30"/>

                <ColumnDefinition Width="0.00001*"/>

                <ColumnDefinition MaxWidth="30"/>

            </Grid.ColumnDefinitions>

            <Border

                  Grid.ColumnSpan="3"

                  CornerRadius="0" 

                  Background="#F0F0F0" />

            <RepeatButton 

                  Grid.Column="0"                           

                  Style="{StaticResource ScrollBarLineButton}"

                  Width="Auto"

                  Command="ScrollBar.LineLeftCommand"

                  Content="M 4 0 L 4 8 L 0 4 Z" />

            <Track 

                  Name="PART_Track"

                  Grid.Column="1"

                  IsDirectionReversed="False">

                <Track.DecreaseRepeatButton>

                    <RepeatButton 

                          Style="{StaticResource ScrollBarPageButton}"

                          Command="ScrollBar.PageLeftCommand" />

                </Track.DecreaseRepeatButton>

                <Track.Thumb>

                    <Thumb 

                          Style="{StaticResource ScrollBarThumb}" 

                          Margin="1,0,1,0"  

                          Background="{DynamicResource NormalBrush}"

                          BorderBrush="Transparent" />

                </Track.Thumb>

                <Track.IncreaseRepeatButton>

                    <RepeatButton 

                          Style="{StaticResource ScrollBarPageButton}"

                          Command="ScrollBar.PageRightCommand" />

                </Track.IncreaseRepeatButton>

            </Track>

            <RepeatButton 

                  Grid.Column="3" 

                  Style="{StaticResource ScrollBarLineButton}"

                  Width="Auto"

                  Command="ScrollBar.LineRightCommand"

                  Content="M 0 0 L 4 4 L 0 8 Z"/>

        </Grid>

    </ControlTemplate>

And for vertical:

 <!--vertical scrollbar itself template (normal)-->

    <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}">

        <Grid >

            <Grid.RowDefinitions>

                <RowDefinition MaxHeight="30"/>

                <RowDefinition Height="0.00001*"/>

                <RowDefinition MaxHeight="30"/>

            </Grid.RowDefinitions>

            <Border

                  Grid.RowSpan="3"

                  CornerRadius="0" 

                  Background="#F0F0F0" />

            <RepeatButton 

                  Grid.Row="0"                           

                  Style="{StaticResource ScrollBarLineButton}"

                  Height="Auto"

                  Command="ScrollBar.LineUpCommand"

                  Content="M 0 4 L 8 4 L 4 0 Z" />

            <Track 

                  Name="PART_Track"

                  Grid.Row="1"

                  IsDirectionReversed="true">

                <Track.DecreaseRepeatButton>

                    <RepeatButton 

                          Style="{StaticResource ScrollBarPageButton}"

                          Command="ScrollBar.PageUpCommand" />

                </Track.DecreaseRepeatButton>

                <Track.Thumb>

                    <Thumb 

                          Style="{StaticResource ScrollBarThumb}" 

                          Margin="0,1,0,1"  

                          Background="{DynamicResource NormalBrush}"

                          BorderBrush="Transparent" />

                </Track.Thumb>

                <Track.IncreaseRepeatButton>

                    <RepeatButton 

                          Style="{StaticResource ScrollBarPageButton}"

                          Command="ScrollBar.PageDownCommand" />

                </Track.IncreaseRepeatButton>

            </Track>

            <RepeatButton 

                  Grid.Row="3" 

                  Style="{StaticResource ScrollBarLineButton}"

                  Height="Auto"

                  Command="ScrollBar.LineDownCommand"

                  Content="M 0 0 L 4 4 L 8 0 Z"/>

        </Grid>

    </ControlTemplate>