Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

OutlinedRevealPasswordBox's reveal icon not vertically centered #3440

Closed
9helix opened this issue Jan 22, 2024 · 1 comment
Closed

OutlinedRevealPasswordBox's reveal icon not vertically centered #3440

9helix opened this issue Jan 22, 2024 · 1 comment
Labels
bug demo app Items that relate to the demo application
Milestone

Comments

@9helix
Copy link

9helix commented Jan 22, 2024

Bug explanation

I noticed that in the demo app 4.9.0 the reveal icon is correctly aligned with the text inside the box for all passwordboxes except for the OutlinedRevealPasswordBox. It looks like this.
image

That same alignment is also on the clear button.
Is there going to be a fix for this?
In #2812 I saw the workaround, but it is not working for me. Here is how I implemented it in my code:

                <PasswordBox VerticalAlignment="Center" materialDesign:TextFieldAssist.HasClearButton="True" FontSize="15" Style="{StaticResource MaterialDesignOutlinedRevealPasswordBox}">
                    <PasswordBox.Resources>
                        <Style TargetType="materialDesign:PackIcon" BasedOn="{StaticResource {x:Type materialDesign:PackIcon}}">
                            <Setter Property="VerticalAlignment" Value="Center" />
                        </Style>
                    </PasswordBox.Resources>
                    <materialDesign:HintAssist.Hint>
                        <!--some controls-->
                    </materialDesign:HintAssist.Hint>
                </PasswordBox>

Am I missing something?

Version

4.9.0

@9helix 9helix added bug evaluation required Items is pending review or evaluation by the team labels Jan 22, 2024
@9helix 9helix changed the title OutlinedRevealPasswordBox reveal icon off the center OutlinedRevealPasswordBox's reveal icon not vertically centered Jan 22, 2024
@JLdgu
Copy link
Contributor

JLdgu commented Feb 3, 2024

This is not actually a bug but an 'Optical illussion' feature brought to you by Mk I Eye Ball Inc.

image

There is a single pixel gap above each fuchsia line in the included image, edited from the original included with this issue.

That said you can get the effect you want by adjusting the VerticalContentAligment of the PasswordBox, not the VerticalAligment of the PackIcon.

<PasswordBox materialDesign:HintAssist.HelperText="Not bound password"
             materialDesign:HintAssist.Hint="Password"
             materialDesign:TextFieldAssist.HasClearButton="True"
             IsEnabled="{Binding ElementName=RevealPasswordOutlinedEnabled, Path=IsChecked}"
             Style="{StaticResource MaterialDesignOutlinedRevealPasswordBox}"
             VerticalContentAlignment="Bottom"/>

image

@Keboo Keboo added demo app Items that relate to the demo application and removed evaluation required Items is pending review or evaluation by the team labels Feb 8, 2024
@Keboo Keboo added this to the 5.0.0 milestone Feb 8, 2024
@Keboo Keboo closed this as completed Feb 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug demo app Items that relate to the demo application
Projects
None yet
Development

No branches or pull requests

3 participants