Refactor layout

This commit is contained in:
PeaAshMeter 2025-11-08 01:28:01 +03:00
parent f32393b978
commit a3853ceac8
2 changed files with 166 additions and 166 deletions

View File

@ -1,179 +1,18 @@
local icons = require("lib.utils.sprite_atlas").load(Tree.assets.files.dev_icons)
local easing = require "lib.utils.easing" local easing = require "lib.utils.easing"
local AnimationNode = require "lib.animation_node" local AnimationNode = require "lib.animation_node"
local Element = require "lib.simple_ui.element" local Element = require "lib.simple_ui.element"
local Rect = require "lib.simple_ui.rect" local Rect = require "lib.simple_ui.rect"
local SkillRow = require "lib.simple_ui.level.skill_row"
--- @class SkillButton : UIElement
--- @field hovered boolean
--- @field selected boolean
--- @field onClick function?
--- @field icon string
local skillButton = setmetatable({}, Element)
skillButton.__index = skillButton
function skillButton:update(dt)
local mx, my = love.mouse.getPosition()
if self:hitTest(mx, my) then
self.hovered = true
if Tree.controls:isJustPressed("select") then
if self.onClick then self.onClick() end
Tree.controls:consume("select")
end
else
self.hovered = false
end
end
function skillButton:draw()
love.graphics.push()
love.graphics.applyTransform(self.transform)
local r, g, b, a = love.graphics.getColor()
if self.selected then
love.graphics.setColor(0.3, 1, 0.3, a)
elseif self.hovered then
love.graphics.setColor(0.7, 1, 0.7, a)
else
love.graphics.setColor(1, 1, 1, a)
end
love.graphics.translate(0, self.bounds.y)
love.graphics.draw(icons.atlas, icons:pickQuad(self.icon))
love.graphics.pop()
end
--- @class SkillRow : UIElement
--- @field characterId Id
--- @field selected SkillButton?
--- @field showNode AnimationNode?
--- @field showT number
--- @field hideNode AnimationNode?
--- @field hideT number
--- @field state "show" | "hide"
--- @field children SkillButton[]
local skillRow = setmetatable({}, Element)
skillRow.__index = skillRow
--- @param characterId Id
function skillRow.new(characterId)
local t = {
characterId = characterId,
showT = 0,
hideT = 0,
state = "show",
children = {}
}
setmetatable(t, skillRow)
local char = Tree.level.characters[characterId]
char:try(Tree.behaviors.spellcaster, function(behavior)
for i, spell in ipairs(behavior.spellbook) do
local skb = skillButton:new { icon = spell.tag }
skb.onClick = function()
skb.selected = not skb.selected
if t.selected then t.selected.selected = false end
t.selected = skb
if not behavior.cast then
behavior.cast = behavior.spellbook[i]
behavior.state = "casting"
else
behavior.state = "idle"
behavior.cast = nil
end
end
t.children[i] = skb
end
end)
return t
end
function skillRow:show(animationNode)
self.state = "show"
if self.showNode then self.showNode:finish() end
self.showT = 0
self.showNode = animationNode
end
function skillRow:hide(animationNode)
self.state = "hide"
if self.hideNode then self.hideNode:finish() end
self.hideT = 0
self.hideNode = animationNode
end
function skillRow:update(dt)
if self.showT < 1 and self.state == "show" then
self.showT = self.showT + dt / 0.3 -- в знаменателе продолжительность анимации в секундах
elseif self.showNode then
self.showNode:finish()
self.showNode = nil
end
if self.hideT < 1 and self.state == "hide" then
self.hideT = self.hideT + dt / 0.3
elseif self.hideNode then
self.hideNode:finish()
self.hideNode = nil
end
local iconSize = icons.tileSize
local scale = (64 / iconSize)
local screenW, screenH = love.graphics.getDimensions()
local padding = 8
local count = #self.children
self.bounds = Rect {
width = count * icons.tileSize + (count - 1) * padding,
height = iconSize,
y = 10 * easing.easeInCubic(1 - self.showT)
}
self.transform = love.math.newTransform():translate(screenW / 2,
screenH - 16):scale(scale, scale):translate(-self.bounds.width / 2, -iconSize)
for i, skb in ipairs(self.children) do
skb.bounds = Rect { height = iconSize, width = iconSize }
skb.transform = self.transform:clone():translate(self.bounds.x + (i - 1) * iconSize +
(i - 1) *
padding, -- левый край ряда + размер предыдущих иконок + размер предыдущих отступов
self.bounds.y -- высота не меняется
)
skb:update(dt)
end
end
function skillRow:draw()
local alpha = self.state == "show" and easing.easeInSine(self.showT) or 1 - easing.easeInSine(self.hideT)
love.graphics.setColor(1, 1, 1, alpha)
for _, skb in ipairs(self.children) do
skb:draw()
end
end
local layout = {} local layout = {}
function layout:update(dt) function layout:update(dt)
local cid = Tree.level.selector:selected() local cid = Tree.level.selector:selected()
if cid then if cid then
self.skillRow = skillRow.new(cid) self.skillRow = SkillRow(cid)
AnimationNode { self.skillRow:show()
function(animationNode) elseif Tree.level.selector:deselected() then
self.skillRow:show(animationNode) self.skillRow:hide()
end,
}:run()
end
if Tree.level.selector:deselected() then
AnimationNode {
function(animationNode)
self.skillRow:hide(animationNode)
end,
onEnd = function()
self.skillRow = nil
end
}:run()
end end
if self.skillRow then self.skillRow:update(dt) end if self.skillRow then self.skillRow:update(dt) end
end end

