cosmic/widget/
header_bar.rs

1// Copyright 2022 System76 <info@system76.com>
2// SPDX-License-Identifier: MPL-2.0
3
4use crate::cosmic_theme::{Density, Spacing};
5use crate::{Element, theme, widget};
6use apply::Apply;
7use derive_setters::Setters;
8use iced_core::widget::tree;
9use iced_core::{Length, Size, Vector, Widget, layout, text};
10use std::borrow::Cow;
11
12#[must_use]
13pub fn header_bar<'a, Message>() -> HeaderBar<'a, Message> {
14    HeaderBar {
15        title: Cow::Borrowed(""),
16        on_close: None,
17        on_drag: None,
18        on_maximize: None,
19        on_minimize: None,
20        on_right_click: None,
21        start: Vec::new(),
22        center: Vec::new(),
23        end: Vec::new(),
24        density: None,
25        focused: false,
26        maximized: false,
27        sharp_corners: false,
28        is_ssd: false,
29        on_double_click: None,
30    }
31}
32
33#[derive(Setters)]
34pub struct HeaderBar<'a, Message> {
35    /// Defines the title of the window
36    #[setters(skip)]
37    title: Cow<'a, str>,
38
39    /// A message emitted when the close button is pressed.
40    #[setters(strip_option)]
41    on_close: Option<Message>,
42
43    /// A message emitted when dragged.
44    #[setters(strip_option)]
45    on_drag: Option<Message>,
46
47    /// A message emitted when the maximize button is pressed.
48    #[setters(strip_option)]
49    on_maximize: Option<Message>,
50
51    /// A message emitted when the minimize button is pressed.
52    #[setters(strip_option)]
53    on_minimize: Option<Message>,
54
55    /// A message emitted when the header is double clicked,
56    /// usually used to maximize the window.
57    #[setters(strip_option)]
58    on_double_click: Option<Message>,
59
60    /// A message emitted when the header is right clicked.
61    #[setters(strip_option)]
62    on_right_click: Option<Message>,
63
64    /// Elements packed at the start of the headerbar.
65    #[setters(skip)]
66    start: Vec<Element<'a, Message>>,
67
68    /// Elements packed in the center of the headerbar.
69    #[setters(skip)]
70    center: Vec<Element<'a, Message>>,
71
72    /// Elements packed at the end of the headerbar.
73    #[setters(skip)]
74    end: Vec<Element<'a, Message>>,
75
76    /// Controls the density of the headerbar.
77    #[setters(strip_option)]
78    density: Option<Density>,
79
80    /// Focused state of the window
81    focused: bool,
82
83    /// Maximized state of the window
84    maximized: bool,
85
86    /// Whether the corners of the window should be sharp
87    sharp_corners: bool,
88
89    /// HeaderBar used for server-side decorations
90    is_ssd: bool,
91}
92
93impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
94    /// Defines the title of the window
95    #[must_use]
96    pub fn title(mut self, title: impl Into<Cow<'a, str>> + 'a) -> Self {
97        self.title = title.into();
98        self
99    }
100
101    /// Pushes an element to the start region.
102    #[must_use]
103    pub fn start(mut self, widget: impl Into<Element<'a, Message>> + 'a) -> Self {
104        self.start.push(widget.into());
105        self
106    }
107
108    /// Pushes an element to the center region.
109    #[must_use]
110    pub fn center(mut self, widget: impl Into<Element<'a, Message>> + 'a) -> Self {
111        self.center.push(widget.into());
112        self
113    }
114
115    /// Pushes an element to the end region.
116    #[must_use]
117    pub fn end(mut self, widget: impl Into<Element<'a, Message>> + 'a) -> Self {
118        self.end.push(widget.into());
119        self
120    }
121}
122
123pub struct HeaderBarWidget<'a, Message> {
124    start: Element<'a, Message>,
125    center: Option<Element<'a, Message>>,
126    end: Element<'a, Message>,
127}
128
129impl<'a, Message> HeaderBarWidget<'a, Message> {
130    pub fn new(
131        start: Element<'a, Message>,
132        center: Option<Element<'a, Message>>,
133        end: Element<'a, Message>,
134    ) -> Self {
135        Self { start, center, end }
136    }
137
138    fn elems(&self) -> impl Iterator<Item = &Element<'a, Message>> {
139        std::iter::once(&self.start)
140            .chain(std::iter::once(&self.end))
141            .chain(self.center.as_ref())
142    }
143
144    fn elems_mut(&mut self) -> impl Iterator<Item = &mut Element<'a, Message>> {
145        std::iter::once(&mut self.start)
146            .chain(std::iter::once(&mut self.end))
147            .chain(self.center.as_mut())
148    }
149}
150
151impl<'a, Message: Clone + 'static> Widget<Message, crate::Theme, crate::Renderer>
152    for HeaderBarWidget<'a, Message>
153{
154    fn diff(&mut self, tree: &mut tree::Tree) {
155        if let Some(center) = &mut self.center {
156            tree.diff_children(&mut [&mut self.start, &mut self.end, center]);
157        } else {
158            tree.diff_children(&mut [&mut self.start, &mut self.end]);
159        }
160    }
161
162    fn children(&self) -> Vec<tree::Tree> {
163        self.elems().map(tree::Tree::new).collect()
164    }
165
166    fn size(&self) -> Size<Length> {
167        Size {
168            width: Length::Fill,
169            height: Length::Shrink,
170        }
171    }
172
173    fn layout(
174        &mut self,
175        tree: &mut tree::Tree,
176        renderer: &crate::Renderer,
177        limits: &layout::Limits,
178    ) -> layout::Node {
179        let width = limits.max().width;
180        let height = limits.max().height;
181        let gap = 8.0;
182
183        let end_node =
184            self.end
185                .as_widget_mut()
186                .layout(&mut tree.children[1], renderer, &limits.loose());
187        let end_width = end_node.size().width;
188
189        let start_available = (width - end_width - gap).max(0.0);
190        let start_node = self.start.as_widget_mut().layout(
191            &mut tree.children[0],
192            renderer,
193            &layout::Limits::new(Size::ZERO, Size::new(start_available, height)),
194        );
195        let start_width = start_node.size().width;
196
197        let vcenter = |node: layout::Node, x: f32| -> layout::Node {
198            let dy = ((height - node.size().height) / 2.0).max(0.0);
199            node.translate(Vector::new(x, dy))
200        };
201
202        let mut child_nodes = Vec::with_capacity(3);
203        child_nodes.push(vcenter(start_node, 0.0));
204        child_nodes.push(vcenter(end_node, width - end_width));
205
206        if let Some(center) = &mut self.center {
207            let slot_start = start_width + gap;
208            let slot_end = (width - end_width - gap).max(slot_start);
209            let slot_width = slot_end - slot_start;
210            // this instead of `node.size().width` prevents center jitter as text ellipsizes
211            let natural_width = center
212                .as_widget_mut()
213                .layout(&mut tree.children[2], renderer, &limits.loose())
214                .size()
215                .width;
216
217            let node = center.as_widget_mut().layout(
218                &mut tree.children[2],
219                renderer,
220                &layout::Limits::new(Size::ZERO, Size::new(slot_width, height)),
221            );
222
223            let ideal_x = (width - natural_width) / 2.0;
224            let max_x = (width - end_width - gap - natural_width).max(slot_start);
225            let center_x = ideal_x.clamp(slot_start, max_x);
226
227            child_nodes.push(vcenter(node, center_x))
228        }
229
230        layout::Node::with_children(Size::new(width, height), child_nodes)
231    }
232
233    fn draw(
234        &self,
235        tree: &tree::Tree,
236        renderer: &mut crate::Renderer,
237        theme: &crate::Theme,
238        style: &iced_core::renderer::Style,
239        layout: iced_core::Layout<'_>,
240        cursor: iced_core::mouse::Cursor,
241        viewport: &iced_core::Rectangle,
242    ) {
243        self.elems()
244            .zip(&tree.children)
245            .zip(layout.children())
246            .for_each(|((e, s), l)| {
247                e.as_widget()
248                    .draw(s, renderer, theme, style, l, cursor, viewport);
249            });
250    }
251
252    fn update(
253        &mut self,
254        state: &mut tree::Tree,
255        event: &iced_core::Event,
256        layout: iced_core::Layout<'_>,
257        cursor: iced_core::mouse::Cursor,
258        renderer: &crate::Renderer,
259        clipboard: &mut dyn iced_core::Clipboard,
260        shell: &mut iced_core::Shell<'_, Message>,
261        viewport: &iced_core::Rectangle,
262    ) {
263        self.elems_mut()
264            .zip(&mut state.children)
265            .zip(layout.children())
266            .for_each(|((e, s), l)| {
267                e.as_widget_mut()
268                    .update(s, event, l, cursor, renderer, clipboard, shell, viewport);
269            });
270    }
271
272    fn mouse_interaction(
273        &self,
274        state: &tree::Tree,
275        layout: iced_core::Layout<'_>,
276        cursor: iced_core::mouse::Cursor,
277        viewport: &iced_core::Rectangle,
278        renderer: &crate::Renderer,
279    ) -> iced_core::mouse::Interaction {
280        self.elems()
281            .zip(&state.children)
282            .zip(layout.children())
283            .map(|((e, s), l)| {
284                e.as_widget()
285                    .mouse_interaction(s, l, cursor, viewport, renderer)
286            })
287            .max()
288            .unwrap_or(iced_core::mouse::Interaction::None)
289    }
290
291    fn operate(
292        &mut self,
293        state: &mut tree::Tree,
294        layout: iced_core::Layout<'_>,
295        renderer: &crate::Renderer,
296        operation: &mut dyn iced_core::widget::Operation<()>,
297    ) {
298        self.elems_mut()
299            .zip(&mut state.children)
300            .zip(layout.children())
301            .for_each(|((e, s), l)| {
302                e.as_widget_mut().operate(s, l, renderer, operation);
303            });
304    }
305
306    fn overlay<'b>(
307        &'b mut self,
308        state: &'b mut tree::Tree,
309        layout: iced_core::Layout<'b>,
310        renderer: &crate::Renderer,
311        viewport: &iced_core::Rectangle,
312        translation: Vector,
313    ) -> Option<iced_core::overlay::Element<'b, Message, crate::Theme, crate::Renderer>> {
314        self.elems_mut()
315            .zip(&mut state.children)
316            .zip(layout.children())
317            .find_map(|((e, s), l)| {
318                e.as_widget_mut()
319                    .overlay(s, l, renderer, viewport, translation)
320            })
321    }
322
323    fn drag_destinations(
324        &self,
325        state: &tree::Tree,
326        layout: iced_core::Layout<'_>,
327        renderer: &crate::Renderer,
328        dnd_rectangles: &mut iced_core::clipboard::DndDestinationRectangles,
329    ) {
330        self.elems()
331            .zip(&state.children)
332            .zip(layout.children())
333            .for_each(|((e, s), l)| {
334                e.as_widget()
335                    .drag_destinations(s, l, renderer, dnd_rectangles);
336            });
337    }
338
339    #[cfg(feature = "a11y")]
340    /// get the a11y nodes for the widget
341    fn a11y_nodes(
342        &self,
343        layout: iced_core::Layout<'_>,
344        state: &tree::Tree,
345        p: iced::mouse::Cursor,
346    ) -> iced_accessibility::A11yTree {
347        iced_accessibility::A11yTree::join(
348            self.elems()
349                .zip(&state.children)
350                .zip(layout.children())
351                .map(|((e, s), l)| e.as_widget().a11y_nodes(l, s, p)),
352        )
353    }
354}
355
356impl<'a, Message: Clone + 'static> From<HeaderBarWidget<'a, Message>> for Element<'a, Message> {
357    fn from(w: HeaderBarWidget<'a, Message>) -> Self {
358        Element::new(w)
359    }
360}
361
362impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
363    /// Converts the headerbar builder into an Iced element.
364    pub fn view(mut self) -> Element<'a, Message> {
365        let Spacing {
366            space_xxxs,
367            space_xxs,
368            ..
369        } = theme::spacing();
370        let is_ssd = self.is_ssd;
371
372        // Take ownership of the regions to be packed.
373        let start = std::mem::take(&mut self.start);
374        let center = std::mem::take(&mut self.center);
375        let mut end = std::mem::take(&mut self.end);
376
377        // Also packs the window controls at the very end.
378        end.push(self.window_controls(space_xxs));
379
380        let padding = if is_ssd {
381            [2, 8, 2, 8]
382        } else {
383            match (
384                self.density.unwrap_or_else(crate::config::header_size),
385                self.maximized, // window border handling
386            ) {
387                (Density::Compact, true) => [4, 8, 4, 8],
388                (Density::Compact, false) => [3, 7, 4, 7],
389                (_, true) => [8, 8, 8, 8],
390                (_, false) => [7, 7, 8, 7],
391            }
392        };
393
394        let start = widget::row::with_children(start)
395            .spacing(space_xxxs)
396            .align_y(iced::Alignment::Center)
397            .into();
398        let center = if !center.is_empty() {
399            Some(
400                widget::row::with_children(center)
401                    .spacing(space_xxxs)
402                    .align_y(iced::Alignment::Center)
403                    .into(),
404            )
405        } else if !self.title.is_empty() {
406            Some(
407                widget::text::heading(self.title)
408                    .wrapping(text::Wrapping::None)
409                    .ellipsize(text::Ellipsize::End(text::EllipsizeHeightLimit::Lines(1)))
410                    .into(),
411            )
412        } else {
413            None
414        };
415        let end = widget::row::with_children(end)
416            .spacing(space_xxs)
417            .align_y(iced::Alignment::Center)
418            .into();
419
420        let mut widget = HeaderBarWidget::new(start, center, end)
421            .apply(widget::container)
422            .class(theme::Container::HeaderBar {
423                focused: self.focused,
424                sharp_corners: self.sharp_corners,
425                transparent: if is_ssd { false } else { true },
426            })
427            .height(Length::Fixed(32.0 + padding[0] as f32 + padding[2] as f32))
428            .padding(padding)
429            .apply(widget::mouse_area);
430
431        if let Some(message) = self.on_drag {
432            widget = widget.on_drag(message);
433        }
434        if let Some(message) = self.on_maximize {
435            widget = widget.on_release(message);
436        }
437        if let Some(message) = self.on_double_click {
438            widget = widget.on_double_press(message);
439        }
440        if let Some(message) = self.on_right_click {
441            widget = widget.on_right_press(message);
442        }
443
444        widget.into()
445    }
446
447    /// Creates the widget for window controls.
448    fn window_controls(&mut self, spacing: u16) -> Element<'a, Message> {
449        macro_rules! icon {
450            ($name:expr, $size:expr, $on_press:expr) => {{
451                widget::icon::from_name($name)
452                    .apply(widget::button::icon)
453                    .padding(8)
454                    .class(theme::Button::HeaderBar)
455                    .selected(self.focused)
456                    .icon_size($size)
457                    .on_press($on_press)
458            }};
459        }
460
461        widget::row::with_capacity(3)
462            .push_maybe(
463                self.on_minimize
464                    .take()
465                    .map(|m| icon!("window-minimize-symbolic", 16, m)),
466            )
467            .push_maybe(self.on_maximize.take().map(|m| {
468                if self.maximized {
469                    icon!("window-restore-symbolic", 16, m)
470                } else {
471                    icon!("window-maximize-symbolic", 16, m)
472                }
473            }))
474            .push_maybe(
475                self.on_close
476                    .take()
477                    .map(|m| icon!("window-close-symbolic", 16, m)),
478            )
479            .spacing(spacing)
480            .align_y(iced::Alignment::Center)
481            .into()
482    }
483}
484
485impl<'a, Message: Clone + 'static> From<HeaderBar<'a, Message>> for Element<'a, Message> {
486    fn from(headerbar: HeaderBar<'a, Message>) -> Self {
487        headerbar.view()
488    }
489}
cosmic/widget/header_bar.rs

cosmic/widget/
header_bar.rs
