zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-11-07 20:39:04 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add ui_font_size setting (#3199)

Browse Source 
This PR adds a new `ui_font_size` setting that can be used to control
the scale of the entire UI.

We use the value in this setting to set the base rem size of the window.

Release Notes:

- N/A
This commit is contained in:
Marshall Bowers 2023-11-01 18:11:12 +01:00 committed by GitHub
parent bd61d71018
commit b910bbf002
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 58 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
Cargo.lock generated
View File

@ -9666,6 +9666,7 @@ dependencies = [
"itertools 0.11.0",
"rand 0.8.5",
"serde",
"settings2",
"smallvec",
"strum",
"theme2",

6
crates/gpui2/src/window.rs
View File

@ -541,6 +541,12 @@ impl<'a, 'w> WindowContext<'a, 'w> {
self.window.rem_size
}
/// Sets the size of an em for the base font of the application. Adjusting this value allows the
/// UI to scale, just like zooming a web page.
pub fn set_rem_size(&mut self, rem_size: impl Into<Pixels>) {
self.window.rem_size = rem_size.into();
}
/// The line height associated with the current text style.
pub fn line_height(&self) -> Pixels {
let rem_size = self.rem_size();

7
crates/storybook2/src/storybook2.rs
View File

@ -81,7 +81,12 @@ fn main() {
}),
..Default::default()
},
move |cx| cx.build_view(|cx| StoryWrapper::new(selector.story(cx))),
move |cx| {
let theme_settings = ThemeSettings::get_global(cx);
cx.set_rem_size(theme_settings.ui_font_size);
cx.build_view(|cx| StoryWrapper::new(selector.story(cx)))
},
);
cx.activate(true);

12
crates/theme2/src/settings.rs
View File

