DIY up theming of app selection/filter buttons

This commit is contained in:
2026-09-06 22:15:02 -05:00
parent b589a3dc1b
commit ccea626852
3 changed files with 35 additions and 14 deletions

View File

@@ -11,7 +11,7 @@ module W3DHubLauncher
# game bar container
flow(width: 1.0, height: 60) do
widget(width: 220, height: 1.0, background_nine_slice: NINE_SLICE_ROUNDED, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: ALPHA_GRAY, hover: { background_nine_slice_color: ALPHA_BLACK }, active: { background_nine_slice_color: ALPHA_GRAY }) do
widget(width: 220, height: 1.0, style_class: [:all_button]) do
flow(width: 1.0, height: 40, margin_left: PADDING, v_align: :center, h_align: :center) do
image safe_get_image("#{ROOT_PATH}/media/icons/menuGrid.png"), height: 40, color: 0xff_bbbbbb
link "ALL GAMES", text_size: 24, font: FONT_BLACK, height: 1.0, text_v_align: :center
@@ -71,16 +71,12 @@ module W3DHubLauncher
def populate_games_list
@games_list_container.clear do
@games.each_with_index do |game, i|
if i.zero?
image(safe_get_image("#{ROOT_PATH}/data/cache/#{game.id}.png"), tag: :"image_icon_#{game.id}", height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0x88_5e5c64, border_thickness_bottom: 3, border_color_bottom: 0xff_3584e4, tip: game.name)do
populate_game(game, game&.channels&.first)
end
else
image(safe_get_image("#{ROOT_PATH}/data/cache/#{game.id}.png"), tag: :"image_icon_#{game.id}", height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0, tip: game.name)do
populate_game(game, game&.channels&.first)
end
button(safe_get_image("#{ROOT_PATH}/data/cache/#{game.id}.png"), tag: :"image_icon_#{game.id}", style_class: [:app_icon_button], enabled: @current_app.id != game.id, tip: game.name) do |btn|
populate_game(game, game&.channels&.first)
end
end
puts
end
end

View File

@@ -8,7 +8,7 @@ module W3DHubLauncher
# game bar container
flow(width: 1.0, height: 60) do
widget(width: 220, height: 1.0, background_nine_slice: NINE_SLICE_ROUNDED, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: ALPHA_GRAY, hover: { background_nine_slice_color: ALPHA_BLACK }, active: { background_nine_slice_color: ALPHA_GRAY }) do |w|
widget(width: 220, height: 1.0, style_class: [:all_button]) do |w|
flow(width: 1.0, height: 40, margin_left: PADDING, v_align: :center, h_align: :center) do
image safe_get_image("#{ROOT_PATH}/media/icons/menuGrid.png"), height: 40, color: 0xff_bbbbbb
link "ALL SERVERS", text_size: 24, font: FONT_BLACK, height: 1.0, text_v_align: :center
@@ -24,7 +24,7 @@ module W3DHubLauncher
MemCache[:applications].each do |app|
next unless app.game?
image(safe_get_image("#{ROOT_PATH}/data/cache/#{app.id}.png"), height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0x88_5e5c64, border_thickness_bottom: 3, border_color_bottom: 0xff_3584e4, tip: app.name) do |btn|
button(safe_get_image("#{ROOT_PATH}/data/cache/#{app.id}.png"), style_class: [:app_icon_button], tip: app.name) do |btn|
if shift_down?
@games_filter << app.id
@games_filter.uniq!
@@ -33,11 +33,10 @@ module W3DHubLauncher
@games_filter << app.id
end
btn.enabled = false
populate_server_list
end
# image safe_get_image("#{ROOT_PATH}/data/cache/ren.png"), height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0, tip: "Command & Conquer: Renegade"
# image safe_get_image("#{ROOT_PATH}/data/cache/tsr.png"), height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0, tip: "Tiberian Sun: Reborn"
# image safe_get_image("#{ROOT_PATH}/data/cache/woa.png"), height: 1.0, padding: HALF_PADDING, background_nine_slice: NINE_SLICE_ROUNDED_TOP, background_nine_slice_from_edge: NINE_SLICE_EDGE, background_nine_slice_color: 0, tip: "Battle for Dune: War of Assassins"
end
end
end

View File

@@ -81,6 +81,7 @@ module W3DHubLauncher
background: 0,#x88_5e5c64,
padding_left: HALF_PADDING,
padding_right: HALF_PADDING,
border_color: 0,
background_nine_slice: NINE_SLICE_ROUNDED,
background_nine_slice_from_edge: NINE_SLICE_EDGE,
background_nine_slice_mode: :stretched,
@@ -156,6 +157,31 @@ module W3DHubLauncher
background_nine_slice_mode: :stretched,
background_nine_slice_color: 0xcc_000000,
border_thickness: 0
},
all_button: {
background_nine_slice: NINE_SLICE_ROUNDED,
background_nine_slice_from_edge: NINE_SLICE_EDGE,
background_nine_slice_color: ALPHA_GRAY,
hover: {
background_nine_slice_color: ALPHA_BLACK
},
active: {
background_nine_slice_color: ALPHA_GRAY
}
},
app_icon_button: {
height: 1.0,
image_height: 1.0,
padding: HALF_PADDING,
border_thickness_bottom: 3,
background_nine_slice: NINE_SLICE_ROUNDED_TOP,
background_nine_slice_from_edge: NINE_SLICE_EDGE,
background_nine_slice_color: 0,
disabled: { # fake disabled: styling the "selected" app uses
color: 0xff_ffffff,
background_nine_slice_color: 0x88_5e5c64,
border_color_bottom: 0xff_3584e4
}
}
}
end