From a19f89d3a6af2804f2ac4e30f6d639b56a9bebfd Mon Sep 17 00:00:00 2001 From: Yusuf Bera Ertan Date: Tue, 28 Jul 2020 18:07:46 +0300 Subject: feat(native): add Tooltip widget --- examples/tooltip/src/main.rs | 123 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 123 insertions(+) create mode 100644 examples/tooltip/src/main.rs (limited to 'examples/tooltip/src') diff --git a/examples/tooltip/src/main.rs b/examples/tooltip/src/main.rs new file mode 100644 index 00000000..6e2c4dd4 --- /dev/null +++ b/examples/tooltip/src/main.rs @@ -0,0 +1,123 @@ +use iced::{ + button, tooltip::TooltipPosition, Button, Column, Container, Element, + Length, Row, Sandbox, Settings, Text, Tooltip, +}; + +pub fn main() { + Example::run(Settings::default()).unwrap() +} + +#[derive(Default)] +struct Example { + tooltip_top_button_state: button::State, + tooltip_bottom_button_state: button::State, + tooltip_right_button_state: button::State, + tooltip_left_button_state: button::State, + tooltip_cursor_button_state: button::State, +} + +#[derive(Debug, Clone, Copy)] +struct Message; + +impl Sandbox for Example { + type Message = Message; + + fn new() -> Self { + Self::default() + } + + fn title(&self) -> String { + String::from("Tooltip - Iced") + } + + fn update(&mut self, _message: Message) {} + + fn view(&mut self) -> Element { + let tooltip_top = tooltip_builder( + "Tooltip at top", + &mut self.tooltip_top_button_state, + TooltipPosition::Top, + ); + let tooltip_bottom = tooltip_builder( + "Tooltip at bottom", + &mut self.tooltip_bottom_button_state, + TooltipPosition::Bottom, + ); + let tooltip_right = tooltip_builder( + "Tooltip at right", + &mut self.tooltip_right_button_state, + TooltipPosition::Right, + ); + let tooltip_left = tooltip_builder( + "Tooltip at left", + &mut self.tooltip_left_button_state, + TooltipPosition::Left, + ); + + let fixed_tooltips = Row::with_children(vec![ + tooltip_top.into(), + tooltip_bottom.into(), + tooltip_left.into(), + tooltip_right.into(), + ]) + .width(Length::Fill) + .height(Length::Fill) + .align_items(iced::Align::Center) + .spacing(120); + + let cursor_tooltip_area = Tooltip::new( + Button::new( + &mut self.tooltip_cursor_button_state, + Container::new(Text::new("Tooltip follows cursor").size(40)) + .center_y() + .center_x() + .width(Length::Fill) + .height(Length::Fill), + ) + .on_press(Message) + .width(Length::Fill) + .height(Length::Fill), + tooltip(), + TooltipPosition::FollowCursor, + ); + + let content = Column::with_children(vec![ + Container::new(fixed_tooltips) + .width(Length::Fill) + .height(Length::Fill) + .center_x() + .center_y() + .into(), + cursor_tooltip_area.into(), + ]) + .width(Length::Fill) + .height(Length::Fill); + + Container::new(content) + .width(Length::Fill) + .height(Length::Fill) + .center_x() + .center_y() + .into() + } +} + +fn tooltip_builder<'a>( + label: &str, + button_state: &'a mut button::State, + position: TooltipPosition, +) -> Container<'a, Message> { + Container::new(Tooltip::new( + Button::new(button_state, Text::new(label).size(40)).on_press(Message), + tooltip(), + position, + )) + .center_x() + .center_y() + .width(Length::Fill) + .height(Length::Fill) +} + +fn tooltip() -> Text { + Text::new("Tooltip").size(20) +} -- cgit From 81c75c15249b608dd8a6d47e25f96feb10ca68da Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Tue, 23 Feb 2021 03:09:16 +0100 Subject: Change `Tooltip` to support `Text` only for now --- examples/tooltip/src/main.rs | 114 ++++++++++++++++++++----------------------- 1 file changed, 54 insertions(+), 60 deletions(-) (limited to 'examples/tooltip/src') diff --git a/examples/tooltip/src/main.rs b/examples/tooltip/src/main.rs index 6e2c4dd4..a49caa70 100644 --- a/examples/tooltip/src/main.rs +++ b/examples/tooltip/src/main.rs @@ -1,6 +1,7 @@ +use iced::tooltip::{self, Tooltip}; use iced::{ - button, tooltip::TooltipPosition, Button, Column, Container, Element, - Length, Row, Sandbox, Settings, Text, Tooltip, + button, Button, Column, Container, Element, HorizontalAlignment, Length, + Row, Sandbox, Settings, Text, VerticalAlignment, }; pub fn main() { @@ -9,11 +10,11 @@ pub fn main() { #[derive(Default)] struct Example { - tooltip_top_button_state: button::State, - tooltip_bottom_button_state: button::State, - tooltip_right_button_state: button::State, - tooltip_left_button_state: button::State, - tooltip_cursor_button_state: button::State, + top: button::State, + bottom: button::State, + right: button::State, + left: button::State, + follow_cursor: button::State, } #[derive(Debug, Clone, Copy)] @@ -33,52 +34,39 @@ impl Sandbox for Example { fn update(&mut self, _message: Message) {} fn view(&mut self) -> Element { - let tooltip_top = tooltip_builder( - "Tooltip at top", - &mut self.tooltip_top_button_state, - TooltipPosition::Top, - ); - let tooltip_bottom = tooltip_builder( + let top = + tooltip("Tooltip at top", &mut self.top, tooltip::Position::Top); + + let bottom = tooltip( "Tooltip at bottom", - &mut self.tooltip_bottom_button_state, - TooltipPosition::Bottom, + &mut self.bottom, + tooltip::Position::Bottom, ); - let tooltip_right = tooltip_builder( + + let left = + tooltip("Tooltip at left", &mut self.left, tooltip::Position::Left); + + let right = tooltip( "Tooltip at right", - &mut self.tooltip_right_button_state, - TooltipPosition::Right, - ); - let tooltip_left = tooltip_builder( - "Tooltip at left", - &mut self.tooltip_left_button_state, - TooltipPosition::Left, + &mut self.right, + tooltip::Position::Right, ); let fixed_tooltips = Row::with_children(vec![ - tooltip_top.into(), - tooltip_bottom.into(), - tooltip_left.into(), - tooltip_right.into(), + top.into(), + bottom.into(), + left.into(), + right.into(), ]) .width(Length::Fill) .height(Length::Fill) .align_items(iced::Align::Center) - .spacing(120); - - let cursor_tooltip_area = Tooltip::new( - Button::new( - &mut self.tooltip_cursor_button_state, - Container::new(Text::new("Tooltip follows cursor").size(40)) - .center_y() - .center_x() - .width(Length::Fill) - .height(Length::Fill), - ) - .on_press(Message) - .width(Length::Fill) - .height(Length::Fill), - tooltip(), - TooltipPosition::FollowCursor, + .spacing(50); + + let follow_cursor = tooltip( + "Tooltip follows cursor", + &mut self.follow_cursor, + tooltip::Position::FollowCursor, ); let content = Column::with_children(vec![ @@ -88,36 +76,42 @@ impl Sandbox for Example { .center_x() .center_y() .into(), - cursor_tooltip_area.into(), + follow_cursor.into(), ]) .width(Length::Fill) - .height(Length::Fill); + .height(Length::Fill) + .spacing(50); Container::new(content) .width(Length::Fill) .height(Length::Fill) .center_x() .center_y() + .padding(50) .into() } } -fn tooltip_builder<'a>( +fn tooltip<'a>( label: &str, button_state: &'a mut button::State, - position: TooltipPosition, -) -> Container<'a, Message> { - Container::new(Tooltip::new( - Button::new(button_state, Text::new(label).size(40)).on_press(Message), - tooltip(), + position: tooltip::Position, +) -> Element<'a, Message> { + Tooltip::new( + Button::new( + button_state, + Text::new(label) + .size(40) + .width(Length::Fill) + .height(Length::Fill) + .horizontal_alignment(HorizontalAlignment::Center) + .vertical_alignment(VerticalAlignment::Center), + ) + .on_press(Message) + .width(Length::Fill) + .height(Length::Fill), + Text::new("Tooltip"), position, - )) - .center_x() - .center_y() - .width(Length::Fill) - .height(Length::Fill) -} - -fn tooltip() -> Text { - Text::new("Tooltip").size(20) + ) + .into() } -- cgit From 2f766b73413fe60cd881e139fa0e84a0f0134d91 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Tue, 23 Feb 2021 03:16:37 +0100 Subject: Introduce `Tooltip::gap` to control spacing --- examples/tooltip/src/main.rs | 1 + 1 file changed, 1 insertion(+) (limited to 'examples/tooltip/src') diff --git a/examples/tooltip/src/main.rs b/examples/tooltip/src/main.rs index a49caa70..3677dc75 100644 --- a/examples/tooltip/src/main.rs +++ b/examples/tooltip/src/main.rs @@ -113,5 +113,6 @@ fn tooltip<'a>( Text::new("Tooltip"), position, ) + .gap(10) .into() } -- cgit From 4e923290ccb38dc9cee05592554f98f1f0f12966 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Tue, 23 Feb 2021 04:00:35 +0100 Subject: Add `style` and `padding` to `Tooltip` --- examples/tooltip/src/main.rs | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) (limited to 'examples/tooltip/src') diff --git a/examples/tooltip/src/main.rs b/examples/tooltip/src/main.rs index 3677dc75..b10b8b50 100644 --- a/examples/tooltip/src/main.rs +++ b/examples/tooltip/src/main.rs @@ -114,5 +114,25 @@ fn tooltip<'a>( position, ) .gap(10) + .padding(20) + .style(style::Tooltip) .into() } + +mod style { + use iced::container; + use iced::Color; + + pub struct Tooltip; + + impl container::StyleSheet for Tooltip { + fn style(&self) -> container::Style { + container::Style { + text_color: Some(Color::from_rgb8(0xEE, 0xEE, 0xEE)), + background: Some(Color::from_rgb(0.11, 0.42, 0.87).into()), + border_radius: 12.0, + ..container::Style::default() + } + } + } +} -- cgit From 2736e4ca35f17a92768f0be682acf6da3b574cb6 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Wed, 24 Feb 2021 00:59:29 +0100 Subject: Hide `Text` as an implementation detail of `Tooltip` --- examples/tooltip/src/main.rs | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'examples/tooltip/src') diff --git a/examples/tooltip/src/main.rs b/examples/tooltip/src/main.rs index b10b8b50..d6c8b8e1 100644 --- a/examples/tooltip/src/main.rs +++ b/examples/tooltip/src/main.rs @@ -110,11 +110,11 @@ fn tooltip<'a>( .on_press(Message) .width(Length::Fill) .height(Length::Fill), - Text::new("Tooltip"), + "Tooltip", position, ) - .gap(10) - .padding(20) + .gap(5) + .padding(10) .style(style::Tooltip) .into() } -- cgit