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

cosmic/widget/
header_bar.rs
