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.
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.
Good stuff! 🥳
I made some changes here and there. The most important ones:
- Fixed mismatched types related to #1711 in 0e2fc99.
- Move the icon layout logic in the
layoutfunction and added aspacingfield toIconin 9852b4b. - Renamed
text_input::IconPositiontotext_input::Sidein cf9d8e0.
I think we can merge this! We can tackle further use cases separately 🚢
This PR adds the ability to add a
Iconto atext_input. This opens up for quite a lot of new styling possibilities totext_inputas aIconis 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.