Skip to content

Commit 08e7260

Browse files
jrmoultonjrmoulton
authored
Fix style context (#1045)
* fix style context * new style expr * fix style context * fix style context * fix style context * a test * fixes
1 parent 79a6166 commit 08e7260

37 files changed

Lines changed: 1704 additions & 1773 deletions

‎benches/style_computation.rs‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -403,14 +403,14 @@ fn bench_inherited_with_selectors(c: &mut Criterion) {
403403
);
404404

405405
trait BenchColorExt2 {
406-
fn with_bench_color2(self, f: impl Fn(Self, &Color) -> Self + 'static) -> Self
406+
fn with_bench_color2(self) -> Self
407407
where
408408
Self: Sized;
409409
}
410410

411411
impl BenchColorExt2 for Style {
412-
fn with_bench_color2(self, f: impl Fn(Self, &Color) -> Self + 'static) -> Self {
413-
self.with_context::<BenchInheritedColor2>(f)
412+
fn with_bench_color2(self) -> Self {
413+
self.with::<BenchInheritedColor2>(|s, c| s.background(c.def(|c| c)))
414414
}
415415
}
416416

@@ -428,7 +428,7 @@ fn bench_inherited_with_selectors(c: &mut Criterion) {
428428
.map(|_| {
429429
Empty::new().style(|s| {
430430
s.size(20.0, 20.0)
431-
.with_bench_color2(|s, c| s.background(*c))
431+
.with_bench_color2()
432432
.hover(|s| s.border(1.0))
433433
})
434434
})

‎examples/layout/src/draggable_sidebar.rs‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
use floem::{
2+
peniko::Brush,
23
prelude::*,
34
style::{CustomStylable, CustomStyle},
45
views::resizable::Resizable,
@@ -52,8 +53,8 @@ pub fn draggable_sidebar_view() -> impl IntoView {
5253
Resizable::new((side_bar, main_window))
5354
.style(|s| s.width_full().height_full())
5455
.custom_style(move |s| {
55-
s.handle_color(dragger_color)
56-
.active(|s| s.handle_color(active_dragger_color))
56+
s.handle_color(Brush::Solid(dragger_color))
57+
.active(|s| s.handle_color(Brush::Solid(active_dragger_color)))
5758
})
5859
.on_event_stop(el::KeyUp, move |_cx, KeyboardEvent { key, .. }| {
5960
if let Key::Named(NamedKey::F11) = key {

‎examples/navigation-stack-mobile/src/main.rs‎

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ use floem::{
66
new_window,
77
peniko::Color,
88
prelude::*,
9+
style::Style,
910
text::Alignment,
1011
theme::StyleThemeExt,
1112
view::ViewId,
@@ -101,11 +102,11 @@ impl Spot {
101102
s.width_full()
102103
.padding(18.0)
103104
.row_gap(10.0)
105+
.border_color(self.accent.with_alpha(0.25))
106+
.border(1.0)
104107
.with_theme(move |s, t| {
105108
s.border_radius(t.border_radius())
106109
.background(t.bg_elevated())
107-
.border_color(self.accent.with_alpha(0.25))
108-
.border(1.0)
109110
})
110111
})
111112
.debug_name("content");
@@ -220,7 +221,7 @@ impl Spot {
220221
.with_theme(|s, t| {
221222
s.border_radius(t.border_radius())
222223
.background(t.bg_elevated())
223-
.border(1.0)
224+
.apply(Style::new().border(1.0))
224225
.border_color(t.border())
225226
})
226227
})
@@ -279,11 +280,11 @@ impl Spot {
279280
.padding(22.0)
280281
.max_width(400)
281282
.with_theme(move |s, t| {
282-
let semantic = result.color(t);
283+
let semantic = t.def(move |theme| result.color(&theme));
283284
s.border_radius(t.border_radius())
284285
.background(t.bg_elevated())
285-
.border(1.0)
286-
.border_color(semantic.with_alpha(0.3))
286+
.apply(Style::new().border(1.0))
287+
.border_color(semantic.map(|color| color.with_alpha(0.3)))
287288
})
288289
})
289290
.debug_name("result_body");
@@ -724,7 +725,7 @@ fn home_screen() -> impl IntoView {
724725
s.padding(22.0).row_gap(10.0).with_theme(|s, t| {
725726
s.border_radius(t.border_radius())
726727
.background(t.bg_elevated())
727-
.border(1.0)
728+
.apply(Style::new().border(1.0))
728729
.border_color(t.border())
729730
})
730731
})
@@ -763,9 +764,9 @@ fn floating_action_button() -> impl IntoView {
763764
.font_bold()
764765
.justify_center()
765766
.with_theme(|s, t| {
766-
s.border_radius(999.0)
767-
.background(t.bg_elevated().with_alpha(0.96))
768-
.border(1.0)
767+
s.apply(Style::new().border_radius(999.0))
768+
.background(t.def(|theme| theme.bg_elevated().with_alpha(0.96)))
769+
.apply(Style::new().border(1.0))
769770
.border_color(t.border())
770771
.color(t.primary())
771772
})
@@ -785,7 +786,7 @@ fn quick_action_sheet(button_id: ViewId) -> impl IntoView {
785786
.style(move |s| {
786787
s.absolute()
787788
.inset(0.0)
788-
.with_theme(|s, t| s.background(t.text().with_alpha(0.18)))
789+
.with_theme(|s, t| s.background(t.def(|theme| theme.text().with_alpha(0.18))))
789790
})
790791
.debug_name("backdrop");
791792

@@ -821,7 +822,7 @@ fn quick_action_sheet(button_id: ViewId) -> impl IntoView {
821822
.with_theme(|s, t| {
822823
s.border_radius(t.border_radius())
823824
.background(t.bg_elevated())
824-
.border(1.0)
825+
.apply(Style::new().border(1.0))
825826
.border_color(t.border())
826827
})
827828
})
@@ -858,8 +859,9 @@ fn payment_badge(result: PaymentResult) -> impl IntoView {
858859
.border_radius(999.0)
859860
.font_bold()
860861
.with_theme(move |s, t| {
861-
let semantic = result.color(t);
862-
s.background(semantic.with_alpha(0.14)).color(semantic)
862+
let semantic = t.def(move |theme| result.color(&theme));
863+
s.background(semantic.clone().map(|color| color.with_alpha(0.14)))
864+
.color(semantic)
863865
})
864866
})
865867
.debug_name("payment_badge")

‎examples/todo-complex/src/todo.rs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,7 @@ impl IntoView for TodoState {
205205
AppCommand::SetSelected(self).execute();
206206
}
207207
})
208-
.style(|s| s.width_full().align_items(Some(AlignItems::FlexStart)));
208+
.style(|s| s.width_full().align_items(AlignItems::FlexStart));
209209

210210
let container = main_controls.container();
211211
let final_view_id = container.id();

‎examples/tokio-timer/src/main.rs‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
11
use std::time::Duration;
22

3-
use floem::action::inspect;
4-
use floem::prelude::*;
5-
use floem::reactive::{DerivedRwSignal, Memo};
6-
use floem::receiver_signal::StreamSignal;
7-
use floem::theme::StyleThemeExt;
8-
use floem::unit::Pct;
9-
use floem::views::slider::SliderCustomStyle;
10-
use tokio::runtime::Runtime;
11-
use tokio::time::Instant;
3+
use floem::{
4+
action::inspect,
5+
prelude::*,
6+
reactive::{DerivedRwSignal, Memo},
7+
receiver_signal::StreamSignal,
8+
theme::StyleThemeExt,
9+
unit::Pct,
10+
views::slider::SliderCustomExprStyle,
11+
};
12+
use tokio::{runtime::Runtime, time::Instant};
1213
use tokio_stream::wrappers::IntervalStream;
1314

1415
fn main() {
@@ -105,7 +106,7 @@ fn gauge(fill_percent: impl SignalGet<Pct> + 'static + Copy) -> slider::Slider {
105106
let fill_percent = fill_percent.get().0;
106107
s.width(200).set_disabled(true).with_theme(move |s, t| {
107108
s.apply_if(fill_percent == 100., |s| {
108-
s.custom(|s: SliderCustomStyle| s.accent_bar_color(t.success()))
109+
s.custom(|s: SliderCustomExprStyle| s.accent_bar_color(t.def(|t| t.success())))
109110
})
110111
})
111112
})

‎examples/view-transition/src/music_player.rs‎

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,10 @@
11
use floem::{
22
animate::Animation,
3-
peniko::{color::palette, Brush, Color},
4-
reactive::{RwSignal, SignalGet, SignalUpdate},
3+
prelude::*,
54
style::{ScaleX, ScaleY, Style, Transition},
65
text::FontWeight,
7-
unit::{DurationUnitExt, UnitExt},
8-
views::{
9-
dyn_container, slider::Slider, svg, ButtonClass, Container, Decorators, Stack, SvgClass,
10-
},
11-
AnyView, IntoView,
6+
views::slider::Slider,
7+
AnyView,
128
};
139

1410
use crate::box_shadow;
@@ -98,7 +94,7 @@ pub fn music_player() -> impl IntoView {
9894
Container::new(svg(svg::FORWARD)).class(ButtonClass),
9995
))
10096
.style(|s| {
101-
s.align_self(Some(floem::taffy::AlignItems::Center))
97+
s.align_self(floem::taffy::AlignItems::Center)
10298
.items_center()
10399
.gap(20)
104100
.class(SvgClass, |s| s.color(MUSIC_ICON))
@@ -114,7 +110,7 @@ pub fn music_player() -> impl IntoView {
114110
.accent_bar_height(3.)
115111
.bar_color(SLIDER)
116112
.accent_bar_color(ICON)
117-
.handle_color(Brush::Solid(palette::css::TRANSPARENT))
113+
.handle_color(css::TRANSPARENT)
118114
.handle_radius(0)
119115
}),
120116
media_buttons,

‎examples/widget-gallery/src/draggable.rs‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ use floem::{
33
event::DragConfig,
44
peniko::{Brush, color::Oklab},
55
prelude::{palette::css, *},
6-
style::{Background, CursorStyle},
6+
style::{Background, CursorStyle, TextColor},
77
style_class,
88
theme::StyleThemeExt,
99
};
@@ -160,18 +160,20 @@ pub fn draggable_view() -> impl IntoView {
160160
.padding(10)
161161
.max_width(300.)
162162
.class(DraggableItem, |s| {
163-
s.with_context_opt::<Background, _>(move |s, b| {
164-
let color = if let Brush::Solid(c) = b {
165-
let l = c.convert::<Oklab>().components[0];
166-
if l < 0.5 {
167-
Some(css::WHITE)
168-
} else {
169-
Some(css::BLACK)
170-
}
171-
} else {
172-
None
173-
};
174-
s.apply_opt(color, |s, c| s.color(c))
163+
s.with::<Background>(move |s, b| {
164+
s.set_context_opt(
165+
TextColor,
166+
b.def(|b| {
167+
b.and_then(|b| {
168+
if let Brush::Solid(c) = b {
169+
let l = c.convert::<Oklab>().components[0];
170+
Some(if l < 0.5 { css::WHITE } else { css::BLACK })
171+
} else {
172+
None
173+
}
174+
})
175+
}),
176+
)
175177
})
176178
})
177179
});

‎examples/widget-gallery/src/tabs.rs‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1+
use floem::peniko::Brush;
12
use floem::prelude::palette::css;
23
use floem::prelude::*;
34
use floem::reactive::Effect;
4-
use floem::style::{BoxShadow, CustomStylable};
5+
use floem::style::{BorderTopColor, BoxShadow, CustomStylable};
56
use floem::taffy::AlignContent;
67
use floem::theme::StyleThemeExt;
78

@@ -128,9 +129,16 @@ fn show_tab_content(tab: TabContent) -> impl IntoView {
128129
.border_radius(7.)
129130
.border_top(0.6)
130131
.with_theme(|s, t| {
131-
s.background(t.bg_elevated())
132-
.border_top_color(css::WHITE)
133-
.apply_if(t.is_dark, |s| s.border_top_color(t.border()))
132+
s.background(t.bg_elevated()).set_context_opt(
133+
BorderTopColor,
134+
t.def(|t| {
135+
Some(if t.is_dark {
136+
Brush::Solid(t.border())
137+
} else {
138+
Brush::Solid(css::WHITE)
139+
})
140+
}),
141+
)
134142
})
135143
.border_bottom_color(css::BLACK.multiply_alpha(0.7))
136144
.apply_box_shadows(vec![

‎renderer/src/text/attrs.rs‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,24 @@ pub enum LineHeightValue {
127127
Px(f32),
128128
}
129129

130+
impl From<f32> for LineHeightValue {
131+
fn from(value: f32) -> Self {
132+
LineHeightValue::Normal(value)
133+
}
134+
}
135+
136+
impl From<f64> for LineHeightValue {
137+
fn from(value: f64) -> Self {
138+
LineHeightValue::Normal(value as f32)
139+
}
140+
}
141+
142+
impl From<i32> for LineHeightValue {
143+
fn from(value: i32) -> Self {
144+
LineHeightValue::Normal(value as f32)
145+
}
146+
}
147+
130148
/// Text styling attributes used to configure font properties, color, and layout.
131149
///
132150
/// `Attrs` uses a builder pattern where each setter consumes and returns `self`,

0 commit comments

Comments
 (0)