fix: correctly align the container for popups

This commit is contained in:
Ashley Wulber 2022-11-14 16:58:04 +01:00
parent 0a0972ddc8
commit 9174e42099
No known key found for this signature in database
GPG key ID: 5216D4F46A90A820
3 changed files with 87 additions and 61 deletions

View file

@ -7,7 +7,7 @@ edition = "2021"
name = "cosmic" name = "cosmic"
[features] [features]
default = ["iced_winit", "wgpu"] default = ["wayland"]
debug = ["iced/debug"] debug = ["iced/debug"]
wayland = ["iced/wayland"] wayland = ["iced/wayland"]
wgpu = ["iced/wgpu"] wgpu = ["iced/wgpu"]

View file

@ -1,6 +1,6 @@
use crate::dbus::{self, PowerDaemonProxy}; use crate::dbus::{self, PowerDaemonProxy};
use crate::graphics::{get_current_graphics, set_graphics, Graphics}; use crate::graphics::{get_current_graphics, set_graphics, Graphics};
use cosmic::applet::{get_popup_settings, icon_button}; use cosmic::applet::{get_popup_settings, icon_button, popup_container};
use cosmic::iced_style::application::{self, Appearance}; use cosmic::iced_style::application::{self, Appearance};
use cosmic::separator; use cosmic::separator;
use cosmic::theme::Container; use cosmic::theme::Container;
@ -13,9 +13,9 @@ use cosmic::{
Element, Element,
}; };
use cosmic_panel_config::{PanelAnchor, PanelSize}; use cosmic_panel_config::{PanelAnchor, PanelSize};
use iced_sctk::Color;
use iced_sctk::alignment::{Horizontal, Vertical}; use iced_sctk::alignment::{Horizontal, Vertical};
use iced_sctk::commands::popup::{destroy_popup, get_popup}; use iced_sctk::commands::popup::{destroy_popup, get_popup};
use iced_sctk::Color;
use zbus::Connection; use zbus::Connection;
#[derive(Clone, Copy)] #[derive(Clone, Copy)]
@ -214,25 +214,19 @@ impl Application for Window {
.into() .into()
} }
}; };
container(column(vec![ popup_container(
text("Graphics Mode") column(vec![
.width(Length::Fill) text("Graphics Mode")
.horizontal_alignment(Horizontal::Center) .width(Length::Fill)
.size(24) .horizontal_alignment(Horizontal::Center)
.into(), .size(24)
separator!(1).into(), .into(),
content, separator!(1).into(),
content,
]) ])
.padding(4) .padding(4)
.spacing(4)) .spacing(4),
.style(Container::Custom(|theme| container::Appearance { )
text_color: Some(theme.cosmic().on_bg_color().into()),
background: Some(theme.extended_palette().background.base.color.into()),
border_radius: 12.0,
border_width: 0.0,
border_color: Color::TRANSPARENT,
}))
.align_y(Vertical::Center)
.into() .into()
} }
@ -253,7 +247,10 @@ impl Application for Window {
} }
fn style(&self) -> <Self::Theme as application::StyleSheet>::Style { fn style(&self) -> <Self::Theme as application::StyleSheet>::Style {
<Self::Theme as application::StyleSheet>::Style::Custom(|theme| Appearance { background_color: Color::from_rgba(0.0, 0.0, 0.0, 0.0), text_color: theme.cosmic().on_bg_color().into() }) <Self::Theme as application::StyleSheet>::Style::Custom(|theme| Appearance {
background_color: Color::from_rgba(0.0, 0.0, 0.0, 0.0),
text_color: theme.cosmic().on_bg_color().into(),
})
} }
fn view_window(&self, _: window::Id) -> Element<Message> { fn view_window(&self, _: window::Id) -> Element<Message> {

View file

@ -1,10 +1,18 @@
use cosmic_panel_config::{PanelSize, PanelAnchor}; use cosmic_panel_config::{PanelAnchor, PanelSize};
use iced::{widget::{Button, self}, Rectangle, alignment::{Vertical, Horizontal}, Color, Element}; use iced::{
use iced_native::{command::platform_specific::wayland::popup::{SctkPopupSettings, SctkPositioner}}; alignment::{Horizontal, Vertical},
widget::{self, Button},
Color, Element, Length, Rectangle,
};
use iced_native::command::platform_specific::wayland::popup::{SctkPopupSettings, SctkPositioner};
use iced_style::container::Appearance; use iced_style::container::Appearance;
use sctk::reexports::protocols::xdg::shell::client::xdg_positioner::{Anchor, Gravity}; use sctk::reexports::protocols::xdg::shell::client::xdg_positioner::{Anchor, Gravity};
use crate::{button, widget::icon, theme::{Container, self}}; use crate::{
button,
theme::{self, Container},
widget::icon,
};
pub fn icon_button<'a, M: 'a, Renderer>() -> Button<'a, M, Renderer> pub fn icon_button<'a, M: 'a, Renderer>() -> Button<'a, M, Renderer>
where where
@ -25,14 +33,19 @@ where
button!(icon("input-gaming-symbolic", pixels)) button!(icon("input-gaming-symbolic", pixels))
} }
pub fn get_popup_settings(parent: iced_native::window::Id, id: iced_native::window::Id, width_padding: Option<i32>, height_padding: Option<i32>) -> SctkPopupSettings { pub fn get_popup_settings(
parent: iced_native::window::Id,
id: iced_native::window::Id,
width_padding: Option<i32>,
height_padding: Option<i32>,
) -> SctkPopupSettings {
let anchor = std::env::var("COSMIC_PANEL_ANCHOR") let anchor = std::env::var("COSMIC_PANEL_ANCHOR")
.ok() .ok()
.map(|size| match size.parse::<PanelAnchor>() { .map(|size| match size.parse::<PanelAnchor>() {
Ok(p) => p, Ok(p) => p,
Err(_) => PanelAnchor::Top, Err(_) => PanelAnchor::Top,
}) })
.unwrap_or(PanelAnchor::Top); .unwrap_or(PanelAnchor::Top);
let pixels = std::env::var("COSMIC_PANEL_SIZE") let pixels = std::env::var("COSMIC_PANEL_SIZE")
.ok() .ok()
.and_then(|size| match size.parse::<PanelSize>() { .and_then(|size| match size.parse::<PanelSize>() {
@ -50,32 +63,44 @@ pub fn get_popup_settings(parent: iced_native::window::Id, id: iced_native::wind
PanelAnchor::Top => (Anchor::Bottom, Gravity::Bottom), PanelAnchor::Top => (Anchor::Bottom, Gravity::Bottom),
PanelAnchor::Bottom => (Anchor::Top, Gravity::Top), PanelAnchor::Bottom => (Anchor::Top, Gravity::Top),
}; };
SctkPopupSettings { parent, id, positioner: SctkPositioner { SctkPopupSettings {
anchor, parent,
gravity, id,
size: (200, 200), positioner: SctkPositioner {
anchor_rect: Rectangle { anchor,
x: 0, gravity,
y: 0, size: (200, 200),
width: width_padding.unwrap_or(16) * 2 + pixels as i32, anchor_rect: Rectangle {
height: height_padding.unwrap_or(8) * 2 + pixels as i32, x: 0,
y: 0,
width: width_padding.unwrap_or(16) * 2 + pixels as i32,
height: height_padding.unwrap_or(8) * 2 + pixels as i32,
},
reactive: true,
..Default::default()
}, },
reactive: true, parent_size: None,
..Default::default() grab: true,
}, parent_size: None, grab: true } }
} }
pub fn popup_container<'a, Message, Renderer>(content: impl Into<Element<'a, Message, Renderer>>,) -> crate::widget::widget::Container<'a, Message, Renderer> // TODO popup container which tracks the size of itself and requests the popup to resize to match
pub fn popup_container<'a, Message, Renderer>(
content: impl Into<Element<'a, Message, Renderer>>,
) -> crate::widget::widget::Container<'a, Message, Renderer>
where where
Renderer: iced_native::Renderer, Renderer: iced_native::Renderer + 'a,
<<Renderer as iced_native::Renderer>::Theme as iced_style::container::StyleSheet>::Style: From<theme::Container>, Renderer::Theme: widget::container::StyleSheet, Message: 'a,
<<Renderer as iced_native::Renderer>::Theme as iced_style::container::StyleSheet>::Style:
From<theme::Container>,
Renderer::Theme: widget::container::StyleSheet,
{ {
let anchor = std::env::var("COSMIC_PANEL_ANCHOR") let anchor = std::env::var("COSMIC_PANEL_ANCHOR")
.ok() .ok()
.map(|size| match size.parse::<PanelAnchor>() { .map(|size| match size.parse::<PanelAnchor>() {
Ok(p) => p, Ok(p) => p,
Err(_) => PanelAnchor::Top, Err(_) => PanelAnchor::Top,
}) })
.unwrap_or(PanelAnchor::Top); .unwrap_or(PanelAnchor::Top);
let (valign, halign) = match anchor { let (valign, halign) = match anchor {
PanelAnchor::Left => (Vertical::Center, Horizontal::Left), PanelAnchor::Left => (Vertical::Center, Horizontal::Left),
@ -83,14 +108,18 @@ where
PanelAnchor::Top => (Vertical::Top, Horizontal::Center), PanelAnchor::Top => (Vertical::Top, Horizontal::Center),
PanelAnchor::Bottom => (Vertical::Bottom, Horizontal::Center), PanelAnchor::Bottom => (Vertical::Bottom, Horizontal::Center),
}; };
crate::widget::widget::container(content) crate::widget::widget::container(crate::widget::widget::container(content).style(
.style(Container::Custom(|theme| Appearance { Container::Custom(|theme| Appearance {
text_color: Some(theme.cosmic().on_bg_color().into()), text_color: Some(theme.cosmic().on_bg_color().into()),
background: Some(theme.extended_palette().background.base.color.into()), background: Some(theme.extended_palette().background.base.color.into()),
border_radius: 12.0, border_radius: 12.0,
border_width: 0.0, border_width: 0.0,
border_color: Color::TRANSPARENT, border_color: Color::TRANSPARENT,
})) }),
))
.width(Length::Fill)
.height(Length::Fill)
.align_x(halign) .align_x(halign)
.align_y(valign) .align_y(valign)
} }