lib/simple_ui/level/layout.lua

@@ -5,8 +5,6 @@ local Element = require "lib.simple_ui.element"
 local Rect = require "lib.simple_ui.rect"
 
 --- @class SkillButton : UIElement
---- @field showNode AnimationNode?
---- @field showT number
 --- @field hovered boolean
 --- @field selected boolean
 --- @field onClick function?
@@ -31,49 +29,35 @@ function skillButton:update(dt)
     else
         self.hovered = false
     end
-
-    if self.showT < 1 then
-        self.showT = self.showT + dt * 1 / 0.3 -- в знаменателе продолжительность анимации в секундах
-        self.y = 10 * easing.easeInCubic(1 - self.showT)
-        return
-    end
-    if self.showNode then
-        self.showNode:finish()
-        self.showNode = nil
-    end
-end
-
---- @param animationNode AnimationNode
-function skillButton:show(animationNode)
-    if self.showNode then
-        self.showNode:finish()
-    end
-    self.showT = 0
-    self.showNode = animationNode
 end
 
 function skillButton:draw()
     love.graphics.push()
     love.graphics.applyTransform(self.transform)
-    local alpha = easing.easeInSine(self.showT)
+
+    local r, g, b, a = love.graphics.getColor()
 
     if self.selected then
-        love.graphics.setColor(0.3, 1, 0.3, alpha)
+        love.graphics.setColor(0.3, 1, 0.3, a)
     elseif self.hovered then
-        love.graphics.setColor(0.7, 1, 0.7, alpha)
+        love.graphics.setColor(0.7, 1, 0.7, a)
     else
-        love.graphics.setColor(1, 1, 1, alpha)
+        love.graphics.setColor(1, 1, 1, a)
     end
 
-    love.graphics.translate(0, self.y)
+    love.graphics.translate(0, self.bounds.y)
     love.graphics.draw(icons.atlas, icons:pickQuad(self.icon))
-    love.graphics.setColor(1, 1, 1)
     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
@@ -82,6 +66,9 @@ skillRow.__index = skillRow
 function skillRow.new(characterId)
     local t = {
         characterId = characterId,
+        showT = 0,
+        hideT = 0,
+        state = "show",
         children = {}
     }
 
@@ -111,17 +98,35 @@ function skillRow.new(characterId)
     return t
 end
 
-function skillRow:show()
+function skillRow:show(animationNode)
-    for _, skb in ipairs(self.children) do
+    self.state = "show"
-        AnimationNode {
+    if self.showNode then self.showNode:finish() end
-            function(animationNode)
+    self.showT = 0
-                skb:show(animationNode)
+    self.showNode = animationNode
-            end,
+end
-        }:run()
+
-    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()
@@ -130,7 +135,8 @@ function skillRow:update(dt)
 
     self.bounds = Rect {
         width = count * icons.tileSize + (count - 1) * padding,
-        height = iconSize
+        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)
@@ -139,14 +145,16 @@ function skillRow:update(dt)
         skb.bounds = Rect { height = iconSize, width = iconSize }
         skb.transform = self.transform:clone():translate(self.bounds.x + (i - 1) * iconSize +
             (i - 1) *
-            padding, -- левый край ряда + размер предыдущих иконок + размер предыдущих отступов
+            padding,      -- левый край ряда + размер предыдущих иконок + размер предыдущих отступов
-            0        -- высота не меняется
+            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
@@ -157,9 +165,22 @@ function layout:update(dt)
     local cid = Tree.level.selector:selected()
     if cid then
         self.skillRow = skillRow.new(cid)
-        self.skillRow:show()
+        AnimationNode {
+            function(animationNode)
+                self.skillRow:show(animationNode)
+            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
-    if Tree.level.selector:deselected() then self.skillRow = nil end
     if self.skillRow then self.skillRow:update(dt) end
 end