Public Access
Sit UNLOCK's word in the middle of the button it is drawn on
A button's content alignment defaults to Stretch and the Fluent template binds it straight through, so a text block filling a 48-pixel button draws its line along the top edge of it rather than across the middle. That is why all seven button classes in Phone.axaml set VerticalContentAlignment, and it is why this one did not: the lock screen is the only place on the phone whose buttons carry their own metrics rather than a class, and it was written with the horizontal half of the pair and not the vertical. Its two neighbours are unaffected and not for the same reason, which is worth knowing before this is read as a pattern: RESET has no fixed height and a symmetric vertical padding, and the fingerprint button's content is a panel that stretches and centres its own children. Only the one with a bare string in a fixed-height box shows it. Left as its own set of metrics rather than folded into Button.primary, which it otherwise duplicates down to the font weight. The two differ in corner radius — 6 here against the 9 the v2 ladder gives a button — and changing that is a design decision rather than a fix to the thing that was reported.
This commit is contained in:
@@ -60,8 +60,16 @@
|
|||||||
</TextBox.KeyBindings>
|
</TextBox.KeyBindings>
|
||||||
</TextBox>
|
</TextBox>
|
||||||
|
|
||||||
|
<!--
|
||||||
|
VerticalContentAlignment is not decoration and not a duplicate of the line above it. A button's
|
||||||
|
content alignment defaults to Stretch and the Fluent template binds it straight through, so the
|
||||||
|
text block filling a 48-pixel button draws its line at the top of it. Every button class in
|
||||||
|
Phone.axaml sets this; the three on this screen are the only ones on the phone that carry their
|
||||||
|
own metrics instead, which is how this one came to sit high in its box.
|
||||||
|
-->
|
||||||
<Button Content="UNLOCK" Command="{Binding UnlockCommand}" IsEnabled="{Binding !IsBusy}"
|
<Button Content="UNLOCK" Command="{Binding UnlockCommand}" IsEnabled="{Binding !IsBusy}"
|
||||||
Height="48" Margin="0,10,0,0" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center"
|
Height="48" Margin="0,10,0,0" HorizontalAlignment="Stretch"
|
||||||
|
HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
|
||||||
Background="{StaticResource Accent}" Foreground="{StaticResource AccentInk}"
|
Background="{StaticResource Accent}" Foreground="{StaticResource AccentInk}"
|
||||||
CornerRadius="6" FontFamily="{StaticResource MonoFont}" FontSize="12" FontWeight="SemiBold" />
|
CornerRadius="6" FontFamily="{StaticResource MonoFont}" FontSize="12" FontWeight="SemiBold" />
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user