Merge pull request #1432 from wash2/custom-theme
Add custom palette to built in theme
This commit is contained in:
commit
a8f510c399
4 changed files with 90 additions and 27 deletions
|
|
@ -14,9 +14,15 @@ struct ScrollableDemo {
|
||||||
variants: Vec<Variant>,
|
variants: Vec<Variant>,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, PartialEq, Eq, Clone, Copy)]
|
||||||
|
enum ThemeType {
|
||||||
|
Light,
|
||||||
|
Dark,
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Debug, Clone)]
|
#[derive(Debug, Clone)]
|
||||||
enum Message {
|
enum Message {
|
||||||
ThemeChanged(Theme),
|
ThemeChanged(ThemeType),
|
||||||
ScrollToTop(usize),
|
ScrollToTop(usize),
|
||||||
ScrollToBottom(usize),
|
ScrollToBottom(usize),
|
||||||
Scrolled(usize, f32),
|
Scrolled(usize, f32),
|
||||||
|
|
@ -45,7 +51,10 @@ impl Application for ScrollableDemo {
|
||||||
fn update(&mut self, message: Message) -> Command<Message> {
|
fn update(&mut self, message: Message) -> Command<Message> {
|
||||||
match message {
|
match message {
|
||||||
Message::ThemeChanged(theme) => {
|
Message::ThemeChanged(theme) => {
|
||||||
self.theme = theme;
|
self.theme = match theme {
|
||||||
|
ThemeType::Light => Theme::Light,
|
||||||
|
ThemeType::Dark => Theme::Dark,
|
||||||
|
};
|
||||||
|
|
||||||
Command::none()
|
Command::none()
|
||||||
}
|
}
|
||||||
|
|
@ -78,17 +87,15 @@ impl Application for ScrollableDemo {
|
||||||
}
|
}
|
||||||
|
|
||||||
fn view(&self) -> Element<Message> {
|
fn view(&self) -> Element<Message> {
|
||||||
let ScrollableDemo {
|
let ScrollableDemo { variants, .. } = self;
|
||||||
theme, variants, ..
|
|
||||||
} = self;
|
|
||||||
|
|
||||||
let choose_theme = [Theme::Light, Theme::Dark].iter().fold(
|
let choose_theme = [ThemeType::Light, ThemeType::Dark].iter().fold(
|
||||||
column!["Choose a theme:"].spacing(10),
|
column!["Choose a theme:"].spacing(10),
|
||||||
|column, option| {
|
|column, option| {
|
||||||
column.push(radio(
|
column.push(radio(
|
||||||
format!("{:?}", option),
|
format!("{:?}", option),
|
||||||
*option,
|
*option,
|
||||||
Some(*theme),
|
Some(*option),
|
||||||
Message::ThemeChanged,
|
Message::ThemeChanged,
|
||||||
))
|
))
|
||||||
},
|
},
|
||||||
|
|
@ -198,7 +205,7 @@ impl Application for ScrollableDemo {
|
||||||
}
|
}
|
||||||
|
|
||||||
fn theme(&self) -> Theme {
|
fn theme(&self) -> Theme {
|
||||||
self.theme
|
self.theme.clone()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,10 @@
|
||||||
|
use iced::theme::{self, Theme};
|
||||||
use iced::widget::{
|
use iced::widget::{
|
||||||
button, checkbox, column, container, horizontal_rule, progress_bar, radio,
|
button, checkbox, column, container, horizontal_rule, progress_bar, radio,
|
||||||
row, scrollable, slider, text, text_input, toggler, vertical_rule,
|
row, scrollable, slider, text, text_input, toggler, vertical_rule,
|
||||||
vertical_space,
|
vertical_space,
|
||||||
};
|
};
|
||||||
use iced::{Alignment, Element, Length, Sandbox, Settings, Theme};
|
use iced::{Alignment, Color, Element, Length, Sandbox, Settings};
|
||||||
|
|
||||||
pub fn main() -> iced::Result {
|
pub fn main() -> iced::Result {
|
||||||
Styling::run(Settings::default())
|
Styling::run(Settings::default())
|
||||||
|
|
@ -18,9 +19,16 @@ struct Styling {
|
||||||
toggler_value: bool,
|
toggler_value: bool,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, PartialEq, Eq, Clone, Copy)]
|
||||||
|
enum ThemeType {
|
||||||
|
Light,
|
||||||
|
Dark,
|
||||||
|
Custom,
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Debug, Clone)]
|
#[derive(Debug, Clone)]
|
||||||
enum Message {
|
enum Message {
|
||||||
ThemeChanged(Theme),
|
ThemeChanged(ThemeType),
|
||||||
InputChanged(String),
|
InputChanged(String),
|
||||||
ButtonPressed,
|
ButtonPressed,
|
||||||
SliderChanged(f32),
|
SliderChanged(f32),
|
||||||
|
|
@ -41,7 +49,19 @@ impl Sandbox for Styling {
|
||||||
|
|
||||||
fn update(&mut self, message: Message) {
|
fn update(&mut self, message: Message) {
|
||||||
match message {
|
match message {
|
||||||
Message::ThemeChanged(theme) => self.theme = theme,
|
Message::ThemeChanged(theme) => {
|
||||||
|
self.theme = match theme {
|
||||||
|
ThemeType::Light => Theme::Light,
|
||||||
|
ThemeType::Dark => Theme::Dark,
|
||||||
|
ThemeType::Custom => Theme::custom(theme::Palette {
|
||||||
|
background: Color::from_rgb(1.0, 0.9, 1.0),
|
||||||
|
text: Color::BLACK,
|
||||||
|
primary: Color::from_rgb(0.5, 0.5, 0.0),
|
||||||
|
success: Color::from_rgb(0.0, 1.0, 0.0),
|
||||||
|
danger: Color::from_rgb(1.0, 0.0, 0.0),
|
||||||
|
}),
|
||||||
|
}
|
||||||
|
}
|
||||||
Message::InputChanged(value) => self.input_value = value,
|
Message::InputChanged(value) => self.input_value = value,
|
||||||
Message::ButtonPressed => {}
|
Message::ButtonPressed => {}
|
||||||
Message::SliderChanged(value) => self.slider_value = value,
|
Message::SliderChanged(value) => self.slider_value = value,
|
||||||
|
|
@ -51,17 +71,24 @@ impl Sandbox for Styling {
|
||||||
}
|
}
|
||||||
|
|
||||||
fn view(&self) -> Element<Message> {
|
fn view(&self) -> Element<Message> {
|
||||||
let choose_theme = [Theme::Light, Theme::Dark].iter().fold(
|
let choose_theme =
|
||||||
column![text("Choose a theme:")].spacing(10),
|
[ThemeType::Light, ThemeType::Dark, ThemeType::Custom]
|
||||||
|column, theme| {
|
.iter()
|
||||||
column.push(radio(
|
.fold(
|
||||||
format!("{:?}", theme),
|
column![text("Choose a theme:")].spacing(10),
|
||||||
*theme,
|
|column, theme| {
|
||||||
Some(self.theme),
|
column.push(radio(
|
||||||
Message::ThemeChanged,
|
format!("{:?}", theme),
|
||||||
))
|
*theme,
|
||||||
},
|
Some(match self.theme {
|
||||||
);
|
Theme::Light => ThemeType::Light,
|
||||||
|
Theme::Dark => ThemeType::Dark,
|
||||||
|
Theme::Custom { .. } => ThemeType::Custom,
|
||||||
|
}),
|
||||||
|
Message::ThemeChanged,
|
||||||
|
))
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
let text_input = text_input(
|
let text_input = text_input(
|
||||||
"Type something...",
|
"Type something...",
|
||||||
|
|
@ -132,6 +159,6 @@ impl Sandbox for Styling {
|
||||||
}
|
}
|
||||||
|
|
||||||
fn theme(&self) -> Theme {
|
fn theme(&self) -> Theme {
|
||||||
self.theme
|
self.theme.clone()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
pub mod palette;
|
pub mod palette;
|
||||||
|
|
||||||
|
use self::palette::Extended;
|
||||||
pub use self::palette::Palette;
|
pub use self::palette::Palette;
|
||||||
|
|
||||||
use crate::application;
|
use crate::application;
|
||||||
|
|
@ -20,17 +21,23 @@ use crate::toggler;
|
||||||
|
|
||||||
use iced_core::{Background, Color};
|
use iced_core::{Background, Color};
|
||||||
|
|
||||||
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
|
#[derive(Debug, Clone, PartialEq)]
|
||||||
pub enum Theme {
|
pub enum Theme {
|
||||||
Light,
|
Light,
|
||||||
Dark,
|
Dark,
|
||||||
|
Custom(Box<Custom>),
|
||||||
}
|
}
|
||||||
|
|
||||||
impl Theme {
|
impl Theme {
|
||||||
pub fn palette(self) -> Palette {
|
pub fn custom(palette: Palette) -> Self {
|
||||||
|
Self::Custom(Box::new(Custom::new(palette)))
|
||||||
|
}
|
||||||
|
|
||||||
|
pub fn palette(&self) -> Palette {
|
||||||
match self {
|
match self {
|
||||||
Self::Light => Palette::LIGHT,
|
Self::Light => Palette::LIGHT,
|
||||||
Self::Dark => Palette::DARK,
|
Self::Dark => Palette::DARK,
|
||||||
|
Self::Custom(custom) => custom.palette,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -38,6 +45,7 @@ impl Theme {
|
||||||
match self {
|
match self {
|
||||||
Self::Light => &palette::EXTENDED_LIGHT,
|
Self::Light => &palette::EXTENDED_LIGHT,
|
||||||
Self::Dark => &palette::EXTENDED_DARK,
|
Self::Dark => &palette::EXTENDED_DARK,
|
||||||
|
Self::Custom(custom) => &custom.extended,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -48,6 +56,21 @@ impl Default for Theme {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
|
pub struct Custom {
|
||||||
|
palette: Palette,
|
||||||
|
extended: Extended,
|
||||||
|
}
|
||||||
|
|
||||||
|
impl Custom {
|
||||||
|
pub fn new(palette: Palette) -> Self {
|
||||||
|
Self {
|
||||||
|
palette,
|
||||||
|
extended: Extended::generate(palette),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Debug, Clone, Copy)]
|
#[derive(Debug, Clone, Copy)]
|
||||||
pub enum Application {
|
pub enum Application {
|
||||||
Default,
|
Default,
|
||||||
|
|
@ -71,7 +94,7 @@ impl application::StyleSheet for Theme {
|
||||||
background_color: palette.background.base.color,
|
background_color: palette.background.base.color,
|
||||||
text_color: palette.background.base.text,
|
text_color: palette.background.base.text,
|
||||||
},
|
},
|
||||||
Application::Custom(f) => f(*self),
|
Application::Custom(f) => f(self.clone()),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -58,6 +58,7 @@ impl Palette {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Extended {
|
pub struct Extended {
|
||||||
pub background: Background,
|
pub background: Background,
|
||||||
pub primary: Primary,
|
pub primary: Primary,
|
||||||
|
|
@ -95,7 +96,7 @@ impl Extended {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Debug, Clone, Copy)]
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Pair {
|
pub struct Pair {
|
||||||
pub color: Color,
|
pub color: Color,
|
||||||
pub text: Color,
|
pub text: Color,
|
||||||
|
|
@ -110,6 +111,7 @@ impl Pair {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Background {
|
pub struct Background {
|
||||||
pub base: Pair,
|
pub base: Pair,
|
||||||
pub weak: Pair,
|
pub weak: Pair,
|
||||||
|
|
@ -129,6 +131,7 @@ impl Background {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Primary {
|
pub struct Primary {
|
||||||
pub base: Pair,
|
pub base: Pair,
|
||||||
pub weak: Pair,
|
pub weak: Pair,
|
||||||
|
|
@ -148,6 +151,7 @@ impl Primary {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Secondary {
|
pub struct Secondary {
|
||||||
pub base: Pair,
|
pub base: Pair,
|
||||||
pub weak: Pair,
|
pub weak: Pair,
|
||||||
|
|
@ -168,6 +172,7 @@ impl Secondary {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Success {
|
pub struct Success {
|
||||||
pub base: Pair,
|
pub base: Pair,
|
||||||
pub weak: Pair,
|
pub weak: Pair,
|
||||||
|
|
@ -187,6 +192,7 @@ impl Success {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Copy, PartialEq)]
|
||||||
pub struct Danger {
|
pub struct Danger {
|
||||||
pub base: Pair,
|
pub base: Pair,
|
||||||
pub weak: Pair,
|
pub weak: Pair,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue