[Settings][Fix][Image Resizer ] Unused text box when selecting custom percent in new settings

[ghost]

Summary of the Pull Request

• Added flags to hide and disable the "x" icon and the Hieght checkbox when unit is set to percentage.

Question:

• Should we order by unit to group the percentage sizes so that the table looks consistent?
  

References

PR Checklist

• Applies to Image Resizer - unused text box when selecting custom percent in new settings #3015
• [ x] CLA signed. If not, go over here and sign the CLA
• Tests added/passed
• Requires documentation to be updated
• I've discussed this with core contributors already. If not checked, I'm ready to accept this work might be rejected in favor of a different grand plan. Issue number where discussion took place: #xxx

Detailed Description of the Pull Request / Additional comments

Validation Steps Performed

• Toggle the unit dropdown of the Image Sizes control to see if changes are applied

[htcfreek]

Is it possible to hide the second number input instead of the first? I think it is better to have the number near the value type.

[ghost]

Is it possible to hide the second number input instead of the first? I think it is better to have the number near the value type.

Sure let me do that.

Is it possible to hide the second number input instead of the first? I think it is better to have the number near the value type.

This is how it would look. What do you think?

[htcfreek]

Another Idea would be to make the first field bigger and center the number if percentage is choosen.

[htcfreek]

If it's possible we should split the settings visually:

<name>    <fit>    <value> x <value> <type>    [Delete]
<name>    <fit>              <value> <type>    [Delete]
<name>    <fit>    <value> x <value> <type>    [Delete]

[ghost]

If it's possible we should split the settings visually:

<name>    <fit>    <value> x <value> <type>    [Delete]
<name>    <fit>              <value> <type>    [Delete]
<name>    <fit>    <value> x <value> <type>    [Delete]

Let me play around with xaml and explore all the suggestions. I will post screenshots so we can evaluate and compare which one would optimize UX.

[htcfreek]

@laviusmotileng-ms
Please look at #2813.

[htcfreek]

I will post screenshots so we can evaluate and compare which one would optimize UX.

Let is discuss this in the main issue or #2813 and not in the PR. Otherwise the PR becomes to big and overloaded.

[ghost]

@laviusmotileng-ms
Please look at #2813.

Thats a good call out. issue #3015 is higher on the priority list. I wanted to focus on it on this PR. Issue #2813 focuses more on UX enhancements but does overlap with this to some extent.

[niels9001]

@laviusmotileng-ms I'd personally would have set Visibility to Collapsed - we then only need 1 property (since it's hidden and thus not interactable). That would require replacing the StackPanel with a Grid with various Columns.

It's basically the same outcome, just a different approach so nothing blocking. Feel free to merge this in, looks good to me :)

[htcfreek]

@laviusmotileng-ms
How does it look at the moment? Have you something after the screenshot?

[ghost]

@laviusmotileng-ms I'd personally would have set Visibility to Collapsed - we then only need 1 property (since it's hidden and thus not interactable). That would require replacing the StackPanel with a Grid with various Columns.

It's basically the same outcome, just a different approach so nothing blocking. Feel free to merge this in, looks good to me :)

Collapsed doesn't work. It deletes the element from the UI including space it takes up causing the elements from the right to shift to the left. While changing the opacity and disabling it allows us to still keep that space.

[ghost]

@laviusmotileng-ms
How does it look at the moment? Have you something after the screenshot?

they're on the way.

[ghost]

@laviusmotileng-ms
How does it look at the moment? Have you something after the screenshot?

they're on the way.

let us solve this issue separately.

[htcfreek]

@laviusmotileng-ms
How does it look at the moment? Have you something after the screenshot?

they're on the way.

let us solve this issue separately.

What do you mean with issue?