@ -17,6 +17,7 @@ const MIN_LINE_HEIGHT: f32 = 1.0;
#[derive(Clone)]
pub struct ThemeSettings {
pub ui_font_size: Pixels,
pub buffer_font: Font,
pub buffer_font_size: Pixels,
pub buffer_line_height: BufferLineHeight,
@ -28,6 +29,8 @@ pub struct AdjustedBufferFontSize(Option<Pixels>);
#[derive(Clone, Debug, Default, Serialize, Deserialize, JsonSchema)]
pub struct ThemeSettingsContent {
#[serde(default)]
pub ui_font_size: Option<f32>,
#[serde(default)]
pub buffer_font_family: Option<String>,
#[serde(default)]
@ -115,6 +118,7 @@ impl settings2::Settings for ThemeSettings {
let themes = cx.default_global::<Arc<ThemeRegistry>>();
let mut this = Self {
ui_font_size: defaults.ui_font_size.unwrap_or(16.).into(),
buffer_font: Font {
family: defaults.buffer_font_family.clone().unwrap().into(),
features: defaults.buffer_font_features.clone().unwrap(),
@ -123,9 +127,10 @@ impl settings2::Settings for ThemeSettings {
},
buffer_font_size: defaults.buffer_font_size.unwrap().into(),
buffer_line_height: defaults.buffer_line_height.unwrap(),
active_theme: themes.get("Zed Pro Moonlight").unwrap(),
// todo!(Read the theme name from the settings)
// active_theme: themes.get(defaults.theme.as_ref().unwrap()).unwrap(),
active_theme: themes
.get(defaults.theme.as_ref().unwrap())
.or(themes.get("Zed Pro Moonlight"))
.unwrap(),
};
for value in user_values.into_iter().copied().cloned() {
@ -142,6 +147,7 @@ impl settings2::Settings for ThemeSettings {
}
}
merge(&mut this.ui_font_size, value.ui_font_size.map(Into::into));
merge(
&mut this.buffer_font_size,
value.buffer_font_size.map(Into::into),

1
crates/ui2/Cargo.toml
View File

@ -10,6 +10,7 @@ chrono = "0.4"
gpui2 = { path = "../gpui2" }
itertools = { version = "0.11.0", optional = true }
serde.workspace = true
settings2 = { path = "../settings2" }
smallvec.workspace = true
strum = { version = "0.25.0", features = ["derive"] }
theme2 = { path = "../theme2" }

6
crates/ui2/src/components/icon_button.rs
View File

@ -1,6 +1,6 @@
use std::sync::Arc;
use gpui2::MouseButton;
use gpui2::{rems, MouseButton};
use crate::{h_stack, prelude::*};
use crate::{ClickHandler, Icon, IconColor, IconElement};
@ -88,8 +88,8 @@ impl<V: 'static> IconButton<V> {
.id(self.id.clone())
.justify_center()
.rounded_md()
.py(ui_size(cx, 0.25))
.px(ui_size(cx, 6. / 14.))
.py(rems(0.21875))
.px(rems(0.375))
.bg(bg_color)
.hover(|style| style.bg(bg_hover_color))
.active(|style| style.bg(bg_active_color))

42
crates/ui2/src/components/workspace.rs
View File

@ -1,14 +1,16 @@
use std::sync::Arc;
use chrono::DateTime;
use gpui2::{px, relative, rems, Div, Render, Size, View, VisualContext};
use gpui2::{px, relative, Div, Render, Size, View, VisualContext};
use settings2::Settings;
use theme2::ThemeSettings;
use crate::{prelude::*, NotificationsPanel};
use crate::prelude::*;
use crate::{
static_livestream, user_settings_mut, v_stack, AssistantPanel, Button, ChatMessage, ChatPanel,
CollabPanel, EditorPane, FakeSettings, Label, LanguageSelector, Pane, PaneGroup, Panel,
PanelAllowedSides, PanelSide, ProjectPanel, SettingValue, SplitDirection, StatusBar, Terminal,
TitleBar, Toast, ToastOrigin,
static_livestream, v_stack, AssistantPanel, Button, ChatMessage, ChatPanel, CollabPanel,
EditorPane, Label, LanguageSelector, NotificationsPanel, Pane, PaneGroup, Panel,
PanelAllowedSides, PanelSide, ProjectPanel, SplitDirection, StatusBar, Terminal, TitleBar,
Toast, ToastOrigin,
};
#[derive(Clone)]
@ -150,6 +152,18 @@ impl Workspace {
pub fn debug_toggle_user_settings(&mut self, cx: &mut ViewContext<Self>) {
self.debug.enable_user_settings = !self.debug.enable_user_settings;
let mut theme_settings = ThemeSettings::get_global(cx).clone();
if self.debug.enable_user_settings {
theme_settings.ui_font_size = 18.0.into();
} else {
theme_settings.ui_font_size = 16.0.into();
}
ThemeSettings::override_global(theme_settings.clone(), cx);
cx.set_rem_size(theme_settings.ui_font_size);
cx.notify();
}
@ -179,20 +193,6 @@ impl Render for Workspace {
type Element = Div<Self>;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Div<Self> {
// HACK: This should happen inside of `debug_toggle_user_settings`, but
// we don't have `cx.global::<FakeSettings>()` in event handlers at the moment.
// Need to talk with Nathan/Antonio about this.
{
let settings = user_settings_mut(cx);
if self.debug.enable_user_settings {
settings.list_indent_depth = SettingValue::UserDefined(rems(0.5).into());
settings.ui_scale = SettingValue::UserDefined(1.25);
} else {
*settings = FakeSettings::default();
}
}
let root_group = PaneGroup::new_panes(
vec![Pane::new(
"pane-0",
@ -321,7 +321,7 @@ impl Render for Workspace {
v_stack()
.z_index(9)
.absolute()
.bottom_10()
.top_20()
.left_1_4()
.w_40()
.gap_2()

10
crates/ui2/src/elements/button.rs
View File

@ -1,9 +1,9 @@
use std::sync::Arc;
use gpui2::{div, DefiniteLength, Hsla, MouseButton, WindowContext};
use gpui2::{div, rems, DefiniteLength, Hsla, MouseButton, WindowContext};
use crate::{h_stack, Icon, IconColor, IconElement, Label, LabelColor};
use crate::{prelude::*, LineHeightStyle};
use crate::prelude::*;
use crate::{h_stack, Icon, IconColor, IconElement, Label, LabelColor, LineHeightStyle};
#[derive(Default, PartialEq, Clone, Copy)]
pub enum IconPosition {
@ -151,7 +151,7 @@ impl<V: 'static> Button<V> {
.relative()
.id(SharedString::from(format!("{}", self.label)))
.p_1()
.text_size(ui_size(cx, 1.))
.text_size(rems(1.))
.rounded_md()
.bg(self.variant.bg_color(cx))
.hover(|style| style.bg(self.variant.bg_color_hover(cx)))
@ -198,7 +198,7 @@ impl<V: 'static> ButtonGroup<V> {
}
fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
let mut el = h_stack().text_size(ui_size(cx, 1.));
let mut el = h_stack().text_size(rems(1.));
for button in self.buttons {
el = el.child(button.render(_view, cx));

6
crates/ui2/src/elements/icon.rs
View File

@ -1,4 +1,4 @@
use gpui2::{svg, Hsla};
use gpui2::{rems, svg, Hsla};
use strum::EnumIter;
use crate::prelude::*;
@ -175,8 +175,8 @@ impl IconElement {
fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
let fill = self.color.color(cx);
let svg_size = match self.size {
IconSize::Small => ui_size(cx, 12. / 14.),
IconSize::Medium => ui_size(cx, 15. / 14.),
IconSize::Small => rems(0.75),
IconSize::Medium => rems(0.9375),
};
svg()

4
crates/ui2/src/elements/label.rs
View File

@ -1,4 +1,4 @@
use gpui2::{relative, Hsla, WindowContext};
use gpui2::{relative, rems, Hsla, WindowContext};
use smallvec::SmallVec;
use crate::prelude::*;
@ -86,7 +86,7 @@ impl Label {
.bg(LabelColor::Hidden.hsla(cx)),
)
})
.text_size(ui_size(cx, 1.))
.text_size(rems(1.))
.when(self.line_height_style == LineHeightStyle::UILabel, |this| {
this.line_height(relative(1.))
})

11
crates/ui2/src/prelude.rs
View File

@ -4,21 +4,12 @@ pub use gpui2::{
};
pub use crate::elevation::*;
use crate::settings::user_settings;
pub use crate::ButtonVariant;
pub use theme2::ActiveTheme;
use gpui2::{rems, Hsla, Rems};
use gpui2::Hsla;
use strum::EnumIter;
pub fn ui_size(cx: &mut WindowContext, size: f32) -> Rems {
const UI_SCALE_RATIO: f32 = 0.875;
let settings = user_settings(cx);
rems(*settings.ui_scale * UI_SCALE_RATIO * size)
}
#[derive(Debug, Default, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy, EnumIter)]
pub enum FileSystemStatus {
#[default]

2
crates/ui2/src/settings.rs
View File

@ -58,7 +58,6 @@ pub struct FakeSettings {
pub list_disclosure_style: SettingValue<DisclosureControlStyle>,
pub list_indent_depth: SettingValue<AbsoluteLength>,
pub titlebar: TitlebarSettings,
pub ui_scale: SettingValue<f32>,
}
impl Default for FakeSettings {
@ -68,7 +67,6 @@ impl Default for FakeSettings {
list_disclosure_style: SettingValue::Default(DisclosureControlStyle::ChevronOnHover),
list_indent_depth: SettingValue::Default(rems(0.3).into()),
default_panel_size: SettingValue::Default(rems(16.).into()),
ui_scale: SettingValue::Default(1.),
}
}
}