Reintroduce draw method in TextInput
... which allows overriding the rendered value.
This commit is contained in:
Héctor Ramón Jiménez
parent
e50bb1dd2c
commit
a1db8d62c0
1 changed files with 174 additions and 156 deletions
|
|
@ -166,6 +166,179 @@ where
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
impl<'a, Message, Renderer> TextInput<'a, Message, Renderer>
|
||||||
|
where
|
||||||
|
Renderer: text::Renderer,
|
||||||
|
{
|
||||||
|
/// Draws the [`TextInput`] with the given [`Renderer`], overriding its
|
||||||
|
/// [`Value`] if provided.
|
||||||
|
pub fn draw(
|
||||||
|
&self,
|
||||||
|
renderer: &mut Renderer,
|
||||||
|
layout: Layout<'_>,
|
||||||
|
cursor_position: Point,
|
||||||
|
value: Option<&Value>,
|
||||||
|
) {
|
||||||
|
let value = value.unwrap_or(&self.value);
|
||||||
|
let secure_value = self.is_secure.then(|| value.secure());
|
||||||
|
let value = secure_value.as_ref().unwrap_or(&value);
|
||||||
|
|
||||||
|
let bounds = layout.bounds();
|
||||||
|
let text_bounds = layout.children().next().unwrap().bounds();
|
||||||
|
|
||||||
|
let is_mouse_over = bounds.contains(cursor_position);
|
||||||
|
|
||||||
|
let style = if self.state.is_focused() {
|
||||||
|
self.style_sheet.focused()
|
||||||
|
} else if is_mouse_over {
|
||||||
|
self.style_sheet.hovered()
|
||||||
|
} else {
|
||||||
|
self.style_sheet.active()
|
||||||
|
};
|
||||||
|
|
||||||
|
renderer.fill_rectangle(renderer::Quad {
|
||||||
|
bounds,
|
||||||
|
background: style.background,
|
||||||
|
border_radius: style.border_radius,
|
||||||
|
border_width: style.border_width,
|
||||||
|
border_color: style.border_color,
|
||||||
|
});
|
||||||
|
|
||||||
|
let text = value.to_string();
|
||||||
|
let size = self.size.unwrap_or(renderer.default_size());
|
||||||
|
|
||||||
|
let (cursor, offset) = if self.state.is_focused() {
|
||||||
|
match self.state.cursor.state(&value) {
|
||||||
|
cursor::State::Index(position) => {
|
||||||
|
let (text_value_width, offset) =
|
||||||
|
measure_cursor_and_scroll_offset(
|
||||||
|
renderer,
|
||||||
|
text_bounds,
|
||||||
|
&value,
|
||||||
|
size,
|
||||||
|
position,
|
||||||
|
self.font,
|
||||||
|
);
|
||||||
|
|
||||||
|
(
|
||||||
|
Some(renderer::Quad {
|
||||||
|
bounds: Rectangle {
|
||||||
|
x: text_bounds.x + text_value_width,
|
||||||
|
y: text_bounds.y,
|
||||||
|
width: 1.0,
|
||||||
|
height: text_bounds.height,
|
||||||
|
},
|
||||||
|
background: Background::Color(
|
||||||
|
self.style_sheet.value_color(),
|
||||||
|
),
|
||||||
|
border_radius: 0.0,
|
||||||
|
border_width: 0.0,
|
||||||
|
border_color: Color::TRANSPARENT,
|
||||||
|
}),
|
||||||
|
offset,
|
||||||
|
)
|
||||||
|
}
|
||||||
|
cursor::State::Selection { start, end } => {
|
||||||
|
let left = start.min(end);
|
||||||
|
let right = end.max(start);
|
||||||
|
|
||||||
|
let (left_position, left_offset) =
|
||||||
|
measure_cursor_and_scroll_offset(
|
||||||
|
renderer,
|
||||||
|
text_bounds,
|
||||||
|
&value,
|
||||||
|
size,
|
||||||
|
left,
|
||||||
|
self.font,
|
||||||
|
);
|
||||||
|
|
||||||
|
let (right_position, right_offset) =
|
||||||
|
measure_cursor_and_scroll_offset(
|
||||||
|
renderer,
|
||||||
|
text_bounds,
|
||||||
|
&value,
|
||||||
|
size,
|
||||||
|
right,
|
||||||
|
self.font,
|
||||||
|
);
|
||||||
|
|
||||||
|
let width = right_position - left_position;
|
||||||
|
|
||||||
|
(
|
||||||
|
Some(renderer::Quad {
|
||||||
|
bounds: Rectangle {
|
||||||
|
x: text_bounds.x + left_position,
|
||||||
|
y: text_bounds.y,
|
||||||
|
width,
|
||||||
|
height: text_bounds.height,
|
||||||
|
},
|
||||||
|
background: Background::Color(
|
||||||
|
self.style_sheet.selection_color(),
|
||||||
|
),
|
||||||
|
border_radius: 0.0,
|
||||||
|
border_width: 0.0,
|
||||||
|
border_color: Color::TRANSPARENT,
|
||||||
|
}),
|
||||||
|
if end == right {
|
||||||
|
right_offset
|
||||||
|
} else {
|
||||||
|
left_offset
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
(None, 0.0)
|
||||||
|
};
|
||||||
|
|
||||||
|
let text_width = renderer.measure_width(
|
||||||
|
if text.is_empty() {
|
||||||
|
&self.placeholder
|
||||||
|
} else {
|
||||||
|
&text
|
||||||
|
},
|
||||||
|
size,
|
||||||
|
self.font,
|
||||||
|
);
|
||||||
|
|
||||||
|
let render = |renderer: &mut Renderer| {
|
||||||
|
if let Some(cursor) = cursor {
|
||||||
|
renderer.fill_rectangle(cursor);
|
||||||
|
}
|
||||||
|
|
||||||
|
renderer.fill_text(Text {
|
||||||
|
content: if text.is_empty() {
|
||||||
|
&self.placeholder
|
||||||
|
} else {
|
||||||
|
&text
|
||||||
|
},
|
||||||
|
color: if text.is_empty() {
|
||||||
|
self.style_sheet.placeholder_color()
|
||||||
|
} else {
|
||||||
|
self.style_sheet.value_color()
|
||||||
|
},
|
||||||
|
font: self.font,
|
||||||
|
bounds: Rectangle {
|
||||||
|
y: text_bounds.center_y(),
|
||||||
|
width: f32::INFINITY,
|
||||||
|
..text_bounds
|
||||||
|
},
|
||||||
|
size: f32::from(size),
|
||||||
|
horizontal_alignment: alignment::Horizontal::Left,
|
||||||
|
vertical_alignment: alignment::Vertical::Center,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
if text_width > text_bounds.width {
|
||||||
|
renderer.with_layer(text_bounds, |renderer| {
|
||||||
|
renderer.with_translation(Vector::new(-offset, 0.0), render)
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
render(renderer);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
impl<'a, Message, Renderer> Widget<Message, Renderer>
|
impl<'a, Message, Renderer> Widget<Message, Renderer>
|
||||||
for TextInput<'a, Message, Renderer>
|
for TextInput<'a, Message, Renderer>
|
||||||
where
|
where
|
||||||
|
|
@ -604,162 +777,7 @@ where
|
||||||
cursor_position: Point,
|
cursor_position: Point,
|
||||||
_viewport: &Rectangle,
|
_viewport: &Rectangle,
|
||||||
) {
|
) {
|
||||||
let secure_value = self.is_secure.then(|| self.value.secure());
|
self.draw(renderer, layout, cursor_position, None)
|
||||||
let value = secure_value.as_ref().unwrap_or(&self.value);
|
|
||||||
|
|
||||||
let bounds = layout.bounds();
|
|
||||||
let text_bounds = layout.children().next().unwrap().bounds();
|
|
||||||
|
|
||||||
let is_mouse_over = bounds.contains(cursor_position);
|
|
||||||
|
|
||||||
let style = if self.state.is_focused() {
|
|
||||||
self.style_sheet.focused()
|
|
||||||
} else if is_mouse_over {
|
|
||||||
self.style_sheet.hovered()
|
|
||||||
} else {
|
|
||||||
self.style_sheet.active()
|
|
||||||
};
|
|
||||||
|
|
||||||
renderer.fill_rectangle(renderer::Quad {
|
|
||||||
bounds,
|
|
||||||
background: style.background,
|
|
||||||
border_radius: style.border_radius,
|
|
||||||
border_width: style.border_width,
|
|
||||||
border_color: style.border_color,
|
|
||||||
});
|
|
||||||
|
|
||||||
let text = value.to_string();
|
|
||||||
let size = self.size.unwrap_or(renderer.default_size());
|
|
||||||
|
|
||||||
let (cursor, offset) = if self.state.is_focused() {
|
|
||||||
match self.state.cursor.state(&value) {
|
|
||||||
cursor::State::Index(position) => {
|
|
||||||
let (text_value_width, offset) =
|
|
||||||
measure_cursor_and_scroll_offset(
|
|
||||||
renderer,
|
|
||||||
text_bounds,
|
|
||||||
&value,
|
|
||||||
size,
|
|
||||||
position,
|
|
||||||
self.font,
|
|
||||||
);
|
|
||||||
|
|
||||||
(
|
|
||||||
Some(renderer::Quad {
|
|
||||||
bounds: Rectangle {
|
|
||||||
x: text_bounds.x + text_value_width,
|
|
||||||
y: text_bounds.y,
|
|
||||||
width: 1.0,
|
|
||||||
height: text_bounds.height,
|
|
||||||
},
|
|
||||||
background: Background::Color(
|
|
||||||
self.style_sheet.value_color(),
|
|
||||||
),
|
|
||||||
border_radius: 0.0,
|
|
||||||
border_width: 0.0,
|
|
||||||
border_color: Color::TRANSPARENT,
|
|
||||||
}),
|
|
||||||
offset,
|
|
||||||
)
|
|
||||||
}
|
|
||||||
cursor::State::Selection { start, end } => {
|
|
||||||
let left = start.min(end);
|
|
||||||
let right = end.max(start);
|
|
||||||
|
|
||||||
let (left_position, left_offset) =
|
|
||||||
measure_cursor_and_scroll_offset(
|
|
||||||
renderer,
|
|
||||||
text_bounds,
|
|
||||||
&value,
|
|
||||||
size,
|
|
||||||
left,
|
|
||||||
self.font,
|
|
||||||
);
|
|
||||||
|
|
||||||
let (right_position, right_offset) =
|
|
||||||
measure_cursor_and_scroll_offset(
|
|
||||||
renderer,
|
|
||||||
text_bounds,
|
|
||||||
&value,
|
|
||||||
size,
|
|
||||||
right,
|
|
||||||
self.font,
|
|
||||||
);
|
|
||||||
|
|
||||||
let width = right_position - left_position;
|
|
||||||
|
|
||||||
(
|
|
||||||
Some(renderer::Quad {
|
|
||||||
bounds: Rectangle {
|
|
||||||
x: text_bounds.x + left_position,
|
|
||||||
y: text_bounds.y,
|
|
||||||
width,
|
|
||||||
height: text_bounds.height,
|
|
||||||
},
|
|
||||||
background: Background::Color(
|
|
||||||
self.style_sheet.selection_color(),
|
|
||||||
),
|
|
||||||
border_radius: 0.0,
|
|
||||||
border_width: 0.0,
|
|
||||||
border_color: Color::TRANSPARENT,
|
|
||||||
}),
|
|
||||||
if end == right {
|
|
||||||
right_offset
|
|
||||||
} else {
|
|
||||||
left_offset
|
|
||||||
},
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
(None, 0.0)
|
|
||||||
};
|
|
||||||
|
|
||||||
let text_width = renderer.measure_width(
|
|
||||||
if text.is_empty() {
|
|
||||||
&self.placeholder
|
|
||||||
} else {
|
|
||||||
&text
|
|
||||||
},
|
|
||||||
size,
|
|
||||||
self.font,
|
|
||||||
);
|
|
||||||
|
|
||||||
let render = |renderer: &mut Renderer| {
|
|
||||||
if let Some(cursor) = cursor {
|
|
||||||
renderer.fill_rectangle(cursor);
|
|
||||||
}
|
|
||||||
|
|
||||||
renderer.fill_text(Text {
|
|
||||||
content: if text.is_empty() {
|
|
||||||
&self.placeholder
|
|
||||||
} else {
|
|
||||||
&text
|
|
||||||
},
|
|
||||||
color: if text.is_empty() {
|
|
||||||
self.style_sheet.placeholder_color()
|
|
||||||
} else {
|
|
||||||
self.style_sheet.value_color()
|
|
||||||
},
|
|
||||||
font: self.font,
|
|
||||||
bounds: Rectangle {
|
|
||||||
y: text_bounds.center_y(),
|
|
||||||
width: f32::INFINITY,
|
|
||||||
..text_bounds
|
|
||||||
},
|
|
||||||
size: f32::from(size),
|
|
||||||
horizontal_alignment: alignment::Horizontal::Left,
|
|
||||||
vertical_alignment: alignment::Vertical::Center,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
if text_width > text_bounds.width {
|
|
||||||
renderer.with_layer(text_bounds, |renderer| {
|
|
||||||
renderer.with_translation(Vector::new(-offset, 0.0), render)
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
render(renderer);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fn hash_layout(&self, state: &mut Hasher) {
|
fn hash_layout(&self, state: &mut Hasher) {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue