Anim Editor: added dark colour scheme

This commit is contained in:
Maruno17
2024-05-13 20:32:20 +01:00
parent 5495bf565c
commit 63309a2ae9
19 changed files with 526 additions and 236 deletions

View File

@@ -5,18 +5,13 @@ class UIControls::BaseControl < BitmapSprite
attr_reader :value
attr_accessor :disabled
TEXT_COLOR = Color.black
TEXT_SIZE = 18 # Default is 22 if size isn't explicitly set
TEXT_OFFSET_Y = 5
HOVER_COLOR = Color.new(224, 255, 255) # For clickable area when hovering over it; light blue
CAPTURE_COLOR = Color.new(255, 64, 128) # For area you clicked in but aren't hovering over; hot pink
DISABLED_COLOR = Color.gray
DISABLED_COLOR_DARK = Color.new(128, 128, 128)
TEXT_OFFSET_Y = 5
include UIControls::StyleMixin
def initialize(width, height, viewport)
super(width, height, viewport)
self.bitmap.font.color = TEXT_COLOR
self.bitmap.font.size = TEXT_SIZE
self.color_scheme = :light
@disabled = false
@hover_area = nil # Is a symbol from the keys for @interactions if the mouse is hovering over that interaction
@captured_area = nil # Is a symbol from the keys for @interactions (or :none) if this control is clicked in
@@ -138,11 +133,11 @@ class UIControls::BaseControl < BitmapSprite
if !@captured_area || @hover_area == @captured_area
# Draw mouse hover over area highlight
rect = @interactions[@hover_area]
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, HOVER_COLOR) if rect
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, hover_color) if rect
elsif @captured_area
# Draw captured area highlight
rect = @interactions[@captured_area]
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, CAPTURE_COLOR) if rect
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, capture_color) if rect
end
end

View File

@@ -35,7 +35,7 @@ class UIControls::Label < UIControls::BaseControl
# Draw underline
text_size = self.bitmap.text_size(@text)
self.bitmap.fill_rect((width - text_size.width) / 2, TEXT_OFFSET_Y + text_size.height,
text_size.width, 1, TEXT_COLOR)
text_size.width, 1, line_color)
else
draw_text(self.bitmap, 4, TEXT_OFFSET_Y, @text)
end

View File

@@ -6,8 +6,6 @@ class UIControls::Checkbox < UIControls::BaseControl
CHECKBOX_WIDTH = 40
CHECKBOX_HEIGHT = 24
CHECKBOX_FILL_SIZE = CHECKBOX_HEIGHT - 4
UNCHECKED_COLOR = Color.gray
CHECKED_COLOR = Color.new(48, 192, 48) # Darkish green
def initialize(width, height, viewport, value = false)
super(width, height, viewport)
@@ -22,6 +20,14 @@ class UIControls::Checkbox < UIControls::BaseControl
invalidate
end
def checked_color
return get_color_scheme_color_for_element(:checked_color, Color.new(48, 192, 48))
end
def unchecked_color
return get_color_scheme_color_for_element(:unchecked_color, Color.gray)
end
#-----------------------------------------------------------------------------
def set_interactive_rects
@@ -40,24 +46,23 @@ class UIControls::Checkbox < UIControls::BaseControl
if disabled?
self.bitmap.fill_rect(@checkbox_rect.x, @checkbox_rect.y,
@checkbox_rect.width, @checkbox_rect.height,
DISABLED_COLOR)
disabled_fill_color)
end
# Draw checkbox outline
self.bitmap.outline_rect(@checkbox_rect.x, @checkbox_rect.y,
@checkbox_rect.width, @checkbox_rect.height,
self.bitmap.font.color)
line_color)
# Draw checkbox fill
if @value # If checked
self.bitmap.fill_rect(@checkbox_rect.x + @checkbox_rect.width - CHECKBOX_FILL_SIZE - 2, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, (disabled?) ? DISABLED_COLOR_DARK : CHECKED_COLOR)
self.bitmap.outline_rect(@checkbox_rect.x + @checkbox_rect.width - CHECKBOX_FILL_SIZE - 2, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, self.bitmap.font.color)
box_x = (@value) ? @checkbox_rect.width - CHECKBOX_FILL_SIZE - 2 : 2
if disabled?
box_color = disabled_text_color
else
self.bitmap.fill_rect(@checkbox_rect.x + 2, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, (disabled?) ? DISABLED_COLOR_DARK : UNCHECKED_COLOR)
self.bitmap.outline_rect(@checkbox_rect.x + 2, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, self.bitmap.font.color)
box_color = (@value) ? checked_color : unchecked_color
end
self.bitmap.fill_rect(@checkbox_rect.x + box_x, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, box_color)
self.bitmap.outline_rect(@checkbox_rect.x + box_x, @checkbox_rect.y + 2,
CHECKBOX_FILL_SIZE, CHECKBOX_FILL_SIZE, line_color)
end
#-----------------------------------------------------------------------------

View File

@@ -167,7 +167,7 @@ class UIControls::TextBox < UIControls::BaseControl
return if !@cursor_shown || @cursor_pos < 0
cursor_y_offset = ((height - TEXT_BOX_HEIGHT) / 2) + 2
cursor_height = height - (cursor_y_offset * 2)
bitmap.fill_rect(cursor_x, cursor_y_offset, 2, cursor_height, self.bitmap.font.color)
bitmap.fill_rect(cursor_x, cursor_y_offset, 2, cursor_height, text_color)
end
def refresh
@@ -176,12 +176,12 @@ class UIControls::TextBox < UIControls::BaseControl
if disabled?
self.bitmap.fill_rect(@text_box_rect.x, @text_box_rect.y,
@text_box_rect.width, @text_box_rect.height,
DISABLED_COLOR)
disabled_fill_color)
end
# Draw text box outline
self.bitmap.outline_rect(@text_box_rect.x, @text_box_rect.y,
@text_box_rect.width, @text_box_rect.height,
self.bitmap.font.color)
line_color)
# Draw value
char_x = @text_box_rect.x + TEXT_BOX_PADDING
last_char_index = @display_pos
@@ -199,16 +199,17 @@ class UIControls::TextBox < UIControls::BaseControl
# Draw cursor at end
draw_cursor(char_x - 1) if @cursor_pos == @value.to_s.length
# Draw left/right arrows to indicate more text beyond the text box sides
arrow_color = (disabled?) ? disabled_text_color : text_color
if @display_pos > 0
bitmap.fill_rect(@text_box_rect.x, (height / 2) - 4, 1, 8, Color.white)
bitmap.fill_rect(@text_box_rect.x, (height / 2) - 4, 1, 8, background_color)
5.times do |i|
bitmap.fill_rect(@text_box_rect.x - 2 + i, (height / 2) - (i + 1), 1, 2 * (i + 1), self.bitmap.font.color)
bitmap.fill_rect(@text_box_rect.x - 2 + i, (height / 2) - (i + 1), 1, 2 * (i + 1), arrow_color)
end
end
if last_char_index < @value.to_s.length - 1
bitmap.fill_rect(@text_box_rect.x + @text_box_rect.width - 1, (height / 2) - 4, 1, 8, Color.white)
bitmap.fill_rect(@text_box_rect.x + @text_box_rect.width - 1, (height / 2) - 4, 1, 8, background_color)
5.times do |i|
bitmap.fill_rect(@text_box_rect.x + @text_box_rect.width + 1 - i, (height / 2) - (i + 1), 1, 2 * (i + 1), self.bitmap.font.color)
bitmap.fill_rect(@text_box_rect.x + @text_box_rect.width + 1 - i, (height / 2) - (i + 1), 1, 2 * (i + 1), arrow_color)
end
end
end

View File

@@ -62,7 +62,7 @@ class UIControls::NumberSlider < UIControls::BaseControl
# the mouse doesn't need to be on the slider to change this control's value
if @captured_area == :slider
rect = @interactions[@captured_area]
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, HOVER_COLOR) if rect
self.bitmap.fill_rect(rect.x, rect.y, rect.width, rect.height, hover_color) if rect
else
super
end
@@ -70,14 +70,14 @@ class UIControls::NumberSlider < UIControls::BaseControl
def refresh
super
button_color = (disabled?) ? DISABLED_COLOR : self.bitmap.font.color
button_color = (disabled?) ? disabled_text_color : text_color
# Draw minus button
self.bitmap.fill_rect(@minus_rect.x + 2, @minus_rect.y + (@minus_rect.height / 2) - 2, @minus_rect.width - 4, 4, button_color)
# Draw slider bar
self.bitmap.fill_rect(SLIDER_X, (self.height / 2) - 1, SLIDER_LENGTH, 2, self.bitmap.font.color)
self.bitmap.fill_rect(SLIDER_X, (self.height / 2) - 1, SLIDER_LENGTH, 2, text_color)
# Draw notches on slider bar
5.times do |i|
self.bitmap.fill_rect(SLIDER_X - 1 + (i * SLIDER_LENGTH / 4), (self.height / 2) - 2, 2, 4, self.bitmap.font.color)
self.bitmap.fill_rect(SLIDER_X - 1 + (i * SLIDER_LENGTH / 4), (self.height / 2) - 2, 2, 4, text_color)
end
# Draw slider knob
fraction = (self.value - self.min_value) / (self.max_value.to_f - self.min_value)

View File

@@ -73,7 +73,7 @@ class UIControls::NumberTextBox < UIControls::TextBox
def refresh
super
button_color = (disabled?) ? DISABLED_COLOR : self.bitmap.font.color
button_color = (disabled?) ? disabled_text_color : text_color
# Draw minus button
self.bitmap.fill_rect(@minus_rect.x + 2, @minus_rect.y + (@minus_rect.height / 2) - 2, @minus_rect.width - 4, 4, button_color)
# Draw plus button

View File

@@ -7,7 +7,6 @@ class UIControls::Button < UIControls::BaseControl
BUTTON_PADDING = 10 # Used when @fixed_size is false
BUTTON_HEIGHT = 28 # Used when @fixed_size is false
TEXT_BASE_OFFSET_Y = 18 # Text is centred vertically in the button
HIGHLIGHT_COLOR = Color.new(224, 192, 32) # Dark yellow
def initialize(width, height, viewport, text = "")
super(width, height, viewport)
@@ -82,21 +81,21 @@ class UIControls::Button < UIControls::BaseControl
# Draw highligted colour
self.bitmap.fill_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
HIGHLIGHT_COLOR)
highlight_color)
elsif disabled?
# Draw disabled colour
self.bitmap.fill_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
DISABLED_COLOR)
disabled_fill_color)
end
# Draw button outline
self.bitmap.outline_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
self.bitmap.font.color)
line_color)
# Draw inner grey ring that shows this is a button rather than a text box
if !disabled?
shade = self.bitmap.font.color.clone
shade.alpha = 64
shade = line_color.clone
shade.alpha = (shade.red > 128) ? 160 : 64
self.bitmap.outline_rect(@button_rect.x + 2, @button_rect.y + 2,
@button_rect.width - 4, @button_rect.height - 4,
shade, 1)

View File

@@ -6,7 +6,6 @@ class UIControls::List < UIControls::BaseControl
ROW_HEIGHT = 24
TEXT_PADDING_X = 4
TEXT_OFFSET_Y = 3
SELECTED_ROW_COLOR = Color.new(216, 192, 32) # Dark yellow
def initialize(width, height, viewport, values = [])
super(width, height, viewport)
@@ -14,6 +13,7 @@ class UIControls::List < UIControls::BaseControl
width - UIControls::Scrollbar::SLIDER_WIDTH - BORDER_THICKNESS, BORDER_THICKNESS,
height - (BORDER_THICKNESS * 2), viewport
)
@scrollbar.color_scheme = @color_scheme
@scrollbar.set_interactive_rects
@scrollbar.range = ROW_HEIGHT
@scrollbar.z = self.z + 1
@@ -51,6 +51,15 @@ class UIControls::List < UIControls::BaseControl
@scrollbar.visible = new_val
end
def color_scheme=(value)
return if @color_scheme == value
@color_scheme = value
self.bitmap.font.color = text_color
self.bitmap.font.size = text_size
@scrollbar&.color_scheme = value
invalidate if self.respond_to?(:invalidate)
end
# Each value in @values is an array: [id, text].
def values=(new_vals)
@values = new_vals
@@ -131,7 +140,7 @@ class UIControls::List < UIControls::BaseControl
if rect
rect_y = rect.y
rect_y -= @top_row * ROW_HEIGHT if @hover_area.is_a?(Integer)
self.bitmap.fill_rect(rect.x, rect_y, rect.width, rect.height, HOVER_COLOR)
self.bitmap.fill_rect(rect.x, rect_y, rect.width, rect.height, hover_color)
end
end
@@ -143,7 +152,7 @@ class UIControls::List < UIControls::BaseControl
def refresh
super
# Draw control outline
self.bitmap.outline_rect(0, 0, width, height, Color.black)
self.bitmap.outline_rect(0, 0, width, height, line_color)
# Draw text options
@values.each_with_index do |val, i|
next if i < @top_row || i >= @top_row + @rows_count
@@ -152,11 +161,11 @@ class UIControls::List < UIControls::BaseControl
@interactions[i].x,
@interactions[i].y - (@top_row * ROW_HEIGHT),
@interactions[i].width, @interactions[i].height,
SELECTED_ROW_COLOR
highlight_color
)
end
txt = (val.is_a?(Array)) ? val[1] : val.to_s
text_color = TEXT_COLOR
old_text_color = self.bitmap.font.color
if txt[/^\\c\[([0-9]+)\]/i]
text_colors = [
[ 0, 112, 248], [120, 184, 232], # 1 Blue
@@ -181,7 +190,7 @@ class UIControls::List < UIControls::BaseControl
@interactions[i].x + TEXT_PADDING_X,
@interactions[i].y + TEXT_OFFSET_Y - (@top_row * ROW_HEIGHT),
txt)
self.bitmap.font.color = TEXT_COLOR
self.bitmap.font.color = old_text_color
end
end

View File

@@ -63,12 +63,15 @@ class UIControls::DropdownList < UIControls::BaseControl
@dropdown_menu_bg.x = self.x + @button_rect.x
@dropdown_menu_bg.y = self.y + @button_rect.y + @button_rect.height
@dropdown_menu_bg.z = self.z + 1
@dropdown_menu_bg.bitmap.fill_rect(0, 0, @dropdown_menu_bg.width, @dropdown_menu_bg.height, Color.white)
@dropdown_menu_bg.bitmap.font.color = text_color
@dropdown_menu_bg.bitmap.font.size = text_size
@dropdown_menu_bg.bitmap.fill_rect(0, 0, @dropdown_menu_bg.width, @dropdown_menu_bg.height, background_color)
# Create menu
@dropdown_menu = UIControls::List.new(@button_rect.width, menu_height, self.viewport, @options)
@dropdown_menu.x = @dropdown_menu_bg.x
@dropdown_menu.y = @dropdown_menu_bg.y
@dropdown_menu.z = self.z + 2
@dropdown_menu.color_scheme = @color_scheme
@dropdown_menu.set_interactive_rects
@dropdown_menu.repaint
end
@@ -95,23 +98,24 @@ class UIControls::DropdownList < UIControls::BaseControl
if disabled?
self.bitmap.fill_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
DISABLED_COLOR)
disabled_fill_color)
end
# Draw button outline
self.bitmap.outline_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
self.bitmap.font.color)
line_color)
# Draw value
draw_text(self.bitmap, @button_rect.x + TEXT_BOX_PADDING, TEXT_OFFSET_Y, @options[@value] || "???")
# Draw down arrow
arrow_area_x = @button_rect.x + @button_rect.width - @button_rect.height + 1
arrow_area_width = @button_rect.height - 2
arrow_color = (disabled?) ? disabled_text_color : text_color
self.bitmap.fill_rect(arrow_area_x, @button_rect.y + 1, arrow_area_width, arrow_area_width,
(@hover_area && @captured_area != :button) ? HOVER_COLOR : Color.white)
(@hover_area && @captured_area != :button) ? hover_color : background_color)
6.times do |i|
self.bitmap.fill_rect(arrow_area_x + (arrow_area_width / 2) - 5 + i,
@button_rect.y + (arrow_area_width / 2) - 1 + i,
11 - (2 * i), 1, (disabled?) ? DISABLED_COLOR_DARK : self.bitmap.font.color)
11 - (2 * i), 1, arrow_color)
end
end

View File

@@ -59,12 +59,13 @@ class UIControls::TextBoxDropdownList < UIControls::TextBox
@dropdown_menu_bg.x = self.x + @text_box_rect.x
@dropdown_menu_bg.y = self.y + @text_box_rect.y + @text_box_rect.height
@dropdown_menu_bg.z = self.z + 1
@dropdown_menu_bg.bitmap.fill_rect(0, 0, @dropdown_menu_bg.width, @dropdown_menu_bg.height, Color.white)
@dropdown_menu_bg.bitmap.fill_rect(0, 0, @dropdown_menu_bg.width, @dropdown_menu_bg.height, background_color)
# Create menu
@dropdown_menu = UIControls::List.new(@text_box_rect.width + @button_rect.width, menu_height, self.viewport, @options)
@dropdown_menu.x = @dropdown_menu_bg.x
@dropdown_menu.y = @dropdown_menu_bg.y
@dropdown_menu.z = self.z + 2
@dropdown_menu.color_scheme = @color_scheme
@dropdown_menu.set_interactive_rects
@dropdown_menu.repaint
end
@@ -83,10 +84,10 @@ class UIControls::TextBoxDropdownList < UIControls::TextBox
def draw_area_highlight
highlight_color = nil
if @captured_area == :text_box && !@hover_area && Input.press?(Input::MOUSELEFT)
highlight_color = CAPTURE_COLOR
highlight_color = capture_color
elsif !@captured_area && [:text_box, :button].include?(@hover_area)
# Draw mouse hover over area highlight
highlight_color = HOVER_COLOR
highlight_color = hover_color
end
return if !highlight_color
[:text_box, :button].each do |area|
@@ -102,21 +103,22 @@ class UIControls::TextBoxDropdownList < UIControls::TextBox
if disabled?
self.bitmap.fill_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
DISABLED_COLOR)
disabled_fill_color)
end
# Draw button outline
self.bitmap.outline_rect(@button_rect.x, @button_rect.y,
@button_rect.width, @button_rect.height,
self.bitmap.font.color)
line_color)
# Draw down arrow
arrow_area_x = @button_rect.x + @button_rect.width - @button_rect.height + 1
arrow_area_width = @button_rect.height - 2
arrow_color = (disabled?) ? disabled_text_color : text_color
# self.bitmap.fill_rect(arrow_area_x, @button_rect.y + 1, arrow_area_width, arrow_area_width,
# (@hover_area && @captured_area != :button) ? HOVER_COLOR : Color.white)
# (@hover_area && @captured_area != :button) ? hover_color : background_color)
6.times do |i|
self.bitmap.fill_rect(arrow_area_x + (arrow_area_width / 2) - 5 + i,
@button_rect.y + (arrow_area_width / 2) - 1 + i,
11 - (2 * i), 1, (disabled?) ? DISABLED_COLOR_DARK : self.bitmap.font.color)
11 - (2 * i), 1, arrow_color)
end
end

View File

@@ -7,9 +7,6 @@ class UIControls::Scrollbar < UIControls::BaseControl
SLIDER_WIDTH = 16
WIDTH_PADDING = 0
SCROLL_DISTANCE = 16
TRAY_COLOR = Color.white
SLIDER_COLOR = Color.black
GRAB_COLOR = HOVER_COLOR # Cyan
def initialize(x, y, size, viewport, horizontal = false, always_visible = false)
if horizontal
@@ -90,14 +87,14 @@ class UIControls::Scrollbar < UIControls::BaseControl
super
return if !self.visible
# Draw the tray
self.bitmap.fill_rect(@slider_tray.x, @slider_tray.y, @slider_tray.width, @slider_tray.height, TRAY_COLOR)
self.bitmap.fill_rect(@slider_tray.x, @slider_tray.y, @slider_tray.width, @slider_tray.height, background_color)
# Draw the slider
if @slider_size < @tray_size
bar_color = SLIDER_COLOR
if @slider_size < @tray_size && !disabled?
if @captured_area == :slider || (!@captured_area && @hover_area == :slider)
bar_color = GRAB_COLOR
bar_color = hover_color
else
bar_color = text_color
end
bar_color = DISABLED_COLOR if disabled?
self.bitmap.fill_rect(@slider.x, @slider.y, @slider.width, @slider.height, bar_color)
end
end