Skip to content

Bug: Title text slightly moves up without actionable contents in narrow width #219

New issue
New issue
Closed
Closed
Bug: Title text slightly moves up without actionable contents in narrow width#219
Assignees
niels9001
@0x5bfa

Description

@0x5bfa
0x5bfa
opened on Sep 6, 2023

Describe the bug

As @leoshusar said before, title text moves up without contents, or contents moves down without title text. Refer to the screenshots section

You should add Visibility=Collapsed to both of Contents content presenter and Title content presenter change the visibility state when the value is set (OnContentChanged and OnHeaderChanged).

Windows/components/SettingsControls/src/SettingsCard/SettingsCard.xaml

Lines 392 to 433 in a79f452

<StackPanel x:Name="HeaderPanel"
Grid.Column="1"
Margin="0,0,24,0"
VerticalAlignment="Center"
Orientation="Vertical">
<ContentPresenter x:Name="PART_HeaderPresenter"
Grid.Column="1"
HorizontalAlignment="Left"
win:HighContrastAdjustment="None"
Content="{TemplateBinding Header}"
TextWrapping="Wrap" />
<ContentPresenter x:Name="PART_DescriptionPresenter"
Content="{TemplateBinding Description}"
FontSize="{ThemeResource SettingsCardDescriptionFontSize}"
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
TextWrapping="Wrap">
<ContentPresenter.Resources>
<Style BasedOn="{StaticResource CaptionTextBlockStyle}"
TargetType="TextBlock">
<Style.Setters>
<Setter Property="TextWrapping" Value="Wrap" />
</Style.Setters>
</Style>
<Style BasedOn="{StaticResource DefaultHyperlinkButtonStyle}"
TargetType="HyperlinkButton">
<Style.Setters>
<Setter Property="FontSize" Value="{ThemeResource SettingsCardDescriptionFontSize}" />
<Setter Property="Padding" Value="0,0,0,-1" />
<Setter Property="FontWeight" Value="SemiBold" />
</Style.Setters>
</Style>
<Style TargetType="Hyperlink">
<Style.Setters>
<Setter Property="UnderlineStyle" Value="None" />
<Setter Property="TextDecorations" Value="None" />
<Setter Property="FontWeight" Value="SemiBold" />
</Style.Setters>
</Style>
</ContentPresenter.Resources>
</ContentPresenter>
</StackPanel>

Windows/components/SettingsControls/src/SettingsCard/SettingsCard.xaml

Lines 435 to 440 in a79f452

<ContentPresenter x:Name="PART_ContentPresenter"
Grid.Column="2"
HorizontalAlignment="Right"
VerticalAlignment="Center"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
Content="{TemplateBinding Content}" />

This margin is the cause of this bug.

Windows/components/SettingsControls/src/SettingsCard/SettingsCard.xaml

Line 109 in a79f452

<Thickness x:Key="SettingsCardVerticalHeaderContentSpacing">0,8,0,0</Thickness>

Steps to reproduce

1. Add SettingsCard without contents.
2. Make control narrower.
3. See what's happening.

Expected behavior

Do not move up or down.
Be fixed on the same place.

Screenshots

image

image

Code Platform

  • UWP
  • WinAppSDK / WinUI 3
  • Web Assembly (WASM)
  • Android
  • iOS
  • MacOS
  • Linux / GTK

Windows Build Number

  • Windows 10 1809 (Build 17763)
  • Windows 10 1903 (Build 18362)
  • Windows 10 1909 (Build 18363)
  • Windows 10 2004 (Build 19041)
  • Windows 10 20H2 (Build 19042)
  • Windows 10 21H1 (Build 19043)
  • Windows 11 21H2 (Build 22000)
  • Other (specify)

Other Windows Build number

No response

App minimum and target SDK version

  • Windows 10, version 1809 (Build 17763)
  • Windows 10, version 1903 (Build 18362)
  • Windows 10, version 1909 (Build 18363)
  • Windows 10, version 2004 (Build 19041)
  • Other (specify)

Other SDK version

No response

Visual Studio Version

Preview

Visual Studio Build Number

No response

Device form factor

No response

Additional context

No response

Help us help you

No, I'm unable to contribute a solution.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

Toolkit 8.x

Status

✅ Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions