GitHub/Basalt
1
0
Fork 0
Code Issues 28 Pull Requests 3 Actions Packages Projects Releases 9 Wiki Activity

Add align items

Browse Source
This commit is contained in:
Sabine Lim
2023-05-08 18:53:59 +10:00
parent 6cd8e0ebb0
commit 3de3fbecb3
2 changed files with 37 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
Basalt/objects/Flexbox.lua
View File

@@ -2,45 +2,56 @@ return function(name, basalt)
local base = basalt.getObject("Frame")(name, basalt)
local objectType = "Flexbox"
local flexDirection = "row" -- "row" oder "column"
local flexDirection = "row" -- "row" or "column"
local justifyContent = "flex-start" -- "flex-start", "flex-end", "center", "space-between", "space-around"
local alignItems = "flex-start" -- "flex-start", "flex-end", "center", "space-between", "space-around"
local spacing = 1
local function getObjectOffAxisOffset(self, obj)
local width, height = self:getSize()
local objWidth, objHeight = obj.element:getSize()
local availableSpace = flexDirection == "row" and height - objHeight or width - objWidth
local offset = 1
if alignItems == "center" then
offset = 1 + availableSpace / 2
elseif alignItems == "flex-end" then
offset = 1 + availableSpace
end
return offset
end
local function applyLayout(self)
local objects = self:getObjects()
local totalElements = #objects
local _, _ = self:getPosition()
local width, height = self:getSize()
local totalChildSize = 0
local mainAxisTotalChildSize = 0
for _, obj in ipairs(objects) do
local objWidth, objHeight = obj.element:getSize()
if flexDirection == "row" then
local objWidth, _ = obj.element:getSize()
totalChildSize = totalChildSize + objWidth
mainAxisTotalChildSize = mainAxisTotalChildSize + objWidth
else
local _, objHeight = obj.element:getSize()
totalChildSize = totalChildSize + objHeight
mainAxisTotalChildSize = mainAxisTotalChildSize + objHeight
end
end
local availableSpace = (flexDirection == "row" and width or height) - totalChildSize - (spacing * (totalElements - 1))
local currentOffset = 1
local mainAxisAvailableSpace = (flexDirection == "row" and width or height) - mainAxisTotalChildSize - (spacing * (totalElements - 1))
local justifyContentOffset = 1
if justifyContent == "center" then
currentOffset = 1 + availableSpace / 2
justifyContentOffset = 1 + mainAxisAvailableSpace / 2
elseif justifyContent == "flex-end" then
currentOffset = 1 + availableSpace
justifyContentOffset = 1 + mainAxisvailableSpace
end
for _, obj in ipairs(objects) do
local alignItemsOffset = getObjectOffAxisOffset(self, obj)
if flexDirection == "row" then
obj.element:setPosition(currentOffset, 1) -- Ändere den y-Wert auf 1
obj.element:setPosition(justifyContentOffset, alignItemsOffset)
local objWidth, _ = obj.element:getSize()
currentOffset = currentOffset + objWidth + spacing
justifyContentOffset = justifyContentOffset + objWidth + spacing
else
obj.element:setPosition(1, math.floor(currentOffset+0.5)) -- Ändere den x-Wert auf 1
obj.element:setPosition(alignItemsOffset, math.floor(justifyContentOffset+0.5))
local _, objHeight = obj.element:getSize()
currentOffset = currentOffset + objHeight + spacing
justifyContentOffset = justifyContentOffset + objHeight + spacing
end
end
end
@@ -80,6 +91,14 @@ return function(name, basalt)
end
return self
end,
setAlignItems = function(self, alignment)
if alignment == "flex-start" or alignment == "flex-end" or alignment == "center" or alignment == "space-between" or alignment == "space-around" then
alignItems = alignment
applyLayout(self)
end
return self
end,
}
for k,v in pairs(basalt.getObjects())do

1
Basalt/plugins/xml.lua
View File

@@ -375,6 +375,7 @@ return {
base.setValuesByXMLData(self, data, scripts)
if(xmlValue("flexDirection", data)~=nil)then self:setFlexDirection(xmlValue("flexDirection", data)) end
if(xmlValue("justifyContent", data)~=nil)then self:setJustifyContent(xmlValue("justifyContent", data)) end
if(xmlValue("alignItems", data)~=nil)then self:setAlignItems(xmlValue("alignItems", data)) end
if(xmlValue("spacing", data)~=nil)then self:setSpacing(xmlValue("spacing", data)) end
return self
end,