Implement theme styling for TextInput
This commit is contained in:
parent
835877fc63
commit
ce53d3933c
12 changed files with 145 additions and 183 deletions
|
|
@ -95,7 +95,7 @@ mod numeric_input {
|
|||
for NumericInput<'a, Message>
|
||||
where
|
||||
Renderer: 'a + text::Renderer,
|
||||
Renderer::Theme: button::StyleSheet,
|
||||
Renderer::Theme: button::StyleSheet + text_input::StyleSheet,
|
||||
{
|
||||
type Event = Event;
|
||||
|
||||
|
|
@ -173,7 +173,7 @@ mod numeric_input {
|
|||
where
|
||||
Message: 'a,
|
||||
Renderer: text::Renderer + 'a,
|
||||
Renderer::Theme: button::StyleSheet,
|
||||
Renderer::Theme: button::StyleSheet + text_input::StyleSheet,
|
||||
{
|
||||
fn from(numeric_input: NumericInput<'a, Message>) -> Self {
|
||||
component::view(numeric_input)
|
||||
|
|
|
|||
|
|
@ -89,7 +89,8 @@ mod numeric_input {
|
|||
impl<Message, Renderer> Component<Message, Renderer> for NumericInput<Message>
|
||||
where
|
||||
Renderer: text::Renderer + 'static,
|
||||
Renderer::Theme: widget::button::StyleSheet,
|
||||
Renderer::Theme:
|
||||
widget::button::StyleSheet + widget::text_input::StyleSheet,
|
||||
{
|
||||
type State = ();
|
||||
type Event = Event;
|
||||
|
|
@ -160,7 +161,8 @@ mod numeric_input {
|
|||
where
|
||||
Message: 'a,
|
||||
Renderer: 'static + text::Renderer,
|
||||
Renderer::Theme: widget::button::StyleSheet,
|
||||
Renderer::Theme:
|
||||
widget::button::StyleSheet + widget::text_input::StyleSheet,
|
||||
{
|
||||
fn from(numeric_input: NumericInput<Message>) -> Self {
|
||||
pure::component(numeric_input)
|
||||
|
|
|
|||
|
|
@ -43,12 +43,6 @@ mod dark {
|
|||
0x3F as f32 / 255.0,
|
||||
);
|
||||
|
||||
const SURFACE: Color = Color::from_rgb(
|
||||
0x40 as f32 / 255.0,
|
||||
0x44 as f32 / 255.0,
|
||||
0x4B as f32 / 255.0,
|
||||
);
|
||||
|
||||
const ACCENT: Color = Color::from_rgb(
|
||||
0x6F as f32 / 255.0,
|
||||
0xFF as f32 / 255.0,
|
||||
|
|
|
|||
|
|
@ -77,8 +77,7 @@ impl Sandbox for Styling {
|
|||
Message::InputChanged,
|
||||
)
|
||||
.padding(10)
|
||||
.size(20)
|
||||
.style(self.theme);
|
||||
.size(20);
|
||||
|
||||
let button = Button::new(&mut self.button, Text::new("Submit"))
|
||||
.padding(10)
|
||||
|
|
@ -157,7 +156,7 @@ impl Sandbox for Styling {
|
|||
}
|
||||
|
||||
mod style {
|
||||
use iced::{scrollable, text_input};
|
||||
use iced::scrollable;
|
||||
|
||||
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
|
||||
pub enum Theme {
|
||||
|
|
@ -175,15 +174,6 @@ mod style {
|
|||
}
|
||||
}
|
||||
|
||||
impl<'a> From<Theme> for Box<dyn text_input::StyleSheet + 'a> {
|
||||
fn from(theme: Theme) -> Self {
|
||||
match theme {
|
||||
Theme::Light => Default::default(),
|
||||
Theme::Dark => dark::TextInput.into(),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
impl<'a> From<Theme> for Box<dyn scrollable::StyleSheet + 'a> {
|
||||
fn from(theme: Theme) -> Self {
|
||||
match theme {
|
||||
|
|
@ -194,7 +184,7 @@ mod style {
|
|||
}
|
||||
|
||||
mod dark {
|
||||
use iced::{scrollable, text_input, Color};
|
||||
use iced::{scrollable, Color};
|
||||
|
||||
const SURFACE: Color = Color::from_rgb(
|
||||
0x40 as f32 / 255.0,
|
||||
|
|
@ -202,12 +192,6 @@ mod style {
|
|||
0x4B as f32 / 255.0,
|
||||
);
|
||||
|
||||
const ACCENT: Color = Color::from_rgb(
|
||||
0x6F as f32 / 255.0,
|
||||
0xFF as f32 / 255.0,
|
||||
0xE9 as f32 / 255.0,
|
||||
);
|
||||
|
||||
const ACTIVE: Color = Color::from_rgb(
|
||||
0x72 as f32 / 255.0,
|
||||
0x89 as f32 / 255.0,
|
||||
|
|
@ -220,47 +204,6 @@ mod style {
|
|||
0xC4 as f32 / 255.0,
|
||||
);
|
||||
|
||||
pub struct TextInput;
|
||||
|
||||
impl text_input::StyleSheet for TextInput {
|
||||
fn active(&self) -> text_input::Style {
|
||||
text_input::Style {
|
||||
background: SURFACE.into(),
|
||||
border_radius: 2.0,
|
||||
border_width: 0.0,
|
||||
border_color: Color::TRANSPARENT,
|
||||
}
|
||||
}
|
||||
|
||||
fn focused(&self) -> text_input::Style {
|
||||
text_input::Style {
|
||||
border_width: 1.0,
|
||||
border_color: ACCENT,
|
||||
..self.active()
|
||||
}
|
||||
}
|
||||
|
||||
fn hovered(&self) -> text_input::Style {
|
||||
text_input::Style {
|
||||
border_width: 1.0,
|
||||
border_color: Color { a: 0.3, ..ACCENT },
|
||||
..self.focused()
|
||||
}
|
||||
}
|
||||
|
||||
fn placeholder_color(&self) -> Color {
|
||||
Color::from_rgb(0.4, 0.4, 0.4)
|
||||
}
|
||||
|
||||
fn value_color(&self) -> Color {
|
||||
Color::WHITE
|
||||
}
|
||||
|
||||
fn selection_color(&self) -> Color {
|
||||
ACTIVE
|
||||
}
|
||||
}
|
||||
|
||||
pub struct Scrollable;
|
||||
|
||||
impl scrollable::StyleSheet for Scrollable {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue