Add default styling for nih_plug_vizia GUIs
This commit is contained in:
parent
f43d209a60
commit
e2c691ba55
1
nih_plug_vizia/assets/theme.css
Normal file
1
nih_plug_vizia/assets/theme.css
Normal file
|
@ -0,0 +1 @@
|
|||
/* Default styling for the widgets included in nih_plug_vizia */
|
|
@ -6,7 +6,8 @@ use vizia::Context;
|
|||
// This module provides a re-export and simple font wrappers around the re-exported fonts.
|
||||
pub use nih_plug_assets::*;
|
||||
|
||||
/// Register the fonts from this module so they can be used with VIZIA.
|
||||
/// Register the fonts from this module so they can be used with VIZIA. This is automatically called
|
||||
/// for you when using [`create_vizia_editor()`][super::create_vizia_editor()].
|
||||
pub fn register_fonts(cx: &mut Context) {
|
||||
cx.add_font_mem(NOTO_SANS_REGULAR, fonts::NOTO_SANS_REGULAR);
|
||||
cx.add_font_mem(NOTO_SANS_REGULAR_ITALIC, fonts::NOTO_SANS_REGULAR_ITALIC);
|
||||
|
|
|
@ -5,7 +5,7 @@ use crossbeam::atomic::AtomicCell;
|
|||
use nih_plug::prelude::{Editor, GuiContext, ParamSetter, ParentWindowHandle};
|
||||
use std::sync::atomic::{AtomicBool, Ordering};
|
||||
use std::sync::Arc;
|
||||
use vizia::{Application, Context, Model, WindowDescription};
|
||||
use vizia::{Application, Color, Context, Entity, Model, PropSet, WindowDescription};
|
||||
|
||||
// Re-export for convenience
|
||||
pub use vizia;
|
||||
|
@ -89,6 +89,22 @@ impl Editor for ViziaEditor {
|
|||
let window = Application::new(window_description, move |cx| {
|
||||
let setter = ParamSetter::new(context.as_ref());
|
||||
|
||||
// Set some default styles to match the iced integration
|
||||
// TODO: Maybe add a way to override this behavior
|
||||
// NOTE: vizia's font rendering looks way too dark and thick. Going one font weight
|
||||
// lower seems to compensate for this.
|
||||
assets::register_fonts(cx);
|
||||
cx.set_default_font(assets::NOTO_SANS_LIGHT);
|
||||
|
||||
// TOOD: `:root { background-color: #fafafa; }` in a stylesheet doesn't work
|
||||
Entity::root().set_background_color(cx, Color::rgb(250, 250, 250));
|
||||
// VIZIA uses points instead of pixels, this is 20px
|
||||
cx.add_theme("* { font-size: 15; }");
|
||||
|
||||
// There doesn't seem to be any way to bundle styles with a widget, so we'll always
|
||||
// include the style sheet for our custom widgets at context creation
|
||||
widgets::register_theme(cx);
|
||||
|
||||
// Any widget can change the parameters by emitting `ParamEvent` events. This model will
|
||||
// handle them automatically.
|
||||
widgets::ParamModel {
|
||||
|
|
|
@ -9,7 +9,13 @@ use nih_plug::param::internals::ParamPtr;
|
|||
use nih_plug::prelude::{GuiContext, Param};
|
||||
use std::sync::Arc;
|
||||
|
||||
use vizia::{Message, Model};
|
||||
use vizia::{Context, Model};
|
||||
|
||||
/// Register the default theme for the widgets exported by this module. This is automatically called
|
||||
/// for you when using [`create_vizia_editor()`][super::create_vizia_editor()].
|
||||
pub fn register_theme(cx: &mut Context) {
|
||||
cx.add_theme(include_str!("../assets/theme.css"));
|
||||
}
|
||||
|
||||
/// An event that updates a parameter's value. Since NIH-plug manages the parameters, interacting
|
||||
/// with parameter values with VIZIA works a little different from updating any other state. These
|
||||
|
|
|
@ -10,12 +10,7 @@ use crate::GainParams;
|
|||
/// VIZIA uses points instead of pixels for text
|
||||
const POINT_SCALE: f32 = 0.75;
|
||||
|
||||
const STYLE: &str = r#"
|
||||
* {
|
||||
/* VIZIA uses points instead of pixels */
|
||||
font-size: 15; /* 20px */
|
||||
}
|
||||
"#;
|
||||
const STYLE: &str = r#""#;
|
||||
|
||||
// Makes sense to also define this here, makes it a bit easier to keep track of
|
||||
pub(crate) fn default_state() -> Arc<ViziaState> {
|
||||
|
@ -28,8 +23,6 @@ pub(crate) fn create(
|
|||
editor_state: Arc<ViziaState>,
|
||||
) -> Option<Box<dyn Editor>> {
|
||||
create_vizia_editor(editor_state, |cx, setter| {
|
||||
// TOOD: `:root { background-color: #fafafa; }` in a stylesheet doesn't work
|
||||
Entity::root().set_background_color(cx, Color::rgb(250, 250, 250));
|
||||
cx.add_theme(STYLE);
|
||||
|
||||
// NOTE: vizia's font rendering looks way too dark and thick. Going one font weight lower
|
||||
|
|
Loading…
Reference in a new issue