From 9d10e95faed0a23cc351876fade828225a221adc Mon Sep 17 00:00:00 2001 From: Robert Jelic <36573031+NoryiE@users.noreply.github.com> Date: Mon, 18 Jul 2022 16:45:59 +0200 Subject: [PATCH] docs --- Basalt/objects/Animation.lua | 16 +-- Basalt/objects/Timer.lua | 3 +- docs/_sidebar.md | 2 +- docs/objects/Animation.md | 217 ++++++++++++++++++++++++++--------- docs/objects/Basalt.md | 21 ++-- docs/objects/Progressbar.md | 26 ++--- docs/objects/Scrollbar.md | 112 +++++++++++++----- docs/objects/Slider.md | 118 ++++++++++++++----- docs/objects/Timer.md | 93 ++++++++++----- docs/tips/design.md | 38 +++++- 10 files changed, 468 insertions(+), 178 deletions(-) diff --git a/Basalt/objects/Animation.lua b/Basalt/objects/Animation.lua index 70bf9cb..1b7bdeb 100644 --- a/Basalt/objects/Animation.lua +++ b/Basalt/objects/Animation.lua @@ -182,14 +182,14 @@ return function(name) end end if(duration~=nil)and(#t>0)then - self:changeFG(duration, timer or 0, table.unpack(t)) + self:changeTextColor(duration, timer or 0, table.unpack(t)) end end - if(data["backgroundColor"]~=nil)then - local duration = xmlValue("duration", data["backgroundColor"]) - local timer = xmlValue("time", data["backgroundColor"]) + if(data["background"]~=nil)then + local duration = xmlValue("duration", data["background"]) + local timer = xmlValue("time", data["background"]) local t = {} - local tab = data["backgroundColor"]["color"] + local tab = data["background"]["color"] if(tab~=nil)then if(tab.properties~=nil)then tab = {tab} end for k,v in pairs(tab)do @@ -197,7 +197,7 @@ return function(name) end end if(duration~=nil)and(#t>0)then - self:changeBG(duration, timer or 0, table.unpack(t)) + self:changeBackground(duration, timer or 0, table.unpack(t)) end end if(data["text"]~=nil)then @@ -285,7 +285,7 @@ return function(name) return self end, - changeBG = function(self, duration, timer, ...) + changeBackground = function(self, duration, timer, ...) local colors = {...} timer = timer or 0 _OBJ = obj or _OBJ @@ -297,7 +297,7 @@ return function(name) return self end, - changeFG = function(self, duration, timer, ...) + changeTextColor = function(self, duration, timer, ...) local colors = {...} timer = timer or 0 _OBJ = obj or _OBJ diff --git a/Basalt/objects/Timer.lua b/Basalt/objects/Timer.lua index 30ad7a0..ac7c4b3 100644 --- a/Basalt/objects/Timer.lua +++ b/Basalt/objects/Timer.lua @@ -18,9 +18,8 @@ return function(name) end; setValuesByXMLData = function(self, data) - local f if(xmlValue("time", data)~=nil)then timer = xmlValue("time", data) end - if(xmlValue("repeat", data)~=nil)then timer = xmlValue("repeat", data) end + if(xmlValue("repeat", data)~=nil)then savedRepeats = xmlValue("repeat", data) end if(xmlValue("start", data)~=nil)then if(xmlValue("start", data))then self:start() end end if(xmlValue("onCall", data)~=nil)then self:onCall(getBaseFrame():getVariable(xmlValue("onCall", data))) end return self diff --git a/docs/_sidebar.md b/docs/_sidebar.md index 7982e31..17667c6 100644 --- a/docs/_sidebar.md +++ b/docs/_sidebar.md @@ -20,7 +20,7 @@ - [Radio](objects/Radio) - [Scrollbar](objects/Scrollbar) - [Slider](objects/Slider) - - [Text Field](objects/Textfield) + - [Textfield](objects/Textfield) - [Animation](objects/Animation.md) - [Thread](objects/Thread) - [Timer](objects/Timer) diff --git a/docs/objects/Animation.md b/docs/objects/Animation.md index dd7d2fc..77b8725 100644 --- a/docs/objects/Animation.md +++ b/docs/objects/Animation.md @@ -18,8 +18,8 @@ Adds a new function to an animation #### Usage: * This will set the button position to 3,3, waits 1 second, then sets position to 4,4, waits 2 seconds, and then sets the position to 5,5 ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton() local aAnimation = mainFrame:addAnimation():add(function() testButton:setPosition(3,3) end):wait(1):add(function() testButton:setPosition(1,1,"r") end):wait(2):add(function() testButton:setPosition(1,1,"r") end) aAnimation:play() ``` @@ -34,8 +34,8 @@ Sets a wait timer for the next function after the previous function got executed #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton() local aAnimation = mainFrame:addAnimation():add(function() testButton:setPosition(3,3) end):wait(1):add(function() testButton:setPosition(1,1,"r") end):wait(2):add(function() testButton:setPosition(1,1,"r") end) aAnimation:play() @@ -51,8 +51,8 @@ Plays the animation #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton() local aAnimation = mainFrame:addAnimation():add(function() testButton:setBackground(colors.black) end):wait(1):add(function() testButton:setBackground(colors.gray) end):wait(1):add(function() testButton:setBackground(colors.lightGray) end) aAnimation:play() -- changes the background color of that button from black to gray and then to lightGray @@ -67,8 +67,8 @@ Cancels the animation #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton() local aAnimation = mainFrame:addAnimation():add(function() testButton:setBackground(colors.black) end):wait(1):add(function() aAnimation:cancel() end):wait(1):add(function() testButton:setBackground(colors.lightGray) end) aAnimation:play() @@ -87,30 +87,17 @@ Sets the object which the animation should reposition/resize #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton() local aAnimation = mainFrame:addAnimation():setObject(testButton) ``` -## move -Moves the object which got defined by setObject - -#### Parameters: -1. `number` x coordinate -2. `number` y coordinate -1. `number` time in seconds -1. `number` frames (how fluid it should look like) -1. `table` object - optional, you could also define the object here - -#### Returns: -1. `animation` Animation in use - -#### Usage: - ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() -local aAnimation = mainFrame:addAnimation():setObject(testButton):move(15,3,1,5):play() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +``` +```xml + ``` ## move @@ -119,19 +106,24 @@ Moves the object which got defined by setObject #### Parameters: 1. `number` x coordinate 2. `number` y coordinate -1. `number` time in seconds -1. `number` frames (how fluid it should look like) -1. `table` object - optional, you could also define the object here +3. `number` duration in seconds +4. `number` time - time when this part should begin (offset to when the animation starts - default 0) +5. `table` object - optional, you could also define the object here #### Returns: 1. `animation` Animation in use #### Usage: - +* Takes 2 seconds to move the object from its current position to x15 y3 ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() -local aAnimation = mainFrame:addAnimation():setObject(testButton):move(15,3,1,5):play() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):move(15,3,2):play() +``` +```xml + +1562 + ``` ## offset @@ -140,9 +132,9 @@ Changes the offset on the object which got defined by setObject #### Parameters: 1. `number` x offset 2. `number` y offset -1. `number` time in seconds -1. `number` frames (how fluid it should look like) -1. `table` object - optional, you could also define the object here +3. `number` duration in seconds +4. `number` time - time when this part should begin (offset to when the animation starts - default 0) +5. `table` object - optional, you could also define the object here #### Returns: 1. `animation` Animation in use @@ -150,9 +142,14 @@ Changes the offset on the object which got defined by setObject #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local subFrame = mainFrame:addFrame():show() -local aAnimation = mainFrame:addAnimation():setObject(subFrame):offset(1,12,1,5):play() +local mainFrame = basalt.createFrame() +local subFrame = mainFrame:addFrame("frameToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(subFrame):offset(1,12,1):play() +``` +```xml + +1121 + ``` ## size @@ -161,26 +158,32 @@ Changes the size on the object which got defined by setObject #### Parameters: 1. `number` width 2. `number` height -1. `number` time in seconds -1. `number` frames (how fluid it should look like) -1. `table` object - optional, you could also define the object here +3. `number` duration in seconds +4. `number` time - time when this part should begin (offset to when the animation starts - default 0) +5. `table` object - optional, you could also define the object here #### Returns: 1. `animation` Animation in use #### Usage: - ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() -local aAnimation = mainFrame:addAnimation():setObject(testButton):size(15,3,1,5):play() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):size(15,3,1):play() +``` +```xml + +1531 + ``` -## textColoring -Changes the text colors of an object +## changeText +Changes the text while animation is running #### Parameters: -1. `color|number` multiple colors +1. `table` multiple text strings - example: {"i", "am", "groot"} +2. `number` duration in seconds +3. `number` time - time when this part should begin (offset to when the animation starts - default 0) #### Returns: 1. `animation` Animation in use @@ -188,7 +191,113 @@ Changes the text colors of an object #### Usage: ```lua -local mainFrame = basalt.createFrame():show() -local testButton = mainFrame:addButton():show() -local aAnimation = mainFrame:addAnimation():setObject(testButton):textColoring(colors.black, colors.gray, colors.lightGray):play() +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):changeText({"i", "am", "groot"}, 2):play() ``` +```xml + + + i + am + groot + 2 + + +``` + +## changeTextColor +Changes the text color while the animation is running + +#### Parameters: +1. `table` multiple color numbers - example: {colors.red, colors.yellow, colors.green} +2. `number` duration in seconds +3. `number` time - time when this part should begin (offset to when the animation starts - default 0) + +#### Returns: +1. `animation` Animation in use + +#### Usage: + +```lua +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):changeTextColor({colors.red, colors.yellow, colors.green}, 2):play() +``` +```xml + + + red + yellow + green + 2 + + +``` + +## changeBackground +Changes the background color while the animation is running + +#### Parameters: +1. `table` multiple color numbers - example: {colors.red, colors.yellow, colors.green} +2. `number` duration in seconds +3. `number` time - time when this part should begin (offset to when the animation starts - default 0) + +#### Returns: +1. `animation` Animation in use + +#### Usage: + +```lua +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):changeTextColor({colors.red, colors.yellow, colors.green}, 2):play() +``` +```xml + + + red + yellow + green + 2 + + +``` + +# Events + +## onDone +`onDone(self)`
+This is a event which gets fired as soon as the animation has finished. + +```lua +local basalt = require("Basalt") + +local mainFrame = basalt.createFrame() +local testButton = mainFrame:addButton("buttonToAnimate") +local aAnimation = mainFrame:addAnimation():setObject(testButton):changeTextColor({colors.red, colors.yellow, colors.green}, 2):play() +aAnimation:onDone(function() + basalt.debug("The animation is done") +end) +``` + +In XML you are also able to queue multiple animations, like this: + +```xml + + + red + yellow + green + 2 + + + + + red + yellow + green + 2 + + +``` \ No newline at end of file diff --git a/docs/objects/Basalt.md b/docs/objects/Basalt.md index bd7ab63..01c0692 100644 --- a/docs/objects/Basalt.md +++ b/docs/objects/Basalt.md @@ -46,7 +46,6 @@ basalt.createFrame("myFirstFrame"):hide() basalt.getFrame("myFirstFrame"):show() ``` - ## basalt.getActiveFrame Returns the currently active base frame @@ -70,7 +69,6 @@ local mainFrame = basalt.createFrame() basalt.autoUpdate() ``` - ## basalt.update Calls the draw and event handler once - this gives more flexibility about which events basalt should process. For example you could filter the terminate event. @@ -83,9 +81,8 @@ Calls the draw and event handler once - this gives more flexibility about which ```lua local mainFrame = basalt.createFrame() local aButton = mainFrame:addButton():setPosition(2,2) - while true do -basalt.update(os.pullEventRaw()) + basalt.update(os.pullEventRaw()) end ``` @@ -97,11 +94,9 @@ Stops the automatic draw and event handler which got started by basalt.autoUpdat ```lua local mainFrame = basalt.createFrame() local aButton = mainFrame:addButton():setPosition(2,2):setText("Stop Basalt!") - aButton:onClick(function() basalt.stopUpdate() end) - basalt.autoUpdate() ``` @@ -119,11 +114,9 @@ Checks if the user is currently holding a key ```lua local mainFrame = basalt.createFrame() local aButton = mainFrame:addButton():setPosition(2,2):setText("Check Ctrl") - -aButton:onClick(function() -basalt.debug(basalt.isKeyDown(keys.leftCtrl) ) +aButton:onClick(function() + basalt.debug(basalt.isKeyDown(keys.leftCtrl)) end) - basalt.autoUpdate() ``` @@ -144,14 +137,14 @@ Also basalt.debugFrame and basalt.debugList are available. basalt.debug("Hello! ", "^-^") ``` -## setTheme +## basalt.setTheme Sets the base theme of the project! Make sure to cover all existing objects, otherwise it will result in errors. A good example is [theme](https://github.com/Pyroxenium/Basalt/blob/master/Basalt/theme.lua) #### Parameters: 1. `table` theme layout look into [theme](https://github.com/Pyroxenium/Basalt/blob/master/Basalt/theme.lua) for a example #### Usage: -* Creates a new base frame and adds a new theme which only changes the default color of buttons. +* Sets the default theme of basalt. ```lua basalt.setTheme({ ButtonBG = colors.yellow, @@ -160,7 +153,7 @@ basalt.setTheme({ }) ``` -## setVariable +## basalt.setVariable This stores a variable which you're able to access via xml. You are also able to add a function, which then gets called by object events created in XML. #### Parameters: @@ -178,7 +171,7 @@ end)