-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
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
Added Icon
to text_input
#1702
Added Icon
to text_input
#1702
Conversation
native/src/widget/text_input.rs
Outdated
let text_bounds = { | ||
let bounds = layout.children().next().unwrap().bounds(); | ||
if let Some(icon) = icon { | ||
let Icon { | ||
font, | ||
size, | ||
code_point, | ||
position, | ||
} = icon; | ||
|
||
let padding = f32::from(padding.horizontal()); | ||
let size = size.unwrap_or_else(|| renderer.default_size()); | ||
let width = renderer.measure_width( | ||
&code_point.to_string(), | ||
size, | ||
font.clone(), | ||
); | ||
|
||
match position { | ||
IconPosition::Left => Rectangle { | ||
x: bounds.x + (width + padding), | ||
width: bounds.width - (width + padding), | ||
..bounds | ||
}, | ||
IconPosition::Right => Rectangle { | ||
x: bounds.x, | ||
width: bounds.width - (width + padding), | ||
..bounds | ||
}, | ||
} | ||
} else { | ||
bounds | ||
} | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could we compute this only once in layout
? We could add the icon child node after the text
child, that way event logic won't need to change at all.
This could always be added in a future PR, but it would be cool if these icons could handle click events. The use case I am thiking of is a "show password" icon on a password input. Or a magnifying glass search button on a search input. |
is there a reason to not make the icon impl Into? |
1a0f0c2
to
f8d4df8
Compare
f8d4df8
to
0e2fc99
Compare
Also add `Icon::spacing` field.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good stuff! 🥳
I made some changes here and there. The most important ones:
- Fixed mismatched types related to Generic pixel units #1711 in 0e2fc99.
- Move the icon layout logic in the
layout
function and added aspacing
field toIcon
in 9852b4b. - Renamed
text_input::IconPosition
totext_input::Side
in cf9d8e0.
I think we can merge this! We can tackle further use cases separately 🚢
This PR adds the ability to add a
Icon
to atext_input
. This opens up for quite a lot of new styling possibilities totext_input
as aIcon
is defined by:There are multiple use-cases with the handle. Eg; login and search inputs with icons to the left and inputs which has invalid or unexpected content could show a warning icon to the right.