ReiLuaGui calculator example.

This commit is contained in:
jussi
2022-12-07 22:27:24 +02:00
parent 1a1c3cb28c
commit 79fbb36d2a
11 changed files with 392 additions and 20 deletions

2
API.md
View File

@@ -1067,7 +1067,7 @@ int id. Basic Sound source and buffer
---
> NPatchInfo = { { 0, 0, 24, 24 }, 0, 0, 0, 0, NPATCH_NINE_PATCH } or { source = { 0, 0, 24, 24 }, left = 0, top = 0, right = 0, bottom = 0, layout = NPATCH_NINE_PATCH }
> NPatchInfo = { { 0, 0, 24, 24 }, 8, 8, 8, 8, NPATCH_NINE_PATCH } or { source = { 0, 0, 24, 24 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH }
{ Rectangle source, int left, int top, int right, int bottom, int layout }.
{ Texture source rectangle, Left border offset, Top border offset, Right border offset, Bottom border offset, Layout of the n-patch: 3x3, 1x3 or 3x1 }

View File

@@ -145,7 +145,7 @@ apiFile:write( "\n> BoundingBox = { { 0.0, 0.0, 0.0 }, { 1.0, 1.0, 1.0 } }\n\
{ min, max }. Bounding box type for 3d mesh\n\n---\n" )
apiFile:write( "\n> Sound = SoundId\n\
int id. Basic Sound source and buffer\n\n---\n" )
apiFile:write( "\n> NPatchInfo = { { 0, 0, 24, 24 }, 0, 0, 0, 0, NPATCH_NINE_PATCH } or { source = { 0, 0, 24, 24 }, left = 0, top = 0, right = 0, bottom = 0, layout = NPATCH_NINE_PATCH }\n\
apiFile:write( "\n> NPatchInfo = { { 0, 0, 24, 24 }, 8, 8, 8, 8, NPATCH_NINE_PATCH } or { source = { 0, 0, 24, 24 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH }\n\
{ Rectangle source, int left, int top, int right, int bottom, int layout }.\
{ Texture source rectangle, Left border offset, Top border offset, Right border offset, Bottom border offset, Layout of the n-patch: 3x3, 1x3 or 3x1 }\n\n---\n" )
apiFile:write( "\n> ModelAnimations = ModelAnimationsId\n\

View File

@@ -10,6 +10,7 @@ local container = {}
-- local circleTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/circle.png" )
local circleTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/plain-circle.png" )
local checkTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/check-mark.png" )
local borderTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/ui_border.png" )
local textInput
RL_GenTextureMipmaps( circleTexture )
@@ -29,8 +30,8 @@ function initGui()
-- HAling = Gui.ALING.CENTER,
-- type = Gui.CONTAINER.HORIZONTAL,
-- VAling = Gui.ALING.CENTER,
type = Gui.CONTAINER.GRID,
columns = 2,
-- type = Gui.CONTAINER.GRID,
-- columns = 2,
-- rows = 2,
scrollable = true,
showScrollbar = true,
@@ -50,6 +51,16 @@ function initGui()
} )
dog:add( Gui.text:new( { text = "Dog", HAling = Gui.ALING.LEFT } ) )
dog:add( Gui.texture:new( {
bounds = dog.bounds:clone(),
texture = borderTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
visible = true,
nPatchInfo = { source = { 0, 0, 24, 24 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH },
} ) )
dog:add( Gui.texture:new( { bounds = Rect:new( 0, 0, 24, 24 ), texture = circleTexture, HAling = Gui.ALING.RIGHT, color = Color:new( 150, 150, 255 ) } ) )
dog:add( Gui.texture:new( { bounds = Rect:new( 0, 0, 24, 24 ), texture = checkTexture, HAling = Gui.ALING.RIGHT, visible = true } ) )
-- dog:add( Gui.text:new( { text = "Cat", HAling = Gui.ALING.RIGHT } ) )

View File

@@ -0,0 +1,354 @@
package.path = package.path..";"..RL_GetBasePath().."../resources/lib/?.lua"
util = require( "utillib" )
Vec2 = require( "vector2" )
Rect = require( "rectangle" )
Color = require( "color" )
Gui = require( "gui" )
-- Textures.
local cancelTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/cancel.png" )
local borderTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/ui_border.png" )
local bgrTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/ui_bgr.png" )
RL_GenTextureMipmaps( cancelTexture )
RL_GenTextureMipmaps( bgrTexture )
RL_SetTextureFilter( cancelTexture, TEXTURE_FILTER_TRILINEAR )
RL_SetTextureFilter( bgrTexture, TEXTURE_FILTER_TRILINEAR )
RL_SetTextureWrap( borderTexture, TEXTURE_WRAP_REPEAT )
RL_SetTextureWrap( bgrTexture, TEXTURE_WRAP_REPEAT )
-- Calculator definition.
Calculator = {}
Calculator.__index = Calculator
function Calculator:new( pos )
pos = pos or Vec2:new( 0, 0 )
local object = setmetatable( {}, self )
object.HANDLE_HIGHT = 32
object.DISPLAY_HIGHT = 40
object.OPERATIONS = { ADD = 0, SUB = 1, MUL = 2, DIV = 3 }
object.windowRect = Rect:new( pos.x, pos.y, 196, 244 )
object.dragPos = Vec2:new( 0, 0 )
-- Handle
object.handle = Gui.element:new( {
bounds = Rect:new( 0, 0, object.windowRect.width, object.HANDLE_HIGHT ),
padding = 10,
onClicked = function()
object:set2Top()
object.dragPos = Vec2:new( RL_GetMousePosition() ) - Vec2:new( object.handle.bounds.x, object.handle.bounds.y )
Gui.heldCallback = function() object:drag() end
end,
} )
object.handle:add( Gui.texture:new( {
bounds = object.handle.bounds:clone(),
texture = bgrTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
color = Color:new( LIGHTGRAY ),
} ) )
object.handle:add( Gui.texture:new( {
bounds = object.handle.bounds:clone(),
texture = borderTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
color = Color:new( LIGHTGRAY ),
nPatchInfo = { source = { 0, 0, 24, 24 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH },
} ) )
object.handle:add( Gui.text:new( { text = "Calculator", fontSize = 20, VAling = Gui.ALING.CENTER } ) )
-- Close button.
object.closeButton = Gui.element:new( {
bounds = Rect:new( 0, 0, object.HANDLE_HIGHT, object.HANDLE_HIGHT ),
onClicked = function()
object:setVisible( false )
end,
onMouseOver = function( self ) self.items[1].color = Color:new( WHITE ) end,
notMouseOver = function( self ) self.items[1].color = Color:new( BLACK ) end,
} )
object.closeButton:add( Gui.texture:new( {
bounds = object.closeButton.bounds:clone(),
texture = cancelTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
} ) )
-- Panel.
object.panel = Gui.element:new( {
bounds = Rect:new( 0, 0, object.windowRect.width, object.windowRect.height - object.HANDLE_HIGHT ),
} )
object.panel:add( Gui.texture:new( {
bounds = object.panel.bounds:clone(),
texture = bgrTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
color = Color:new( GRAY ),
} ) )
object.panel:add( Gui.texture:new( {
bounds = object.panel.bounds:clone(),
texture = borderTexture,
HAling = Gui.ALING.CENTER,
VAling = Gui.ALING.CENTER,
color = Color:new( LIGHTGRAY ),
nPatchInfo = { source = { 0, 0, 24, 24 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH },
} ) )
-- Display.
object.display = Gui.element:new( {
bounds = Rect:new( 0, 0, object.windowRect.width - 16, object.DISPLAY_HIGHT ),
padding = 10,
drawBounds = true,
color = Color:new( WHITE )
} )
object.display:add( Gui.text:new( { text = "", fontSize = 30, VAling = Gui.ALING.CENTER, maxTextLen = 8 } ) )
-- Buttons.
local buttonStrings = { "7", "8", "9", "/", "4", "5", "6", "*", "1", "2", "3", "-", "0", "C", "=", "+" }
object.buttons = {}
for y = 0, 3 do
for x = 0, 3 do
local i = x + y * 4
table.insert( object.buttons, Gui.element:new( {
bounds = Rect:new( 0, 0, 40, 32 ),
drawBounds = true,
onMouseOver = function( self ) self.color = Color:new( LIGHTGRAY ) end,
notMouseOver = function( self ) self.color = Color:new( GRAY ) end,
} ) )
object.buttons[ #object.buttons ].pos = Vec2:new( 8 + x * 46, object.HANDLE_HIGHT + object.DISPLAY_HIGHT + 16 + y * 38 )
object.buttons[ #object.buttons ]:add( Gui.text:new( { text = buttonStrings[i+1], fontSize = 30, HAling = Gui.ALING.CENTER, VAling = Gui.ALING.CENTER } ) )
if buttonStrings[i+1] == "/" then
object.buttons[ #object.buttons ].onClicked = function() object:setOperation( object.OPERATIONS.DIV ) end
elseif buttonStrings[i+1] == "*" then
object.buttons[ #object.buttons ].onClicked = function() object:setOperation( object.OPERATIONS.MUL ) end
elseif buttonStrings[i+1] == "-" then
object.buttons[ #object.buttons ].onClicked = function() object:setOperation( object.OPERATIONS.SUB ) end
elseif buttonStrings[i+1] == "+" then
object.buttons[ #object.buttons ].onClicked = function() object:setOperation( object.OPERATIONS.ADD ) end
elseif buttonStrings[i+1] == "C" then
object.buttons[ #object.buttons ].onClicked = function() object:clear() end
elseif buttonStrings[i+1] == "=" then
object.buttons[ #object.buttons ].onClicked = function() object:equals() end
else
object.buttons[ #object.buttons ].onClicked = function() object:addValue( tonumber( buttonStrings[i+1] ) ) end
end
end
end
-- Calculator variables.
object.value1 = ""
object.value2 = ""
object.operation = nil
-- Set position.
object:setPosition( Vec2:new( object.windowRect.x, object.windowRect.y ) )
return object
end
function Calculator:setPosition( pos )
self.windowRect.x = pos.x
self.windowRect.y = pos.y
self.handle:setPosition( pos )
self.closeButton:setPosition( Vec2:new( pos.x + self.windowRect.width - self.HANDLE_HIGHT, pos.y ) )
self.panel:setPosition( Vec2:new( pos.x, pos.y + self.HANDLE_HIGHT ) )
self.display:setPosition( Vec2:new( pos.x + 8, pos.y + self.HANDLE_HIGHT + 8 ) )
for _, button in ipairs( self.buttons ) do
button:setPosition( pos + button.pos )
end
end
function Calculator:drag()
local mousePos = Vec2:new( RL_GetMousePosition() )
local winPos = Vec2:new( self.handle.bounds.x, self.handle.bounds.y )
self:setPosition( mousePos - self.dragPos )
end
function Calculator:setVisible( visible )
self.handle.visible = visible
self.handle.disabled = not visible
self.closeButton.visible = visible
self.closeButton.disabled = not visible
self.panel.visible = visible
self.panel.disabled = not visible
self.display.visible = visible
self.display.disabled = not visible
for _, button in ipairs( self.buttons ) do
button.visible = visible
button.disabled = not visible
end
end
function Calculator:set2Top()
self.panel:set2Top()
for _, button in ipairs( self.buttons ) do
button:set2Top()
end
self.handle:set2Top()
self.closeButton:set2Top()
self.display:set2Top()
end
function Calculator:addValue( value )
if self.operation == nil then
self.value1 = self.value1..value
else
self.value2 = self.value2..value
end
self:updateDisplay()
end
function Calculator:setOperation( operation )
if self.value1 ~= "" then
self.operation = operation
end
if self.value2 ~= "" then
self:equals()
end
self:updateDisplay()
end
function Calculator:clear()
self.value1 = ""
self.value2 = ""
self.operation = nil
self:updateDisplay()
end
function Calculator:updateDisplay( setText )
local text = setText or ""
if self.value1 ~= "" then
text = self.value1
end
if self.operation ~= nil then
if self.operation == self.OPERATIONS.ADD then
text = text.." + "
elseif self.operation == self.OPERATIONS.SUB then
text = text.." - "
elseif self.operation == self.OPERATIONS.MUL then
text = text.." * "
elseif self.operation == self.OPERATIONS.DIV then
text = text.." / "
end
end
if self.value2 ~= "" then
text = text..self.value2
end
self.display.items[1]:set( text )
end
function Calculator:equals()
local result = 0
if self.operation == self.OPERATIONS.ADD then
result = tonumber( self.value1 ) + tonumber( self.value2 )
elseif self.operation == self.OPERATIONS.SUB then
result = tonumber( self.value1 ) - tonumber( self.value2 )
elseif self.operation == self.OPERATIONS.MUL then
result = tonumber( self.value1 ) * tonumber( self.value2 )
elseif self.operation == self.OPERATIONS.DIV then
if tonumber( self.value2 ) == 0 then
self:clear()
self:updateDisplay( "Error" )
return
else
result = tonumber( self.value1 ) / tonumber( self.value2 )
end
end
self:clear()
self.value1 = tostring( result )
self:updateDisplay()
end
-- End of calculator definition.
local calculator = nil
local calculator2 = nil
local showButton = nil
function initGui()
showButton = Gui.element:new( {
bounds = Rect:new( 0, 0, 96, 32 ),
drawBounds = true,
onClicked = function()
calculator:setVisible( true )
calculator2:setVisible( true )
end,
onMouseOver = function( self ) self.color = Color:new( LIGHTGRAY ) end,
notMouseOver = function( self ) self.color = Color:new( GRAY ) end,
} )
showButton:add( Gui.text:new( { text = "Show", VAling = Gui.ALING.CENTER, HAling = Gui.ALING.CENTER } ) )
calculator = Calculator:new( Vec2:new( 128, 96 ) )
calculator2 = Calculator:new( Vec2:new( 340, 96 ) )
end
function init()
local monitor = 0
local mPos = RL_GetMonitorPosition( monitor )
local mSize = RL_GetMonitorSize( monitor )
winSize = RL_GetWindowSize()
RL_SetWindowTitle( "Calculator" )
RL_SetWindowState( FLAG_WINDOW_RESIZABLE )
RL_SetWindowState( FLAG_VSYNC_HINT )
RL_SetWindowSize( winSize )
RL_SetWindowPosition( { mPos[1] + mSize[1] / 2 - winSize[1] / 2, mPos[2] + mSize[2] / 2 - winSize[2] / 2 } )
initGui()
end
function process( delta )
Gui.process( Vec2:new( RL_GetMousePosition() ) )
end
function draw()
RL_ClearBackground( RAYWHITE )
Gui.draw()
end

View File

@@ -4,7 +4,7 @@ local origin = { 0.0, 0.0 }
-- local ninePatchInfo = { { 0.0, 0.0, 24.0, 24.0 }, 8, 8, 8, 8, NPATCH_NINE_PATCH }
local ninePatchInfo = { source = { 0, 0, 24.0, 24.0 }, left = 8, top = 8, right = 8, bottom = 8, layout = NPATCH_NINE_PATCH }
local nPatchTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/n-patch.png" )
local nPatchTexture = RL_LoadTexture( RL_GetBasePath().."../resources/images/ui_border.png" )
function init()
RL_SetWindowTitle( "N-Patches" )

View File

@@ -4,6 +4,9 @@ arcade_platformerV2.png GrafxKid CC0 https://opengameart.org/content/ar
apple.png Jussi Viitala CC0
grass.png Jussi Viitala CC0
snake.png Jussi Viitala CC0
ui_border.png Jussi Viitala CC0
ui_bgr.png Jussi Viitala CC0
check-mark.png Delapouite Creative Commons 3.0 https://game-icons.net Resized
circle.png Delapouite Creative Commons 3.0 https://game-icons.net Resized
plain-circle.png Delapouite Creative Commons 3.0 https://game-icons.net Resized
cancel.png Sbed Creative Commons 3.0 https://game-icons.net Resized

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -3,8 +3,6 @@ Rect = require( "rectangle" )
Vec2 = require( "vector2" )
Color = require( "color" )
-- NOTE!!! Work in progress! Do not use.
--[[
To add repeat inputs to the keys pressed buffer, you could add GLFW_REPEAT in railib rcore.c in function "KeyCallback" by changing:
@@ -43,15 +41,16 @@ Gui = {
mouseButton = MOUSE_BUTTON_LEFT,
font = 0,
fontSize = 30,
fontSize = 20,
padding = 2,
spacing = 4,
scrollbarWidth = 8,
scrollAmount = 10,
heldCallback = nil,
_cells = {},
_mousePos = Vec2:new( 0, 0 ), -- Last mouse position that was passed to Gui.process.
_heldCallback = nil,
_inputElement = nil,
_inputItem = nil, -- Must be type Text.
}
@@ -119,11 +118,11 @@ function Gui.process( mousePosition )
Gui._mousePos = mousePosition
if Gui._heldCallback ~= nil then
if Gui.heldCallback ~= nil then
if RL_IsMouseButtonDown( Gui.mouseButton ) then
Gui._heldCallback()
Gui.heldCallback()
else
Gui._heldCallback = nil
Gui.heldCallback = nil
end
return
@@ -265,7 +264,7 @@ function Text:draw()
return
end
RL_DrawText( self.font, self.text, { self._prante.bounds.x + self.bounds.x, self._prante.bounds.y + self.bounds.y }, self.fontSize, self.spacing, self.color )
RL_DrawText( self.font, self.text, { self._parent.bounds.x + self.bounds.x, self._parent.bounds.y + self.bounds.y }, self.fontSize, self.spacing, self.color )
end
-- Texture.
@@ -285,6 +284,7 @@ function Texture:new( set )
object.origin = setProperty( set, "origin", Vec2:new( 0, 0 ) )
object.rotation = setProperty( set, "rotation", 0 )
object.color = setProperty( set, "color", Color:new( WHITE ) )
object.nPatchInfo = setProperty( set, "nPatchInfo", nil )
object.visible = setProperty( set, "visible", true )
object._parent = nil
@@ -319,14 +319,18 @@ function Texture:draw()
end
local dst = {
self.bounds.x + self._prante.bounds.x,
self.bounds.y + self._prante.bounds.y,
self.bounds.x + self._parent.bounds.x,
self.bounds.y + self._parent.bounds.y,
self.bounds.width,
self.bounds.height
}
if self.nPatchInfo ~= nil then
RL_DrawTextureNPatch( self.texture, self.nPatchInfo, dst, self.origin, self.rotation, self.color )
else
RL_DrawTexturePro( self.texture, self.source, dst, self.origin, self.rotation, self.color )
end
end
-- Shape.
@@ -385,7 +389,7 @@ function Shape:draw()
return
end
local pos = Vec2:new( self._prante.bounds.x, self._prante.bounds.y )
local pos = Vec2:new( self._parent.bounds.x, self._parent.bounds.y )
if self.shape == Gui.SHAPE.LINE then
RL_DrawLine( self.startPos + pos, self.endPos + pos, self.thickness, self.color )
@@ -472,7 +476,7 @@ end
function Element:add( item )
table.insert( self.items, item )
item._prante = self
item._parent = self
self:update()
end
@@ -686,7 +690,7 @@ function Container:update()
padding = 0,
drawBounds = true,
color = Color:new( GRAY ),
onClicked = function() Gui._heldCallback = function() self:mouseScroll( Vec2:new( 0, 1 ) ) end end,
onClicked = function() Gui.heldCallback = function() self:mouseScroll( Vec2:new( 0, 1 ) ) end end,
} )
self._VScrollbar:add( Gui.shape:new( {
@@ -703,7 +707,7 @@ function Container:update()
padding = 0,
drawBounds = true,
color = Color:new( GRAY ),
onClicked = function() Gui._heldCallback = function() self:mouseScroll( Vec2:new( 1, 0 ) ) end end,
onClicked = function() Gui.heldCallback = function() self:mouseScroll( Vec2:new( 1, 0 ) ) end end,
} )
self._HScrollbar:add( Gui.shape:new( {