lepoco / lepoco/wpfui

UiTextBox and ComboBox ignore Width when HorizontalAlignment is set

Open
#1,318 0 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
C#
Stars
9.6k
Forks
1k
PR merge metrics
No merged PRs in 30d

Description

Describe the bug

For at least two controls I've noticed, if you set the Width property (in XAML), and also set the HorizontalAlignment property, Width will be ignored.

To Reproduce
  1. Create a simple XAML page with a Grid.
  2. Set the Width of the Page or Grid to have excess space (stretch to take up the whole page)
  3. Add a UITextBox or ComboBox control, and set the Width as well as HorizontalAlignment:
    <ui:TextBox Grid.Column="1" Grid.Row="1" Text="SomeText" Width="250" HorizontalAlignment="Left"/>

Run the app and display the page

Expected behavior

Expected: The UiTextBox or ComboBox will be the requested Width and be aligned to the left side of the containing grid.
Actual: The control is aligned to the Left but is much smaller than the set Width.
Note: You can see the problem in design mode as well, in Visual Studio 2022. Remove the HorizontalAlignment property setter and then Width is correct.

Screenshots

No response

OS version

Windows 11

.NET version

.Net 9.0

WPF-UI NuGet version

3.0.5

Additional context

The issue can be resolved by modifying the source's original Style. In the case of a TextBox, the DefaultTextBoxStyle defined in TextBox.xaml:
... <Setter Property="SnapsToDevicePixels" Value="True" /> <Setter Property="OverridesDefaultStyle" Value="True" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type TextBox}"> <Grid HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}"> <!--- TO FIX: remove the HorizontalAlignment and VerticalAlignment setters: <Grid> --> <Border x:Name="ContentBorder" MinWidth="{TemplateBinding MinWidth}" ...

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the layout in a WPF XAML page, then inspect the DefaultTextBoxStyle in TextBox.xaml and the corresponding ComboBox style. Verify that removing the template Grid's alignment bindings makes the requested Width work with HorizontalAlignment, and confirm the behavior for both controls in the sample layout.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
desktop
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.