View File

@ -0,0 +1,161 @@
local icons = require("lib.utils.sprite_atlas").load(Tree.assets.files.dev_icons)
local easing = require "lib.utils.easing"
local AnimationNode = require "lib.animation_node"
local Element = require "lib.simple_ui.element"
local Rect = require "lib.simple_ui.rect"
--- @class SkillButton : UIElement
--- @field hovered boolean
--- @field selected boolean
--- @field onClick function?
--- @field icon string
local skillButton = setmetatable({}, Element)
skillButton.__index = skillButton
function skillButton:update(dt)
local mx, my = love.mouse.getPosition()
if self:hitTest(mx, my) then
self.hovered = true
if Tree.controls:isJustPressed("select") then
if self.onClick then self.onClick() end
Tree.controls:consume("select")
end
else
self.hovered = false
end
end
function skillButton:draw()
love.graphics.push()
love.graphics.applyTransform(self.transform)
local r, g, b, a = love.graphics.getColor()
if self.selected then
love.graphics.setColor(0.3, 1, 0.3, a)
elseif self.hovered then
love.graphics.setColor(0.7, 1, 0.7, a)
else
love.graphics.setColor(1, 1, 1, a)
end
love.graphics.translate(0, self.bounds.y)
love.graphics.draw(icons.atlas, icons:pickQuad(self.icon))
love.graphics.pop()
end
--------------------------------------------------------------------------------
--- @class SkillRow : UIElement
--- @field characterId Id
--- @field selected SkillButton?
--- @field animationNode AnimationNode
--- @field state "show" | "idle" | "hide"
--- @field children SkillButton[]
local skillRow = setmetatable({}, Element)
skillRow.__index = skillRow
--- @param characterId Id
--- @return SkillRow
function skillRow.new(characterId)
local t = {
characterId = characterId,
state = "show",
children = {}
}
setmetatable(t, skillRow)
local char = Tree.level.characters[characterId]
char:try(Tree.behaviors.spellcaster, function(behavior)
for i, spell in ipairs(behavior.spellbook) do
local skb = skillButton:new { icon = spell.tag }
skb.onClick = function()
skb.selected = not skb.selected
if t.selected then t.selected.selected = false end
t.selected = skb
if not behavior.cast then
behavior.cast = behavior.spellbook[i]
behavior.state = "casting"
else
behavior.state = "idle"
behavior.cast = nil
end
end
t.children[i] = skb
end
end)
return t
end
function skillRow:show()
AnimationNode {
function(animationNode)
if self.animationNode then self.animationNode:finish() end
self.animationNode = animationNode
self.state = "show"
end,
duration = 300,
onEnd = function()
self.state = "idle"
end,
easing = easing.easeOutCubic
}:run()
end
function skillRow:hide()
AnimationNode {
function(animationNode)
if self.animationNode then self.animationNode:finish() end
self.animationNode = animationNode
self.state = "hide"
end,
duration = 300,
easing = easing.easeOutCubic
}:run()
end
function skillRow:update(dt)
if self.animationNode then self.animationNode:update(dt) end
local iconSize = icons.tileSize
local scale = (64 / iconSize)
local screenW, screenH = love.graphics.getDimensions()
local padding = 8
local count = #self.children
self.bounds = Rect {
width = count * icons.tileSize + (count - 1) * padding,
height = iconSize,
y = self.state == "show" and 10 * (1 - self.animationNode:getValue()) or 0
}
self.transform = love.math.newTransform():translate(screenW / 2,
screenH - 16):scale(scale, scale):translate(-self.bounds.width / 2, -iconSize)
for i, skb in ipairs(self.children) do
skb.bounds = Rect { height = iconSize, width = iconSize }
skb.transform = self.transform:clone():translate(self.bounds.x + (i - 1) * iconSize +
(i - 1) *
padding, -- левый край ряда + размер предыдущих иконок + размер предыдущих отступов
self.bounds.y -- высота не меняется
)
skb:update(dt)
end
end
function skillRow:draw()
local alpha = 1
if self.state == "show" then
alpha = self.animationNode:getValue()
elseif self.state == "hide" then
alpha = 1 - self.animationNode:getValue()
end
love.graphics.setColor(1, 1, 1, alpha)
for _, skb in ipairs(self.children) do
skb:draw()
end
end
return skillRow.new