use linear color space, tweak colors

Author: yjpark

crates/bevy_utils/src/dev/theme.rs

@@ -7,7 +7,8 @@ use bevy::prelude::*;
 use bevy_inspector_egui::Inspectable;
 
 pub fn color_of_hex(hex: &str) -> Color {
-    Color::hex(hex).unwrap()
+    let color = Color::hex(hex).unwrap();
+    color.as_rgba_linear()
 }
 
 #[derive(Copy, Clone, PartialEq, Serialize, Deserialize, Debug, Default)]

crates/bevy_utils/src/util/text.rs

@@ -35,11 +35,22 @@ impl BevyUtil {
         commands.entity(entity).push_children(&[text_entity]);
         text_entity
     }
+    pub fn set_text_size(text: &mut Text, font_size: f32) {
+        for section in text.sections.iter_mut() {
+            section.style.font_size = font_size;
+        }
+    }
     pub fn set_text_color(text: &mut Text, color: Color) {
         for section in text.sections.iter_mut() {
             section.style.color = color;
         }
     }
+    pub fn set_text_size_color(text: &mut Text, font_size: f32, color: Color) {
+        for section in text.sections.iter_mut() {
+            section.style.font_size = font_size;
+            section.style.color = color;
+        }
+    }
     pub fn set_text_value(text: &mut Text, v: String) {
         for section in text.sections.iter_mut() {
             section.value = v;

crates/notation_bevy/src/mini/mini_bar.rs

@@ -98,7 +98,7 @@ impl<'a> LyonShape<shapes::Rectangle> for MiniBarShape<'a> {
         }
         let mut z = self.theme.core.mini_bar_z;
         if self.data.value.playing_state.is_current() {
-            z += 2.0;
+            z += 1.0;
         }
         Transform::from_xyz(0.0, 0.0, z)
     }

crates/notation_bevy/src/mini/mini_section_separator.rs

@@ -63,7 +63,7 @@ impl<'a> LyonShape<shapes::Line> for MiniSectionSeparator<'a> {
         let line_width = self.theme.sizes.mini_map.section_separator;
         let x_offset = -self.data.value.width / 2.0;
 
-        Transform::from_xyz(line_width + x_offset, 0.0, self.theme.core.mini_bar_z + 1.0)
+        Transform::from_xyz(line_width + x_offset, 0.0, self.theme.core.mini_bar_z + 2.0)
     }
 }
 

crates/notation_bevy/src/play/pos_indicator.rs

@@ -37,25 +37,32 @@ pub struct PosIndicator<'a> {
     pub data: PosIndicatorData,
 }
 
