Allow a button to take a color (#3315)

[[PR Description]]
- Allows a button to take a color and resolve it into `IconColor` and
`LabelColor`
- Extend `IconColor` and `LabelColor` to allow them to take a
`Player(i)`
- `impl From<LabelColor> for IconColor`

Release Notes:

- N/A
This commit is contained in:
Nate Butler 2023-11-14 10:36:52 -05:00 committed by GitHub
commit 6b366c102e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 105 additions and 42 deletions

View file

@ -87,6 +87,7 @@ pub struct Button<V: 'static> {
label: SharedString,
variant: ButtonVariant,
width: Option<DefiniteLength>,
color: Option<LabelColor>,
}
impl<V: 'static> Button<V> {
@ -99,6 +100,7 @@ impl<V: 'static> Button<V> {
label: label.into(),
variant: Default::default(),
width: Default::default(),
color: None,
}
}
@ -139,25 +141,24 @@ impl<V: 'static> Button<V> {
self
}
fn label_color(&self) -> LabelColor {
pub fn color(mut self, color: Option<LabelColor>) -> Self {
self.color = color;
self
}
pub fn label_color(&self, color: Option<LabelColor>) -> LabelColor {
if self.disabled {
LabelColor::Disabled
} else if let Some(color) = color {
color
} else {
Default::default()
}
}
fn icon_color(&self) -> IconColor {
if self.disabled {
IconColor::Disabled
} else {
Default::default()
}
}
fn render_label(&self) -> Label {
fn render_label(&self, color: LabelColor) -> Label {
Label::new(self.label.clone())
.color(self.label_color())
.color(color)
.line_height_style(LineHeightStyle::UILabel)
}
@ -166,7 +167,11 @@ impl<V: 'static> Button<V> {
}
pub fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
let icon_color = self.icon_color();
let (icon_color, label_color) = match (self.disabled, self.color) {
(true, _) => (IconColor::Disabled, LabelColor::Disabled),
(_, None) => (IconColor::Default, LabelColor::Default),
(_, Some(color)) => (IconColor::from(color), color),
};
let mut button = h_stack()
.id(SharedString::from(format!("{}", self.label)))
@ -182,16 +187,16 @@ impl<V: 'static> Button<V> {
(Some(_), Some(IconPosition::Left)) => {
button = button
.gap_1()
.child(self.render_label())
.child(self.render_label(label_color))
.children(self.render_icon(icon_color))
}
(Some(_), Some(IconPosition::Right)) => {
button = button
.gap_1()
.children(self.render_icon(icon_color))
.child(self.render_label())
.child(self.render_label(label_color))
}
(_, _) => button = button.child(self.render_label()),
(_, _) => button = button.child(self.render_label(label_color)),
}
if let Some(width) = self.width {

View file

@ -1,7 +1,7 @@
use gpui::{rems, svg, Hsla};
use strum::EnumIter;
use crate::prelude::*;
use crate::{prelude::*, LabelColor};
#[derive(Default, PartialEq, Copy, Clone)]
pub enum IconSize {
@ -14,15 +14,20 @@ pub enum IconSize {
pub enum IconColor {
#[default]
Default,
Muted,
Disabled,
Placeholder,
Accent,
Created,
Deleted,
Disabled,
Error,
Warning,
Success,
Hidden,
Info,
Modified,
Muted,
Placeholder,
Player(u32),
Selected,
Success,
Warning,
}
impl IconColor {
@ -38,6 +43,33 @@ impl IconColor {
IconColor::Success => cx.theme().status().success,
IconColor::Info => cx.theme().status().info,
IconColor::Selected => cx.theme().colors().icon_accent,
IconColor::Player(i) => cx.theme().styles.player.0[i.clone() as usize].cursor,
IconColor::Created => cx.theme().status().created,
IconColor::Modified => cx.theme().status().modified,
IconColor::Deleted => cx.theme().status().deleted,
IconColor::Hidden => cx.theme().status().hidden,
}
}
}
impl From<LabelColor> for IconColor {
fn from(label: LabelColor) -> Self {
match label {
LabelColor::Default => IconColor::Default,
LabelColor::Muted => IconColor::Muted,
LabelColor::Disabled => IconColor::Disabled,
LabelColor::Placeholder => IconColor::Placeholder,
LabelColor::Accent => IconColor::Accent,
LabelColor::Error => IconColor::Error,
LabelColor::Warning => IconColor::Warning,
LabelColor::Success => IconColor::Success,
LabelColor::Info => IconColor::Info,
LabelColor::Selected => IconColor::Selected,
LabelColor::Player(i) => IconColor::Player(i),
LabelColor::Created => IconColor::Created,
LabelColor::Modified => IconColor::Modified,
LabelColor::Deleted => IconColor::Deleted,
LabelColor::Hidden => IconColor::Hidden,
}
}
}

View file

@ -1,6 +1,6 @@
use std::sync::Arc;
use gpui::{rems, MouseButton};
use gpui::MouseButton;
use crate::{h_stack, prelude::*};
use crate::{ClickHandler, Icon, IconColor, IconElement};
@ -88,9 +88,7 @@ impl<V: 'static> IconButton<V> {
.id(self.id.clone())
.justify_center()
.rounded_md()
// todo!("Where do these numbers come from?")
.py(rems(0.21875))
.px(rems(0.375))
.p_1()
.bg(bg_color)
.hover(|style| style.bg(bg_hover_color))
.active(|style| style.bg(bg_active_color))

View file

@ -7,28 +7,40 @@ use crate::styled_ext::StyledExt;
pub enum LabelColor {
#[default]
Default,
Muted,
Accent,
Created,
Modified,
Deleted,
Disabled,
Error,
Hidden,
Info,
Modified,
Muted,
Placeholder,
Accent,
Player(u32),
Selected,
Success,
Warning,
}
impl LabelColor {
pub fn hsla(&self, cx: &WindowContext) -> Hsla {
match self {
Self::Default => cx.theme().colors().text,
Self::Muted => cx.theme().colors().text_muted,
Self::Created => cx.theme().status().created,
Self::Modified => cx.theme().status().modified,
Self::Deleted => cx.theme().status().deleted,
Self::Disabled => cx.theme().colors().text_disabled,
Self::Hidden => cx.theme().status().hidden,
Self::Placeholder => cx.theme().colors().text_placeholder,
Self::Accent => cx.theme().colors().text_accent,
LabelColor::Default => cx.theme().colors().text,
LabelColor::Muted => cx.theme().colors().text_muted,
LabelColor::Created => cx.theme().status().created,
LabelColor::Modified => cx.theme().status().modified,
LabelColor::Deleted => cx.theme().status().deleted,
LabelColor::Disabled => cx.theme().colors().text_disabled,
LabelColor::Hidden => cx.theme().status().hidden,
LabelColor::Info => cx.theme().status().info,
LabelColor::Placeholder => cx.theme().colors().text_placeholder,
LabelColor::Accent => cx.theme().colors().text_accent,
LabelColor::Player(i) => cx.theme().styles.player.0[i.clone() as usize].cursor,
LabelColor::Error => cx.theme().status().error,
LabelColor::Selected => cx.theme().colors().text_accent,
LabelColor::Success => cx.theme().status().success,
LabelColor::Warning => cx.theme().status().warning,
}
}
}

View file

@ -69,7 +69,7 @@ use std::{
};
use theme2::ActiveTheme;
pub use toolbar::{ToolbarItemLocation, ToolbarItemView};
use ui::{h_stack, Label};
use ui::{h_stack, Button, ButtonVariant, Label, LabelColor};
use util::ResultExt;
use uuid::Uuid;
use workspace_settings::{AutosaveSetting, WorkspaceSettings};
@ -2644,19 +2644,35 @@ impl Workspace {
h_stack()
.id("titlebar")
.justify_between()
.w_full()
.h(rems(1.75))
.bg(cx.theme().colors().title_bar_background)
.when(
!matches!(cx.window_bounds(), WindowBounds::Fullscreen),
|s| s.pl_20(),
)
.w_full()
.h(rems(1.75))
.bg(cx.theme().colors().title_bar_background)
.on_click(|_, event, cx| {
if event.up.click_count == 2 {
cx.zoom_window();
}
})
.child(h_stack().child(Label::new("Left side titlebar item"))) // self.titlebar_item
.child(
h_stack()
// TODO - Add player menu
.child(
Button::new("player")
.variant(ButtonVariant::Ghost)
.color(Some(LabelColor::Player(0))),
)
// TODO - Add project menu
.child(Button::new("project_name").variant(ButtonVariant::Ghost))
// TODO - Add git menu
.child(
Button::new("branch_name")
.variant(ButtonVariant::Ghost)
.color(Some(LabelColor::Muted)),
),
) // self.titlebar_item
.child(h_stack().child(Label::new("Right side titlebar item")))
}