leyoda/cosmic-comp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

stacking: Roll off tab titles

Browse source
This commit is contained in:
Victoria Brekenfeld 2023-06-22 21:01:20 +02:00
parent c64f548044
commit 7bd6036926
2 changed files with 49 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/shell/element/stack/tab.rs
View file

@ -66,26 +66,33 @@ pub(super) enum TabBackgroundTheme {
Default,
}
impl TabBackgroundTheme {
fn background_color(&self) -> Color {
match self {
TabBackgroundTheme::ActiveActivated => Color::from_rgba(0.365, 0.365, 0.365, 1.0),
TabBackgroundTheme::ActiveDeactivated => Color::from_rgba(0.365, 0.365, 0.365, 1.0),
TabBackgroundTheme::Default => Color::from_rgba(0.26, 0.26, 0.26, 1.0),
}
}
}
impl Into<theme::Container> for TabBackgroundTheme {
fn into(self) -> theme::Container {
let background_color = cosmic::iced::Background::Color(self.background_color());
match self {
Self::ActiveActivated => {
theme::Container::custom(|theme| widget::container::Appearance {
theme::Container::custom(move |theme| widget::container::Appearance {
text_color: Some(Color::from(theme.cosmic().accent_text_color())),
background: Some(cosmic::iced::Background::Color(Color::from_rgba(
1.0, 1.0, 1.0, 0.1,
))),
background: Some(background_color),
border_radius: 0.0.into(),
border_width: 0.0,
border_color: Color::TRANSPARENT,
})
}
Self::ActiveDeactivated => {
theme::Container::custom(|_theme| widget::container::Appearance {
theme::Container::custom(move |_theme| widget::container::Appearance {
text_color: None,
background: Some(cosmic::iced::Background::Color(Color::from_rgba(
1.0, 1.0, 1.0, 0.1,
))),
background: Some(background_color),
border_radius: 0.0.into(),
border_width: 0.0,
border_color: Color::TRANSPARENT,
@ -199,6 +206,7 @@ impl<'a, Message: TabMessage> Tab<'a, Message> {
.horizontal_alignment(alignment::Horizontal::Left)
.vertical_alignment(alignment::Vertical::Center)
.apply(tab_text)
.background(self.background_theme.background_color())
.height(Length::Fill)
.width(Length::Fill)
.into(),

36
src/shell/element/stack/tab_text.rs
View file

@ -1,11 +1,12 @@
use cosmic::{
iced::Element,
iced_core::{
gradient,
layout::{Layout, Limits, Node},
mouse::Cursor,
renderer,
widget::{Tree, Widget},
Length, Point, Rectangle, Size,
Background, Color, Degrees, Gradient, Length, Point, Rectangle, Size,
},
iced_widget::text::StyleSheet as TextStyleSheet,
};
@ -16,6 +17,7 @@ where
Renderer::Theme: TextStyleSheet,
{
text: Element<'a, Message, Renderer>,
background: Color,
height: Length,
width: Length,
}
@ -27,7 +29,7 @@ where
Renderer: cosmic::iced_core::Renderer,
Renderer::Theme: TextStyleSheet,
{
TabText::new(text)
TabText::new(text, Color::TRANSPARENT)
}
impl<'a, Message, Renderer> TabText<'a, Message, Renderer>
@ -35,14 +37,20 @@ where
Renderer: cosmic::iced_core::Renderer,
Renderer::Theme: TextStyleSheet,
{
pub fn new(text: impl Into<Element<'a, Message, Renderer>>) -> Self {
pub fn new(text: impl Into<Element<'a, Message, Renderer>>, background: Color) -> Self {
TabText {
width: Length::Shrink,
height: Length::Shrink,
background,
text: text.into(),
}
}
pub fn background(mut self, background: Color) -> Self {
self.background = background;
self
}
pub fn width(mut self, width: impl Into<Length>) -> Self {
let width = width.into();
self.width = width;
@ -113,6 +121,28 @@ where
&bounds,
);
});
let gradient_bounds = Rectangle {
x: (bounds.x + bounds.width - 24.).max(bounds.x),
width: 24.0_f32.min(bounds.width),
..bounds
};
let mut transparent_background = self.background.clone();
transparent_background.a = 0.0;
renderer.fill_quad(
renderer::Quad {
bounds: gradient_bounds,
border_radius: 0.0.into(),
border_width: 0.0,
border_color: Color::TRANSPARENT,
},
Background::Gradient(Gradient::Linear(
gradient::Linear::new(Degrees(180.))
.add_stop(0.0, transparent_background)
.add_stop(1.0, self.background),
)),
);
}
}