как исправить «Ползунок начального и конечного положения без пробелов» в UWP

Question

В UWP ползунки-слайдеры занимают дополнительное место от начала и до конца. Я хочу, чтобы он был выровнен с начальным и конечным краем ползунка. как исправить «Ползунок начального и конечного положения без пробелов» в UWP?

Установить ползунок с частотой TickFrequency в xaml. В TickBar Grid.ColumnSpan = "3" Grid.RowSpan = "3".

in xaml:
<Slider Style="{StaticResource CustomSlider}" 
    RelativePanel.Below="NarrowText"
    Width="404"
    HorizontalAlignment="Left"
    VerticalAlignment="Stretch"
    Minimum="0"
    Maximum="3"
    TickFrequency="1"
    TickPlacement="Outside"
    ValueChanged="Slider_ValueChanged"
    Value="{x:Bind _viewModel.SliderValue, Mode=TwoWay}">
</Slider>

in style:
<TickBar 
    x:Name="TopTickBar" 
    Grid.ColumnSpan="3" 
    Grid.RowSpan="3" 
    Fill="{ThemeResource SliderTickBarFill}" 
    Height="14" 
    HorizontalAlignment="Stretch"  
    VerticalAlignment="Center" 
    Visibility="Visible"
/>

Я хочу, чтобы начальный и конечный края ползунка были выровнены (в одной позиции) с полоской (прямоугольник).

Применение поля в TickBar вызывает несовпадение выравнивания с большим пальцем. Большой палец в 1-й позиции Большой палец в 2-й позиции Большой палец в 3-й позиции Большой палец в 4-й позиции

Answer 1

как исправить начальное и конечное положение тика ползунка без пробелов в UWP

Если вы хотите исправить начальное и конечное положение тика ползунка без пробелов, вам необходимопереписать стиль ползунка и отредактировать поля TopTickBar, BottomTickBar, HorizontalInlineTickBar, см. следующий сегмент стиля.

<TickBar x:Name="TopTickBar"
Visibility="Collapsed"
Fill="{ThemeResource SliderTickBarFill}"
Height="{ThemeResource SliderOutsideTickBarThemeHeight}"
VerticalAlignment="Bottom"
Margin="-4,0,-4,4"
Grid.ColumnSpan="3" />
<TickBar x:Name="HorizontalInlineTickBar"
Visibility="Collapsed"
Fill="{ThemeResource SliderInlineTickBarFill}"
Height="{ThemeResource SliderTrackThemeHeight}"
Grid.Row="1"
Margin="-4,0,-4,0"
Grid.ColumnSpan="3" />
<TickBar x:Name="BottomTickBar"
Visibility="Collapsed"
Fill="{ThemeResource SliderTickBarFill}"
Height="{ThemeResource SliderOutsideTickBarThemeHeight}"
VerticalAlignment="Top"
Margin="-4,4,-4,0"
Grid.Row="2"
Grid.ColumnSpan="3" />

И для вашего сценария вы можете изменить только стиль TopTickBar, например:последующие

<TickBar x:Name="TopTickBar"
Visibility="Collapsed"
Fill="{ThemeResource SliderTickBarFill}"
Height="14"
VerticalAlignment="Bottom"
Margin="-4,0,-4,-8"
Grid.ColumnSpan="3" />