-impl<'a> LyonShape<shapes::Line> for PosIndicator<'a> {
+impl<'a> LyonShape<shapes::Rectangle> for PosIndicator<'a> {
     fn get_name(&self) -> String {
         "Current Pos".to_string()
     }
-    fn get_shape(&self) -> shapes::Line {
-        shapes::Line(
-            Vec2::ZERO,
-            Vec2::new(
-                0.0,
-                -self.data.bar_layout.size.height - self.theme.grid.bar_separator_extra * 2.0,
-            ),
-        )
+    fn get_shape(&self) -> shapes::Rectangle {
+        let width = self.theme.grid.pos_indicator_size;
+        let height = self.data.bar_layout.size.height + self.theme.grid.bar_separator_extra * 2.0;
+        shapes::Rectangle {
+            width,
+            height,
+            origin: shapes::RectangleOrigin::TopLeft,
+        }
     }
     fn get_colors(&self) -> ShapeColors {
-        ShapeColors::new(self.theme.core.pos_indicator_color)
+        ShapeColors::outlined(
+            self.theme
+                    .colors
+                    .of_section(self.data.bar_props.section_index),
+            self.theme.core.pos_indicator_color,
+        )
     }
     fn get_draw_mode(&self) -> DrawMode {
-        let line_width = self.theme.grid.pos_indicator_size;
-        DrawMode::Stroke(StrokeOptions::default().with_line_width(line_width))
+        DrawMode::Outlined {
+            fill_options: FillOptions::default(),
+            outline_options: StrokeOptions::default().with_line_width(self.theme.grid.pos_indicator_outline),
+        }
     }
     fn get_transform(&self) -> Transform {
         if self.data.bar_layout.size.width <= 0.0 {
@@ -70,7 +77,7 @@ impl<'a> LyonShape<shapes::Line> for PosIndicator<'a> {
     }
 }
 
-impl<'a> LyonShapeOp<'a, NotationTheme, PosIndicatorData, shapes::Line, PosIndicator<'a>>
+impl<'a> LyonShapeOp<'a, NotationTheme, PosIndicatorData, shapes::Rectangle, PosIndicator<'a>>
     for PosIndicator<'a>
 {
     fn new_shape(theme: &'a NotationTheme, data: PosIndicatorData) -> PosIndicator<'a> {

crates/notation_bevy/src/rhythm/rhythm_indicator.rs

@@ -58,14 +58,14 @@ impl<'a> LyonShape<shapes::SvgPathShape> for RhythmIndicator<'a> {
         self.data.shape(self.theme)
     }
     fn get_colors(&self) -> ShapeColors {
-        /*
         ShapeColors::new(
             self.theme
                 .colors
                 .of_section(self.data.bar_props.section_index),
         )
-         */
+        /*
         ShapeColors::new(self.theme.colors.rhythm.indicator)
+         */
     }
     fn get_draw_mode(&self) -> DrawMode {
         let line_width = self.theme.sizes.tab_control.rhythm_indicator_line_width;

crates/notation_bevy/src/strings/pick_note.rs

@@ -27,19 +27,20 @@ impl PickNoteValue {
 }
 
 impl PickNoteData {
-    pub fn calc_width_height(&self, theme: &NotationTheme) -> (f32, f32) {
-        let outline = theme
+    pub fn calc_outline(&self, theme: &NotationTheme) -> f32 {
+        theme
             .sizes
             .strings
             .note_outline
-            .of_state(&self.value.playing_state);
-        let mut width =
+            .of_state(&self.value.playing_state)
+    }
+    pub fn calc_width_height(&self, theme: &NotationTheme) -> (f32, f32) {
+        let outline = self.calc_outline(theme);
+        let width =
             self.value.bar_size / self.bar_props.bar_units.0 * self.entry_props.tied_units.0;
         let mut height = theme.sizes.strings.note_height;
         if self.value.playing_state.is_current() {
             height += outline;
-        } else {
-            width -= outline * 2.0;
         }
         (width, height)
     }
@@ -91,12 +92,7 @@ impl<'a> LyonShape<shapes::Rectangle> for PickNoteShape<'a> {
         )
     }
     fn get_draw_mode(&self) -> DrawMode {
-        let outline = self
-            .theme
-            .sizes
-            .strings
-            .note_outline
-            .of_state(&self.data.value.playing_state);
+        let outline = self.data.calc_outline(self.theme);
         DrawMode::Outlined {
             fill_options: FillOptions::default(),
             outline_options: StrokeOptions::default().with_line_width(outline),
@@ -110,9 +106,14 @@ impl<'a> LyonShape<shapes::Rectangle> for PickNoteShape<'a> {
             * self.data.entry_props.in_bar_pos.0;
         let y = -1.0
             * self.theme.strings.string_space
-            * (self.data.value.pick_note.string as f32 - 1.0)
-            - self.theme.strings.note_height / 2.0;
-        Transform::from_xyz(x, y, self.theme.strings.pick_z)
+            * (self.data.value.pick_note.string as f32 - 1.0);
+        let (_width, height) = self.calc_width_height();
+        let extra_z = if self.data.value.playing_state.is_current() {
+            1.0
+        } else {
+            0.0
+        };
+        Transform::from_xyz(x, y + height / 2.0, self.theme.strings.pick_z + extra_z)
     }
 }
 

crates/notation_bevy/src/theme/core_theme.rs

@@ -7,6 +7,8 @@ use notation_model::prelude::Signature;
 #[cfg(feature = "inspector")]
 use bevy_inspector_egui::Inspectable;
 
+use crate::prelude::ThemeColors;
+
 #[derive(Copy, Clone, PartialEq, Serialize, Deserialize, Debug)]
 #[cfg_attr(feature = "inspector", derive(Inspectable))]
 pub struct CoreTheme {
@@ -27,15 +29,15 @@ pub struct CoreTheme {
 impl Default for CoreTheme {
     fn default() -> Self {
         Self {
-            background_color: Color::hex("FFF9F2").unwrap(),
-            bar_separator_color: Color::hex("D3B59C").unwrap(),
+            background_color: ThemeColors::hex_linear("FFF9F2"),
+            bar_separator_color: ThemeColors::hex_linear("D3B59C"),
             bar_separator_z: 2.0,
             beat_color0: None,
-            beat_color1: Some(Color::hex("00000010").unwrap()),
+            beat_color1: Some(ThemeColors::hex_linear("00000010")),
             beat_color2: None,
             beat_z: 0.0,
             bar_indicator_z: 19.0,
-            pos_indicator_color: Color::hex("00FF00").unwrap(),
+            pos_indicator_color: ThemeColors::hex_linear("00000077"),
             pos_indicator_z: 20.0,
             mini_map_z: 22.0,
             mini_bar_z: 24.0,

crates/notation_bevy/src/theme/grid_theme.rs

@@ -17,6 +17,7 @@ pub struct GridTheme {
     pub bar_separator_extra: f32,
     pub bar_beat_extra: f32,
     pub pos_indicator_size: f32,
+    pub pos_indicator_outline: f32,
     pub pos_indicator_extra: f32,
 }
 
@@ -32,6 +33,7 @@ impl Default for GridTheme {
             bar_separator_extra: 8.0,
             bar_beat_extra: 0.0,
             pos_indicator_size: 2.0,
+            pos_indicator_outline: 0.5,
             pos_indicator_extra: 8.0,
         }
     }

crates/notation_bevy/src/theme/lyrics_theme.rs

@@ -1,12 +1,15 @@
 use bevy::prelude::*;
 use bevy_utils::prelude::BevyUtil;
+use notation_model::prelude::PlayingState;
 use serde::{Deserialize, Serialize};
 
 use crate::prelude::NotationAssets;
 
 #[cfg(feature = "inspector")]
 use bevy_inspector_egui::Inspectable;
 
+use super::theme_sizes::PlayingSize;
+
 #[derive(Copy, Clone, PartialEq, Serialize, Deserialize, Debug)]
 #[cfg_attr(feature = "inspector", derive(Inspectable))]
 pub struct LyricsTheme {
@@ -16,20 +19,20 @@ pub struct LyricsTheme {
     pub line_size: f32,
     pub line_color: Color,
     pub word_gap: f32,
-    pub word_font_size: f32,
+    pub word_font_size: PlayingSize,
     pub word_font_color: Color,
 }
 
 impl Default for LyricsTheme {
     fn default() -> Self {
         Self {
             text_x: 4.0,
-            text_y: -8.0,
+            text_y: -10.0,
             text_z: 1.0,
             line_size: 2.0,
             line_color: Color::hex("555555").unwrap(),
             word_gap: 1.0,
-            word_font_size: 20.0,
+            word_font_size: PlayingSize::new(20.0, 22.0, 20.0),
             word_font_color: Color::hex("000000").unwrap(),
         }
     }
@@ -49,7 +52,7 @@ impl LyricsTheme {
             entity,
             text,
             assets.cn_font.clone(),
-            self.word_font_size,
+            self.word_font_size.of_state(&PlayingState::Idle),
             self.word_font_color,
             HorizontalAlign::Right,
             VerticalAlign::Center,