Slab - An Immediate Mode GUI Library In Lua

[coding.jackalope]

Hello everyone. I'd like to introduce an immediate-mode GUI library currently in active development.

Slab

https://github.com/coding-jackalope/Slab
https://github.com/coding-jackalope/Slab/wiki

Latest Version: v0.7.2

Slab.love

(225.18 KiB) Downloaded 1251 times

Slab is an immediate mode GUI toolkit for the Love 2D framework. This library is designed to allow users to easily add this library to their existing Love 2D projects and quickly create tools to enable them to iterate on their ideas quickly. The user should be able to utilize this library with minimal integration steps and is completely written in Lua and utilizes the Love 2D API. No compiled binaries are required and the user will have access to the source so that they may make adjustments that meet the needs of their own projects and tools. Refer to main.lua and SlabTest.lua for example usage of this library.

Code: Select all

local Slab = require 'Slab'

function love.load(args)
	love.graphics.setBackgroundColor(0.4, 0.88, 1.0)
	Slab.Initialize(args)
end

function love.update(dt)
	Slab.Update(dt)
  
	Slab.BeginWindow('MyFirstWindow', {Title = "My First Window"})
	Slab.Text("Hello World")
	Slab.EndWindow()
end

function love.draw()
	Slab.Draw()
end

This is the first release of the library to the public. It is in alpha currently as all desired controls are not supported yet. Refer to the wiki for more information on the controls that are supported. All questions, comments, and suggestions are welcome as this is the first project I have released to the Love community. Hope this helps out anyone out there.

I have attached a .rar of the first release. This release comes with a main.lua and can be run to see what Slab is currently capable of.

[coding.jackalope]

Slab v0.2.0

Slab-0.2.0.zip

(71.35 KiB) Downloaded 1397 times

Hello everyone. Version 0.2.0 has just been released. This release adds new controls in the form of List Boxes and Dialog windows. Refer to the Github release page at https://github.com/coding-jackalope/Slab/releases for more information. Major new features include:

File Dialog
https://github.com/coding-jackalope/Sla ... FileDialog
A file dialog will allow a user to explore their file system and select which file or directory to open, or select a file to save. Saving a file will do some extra validation on the extension and will prompt the user if they wish to overwrite an existing file.


List Boxes
https://github.com/coding-jackalope/Slab/wiki/ListBox
The list box API allows for control of how a list of items can be rendered. They can range from simple text items to items with images and text.



If anyone has any comments, questions, or suggestion, feel free to reach out and let me know.

[dj--alex@ya.ru]

good work!

[Darlex]

Amazing!

[coding.jackalope]

Slab v0.3.0

Slab-0.3.0.zip

(89.28 KiB) Downloaded 1297 times

Slab-0.3.0.zip

(89.28 KiB) Downloaded 1270 times

Hello everyone. Version 0.3.0 has just been released. This release adds new controls, features to existing controls, and API functions for user interaction. Refer to the Github release page at https://github.com/coding-jackalope/Slab/releases for more information. Major new features include:

Color Picker
The color picker displays a window that allows the user to select a color on the spectrum.


Style Editor
The style editor allows the user to modify each setting in the Style table and save those changes to the current style.


Slab Debug
The SlabDebug module gives developers access to various profiling and editor tools to help them find issues within their own code base or with Slab's code base.


Columns
Windows now support the ability to divide controls into columns.


Radio buttons and user interaction functions have also been added to the API. Refer to the wiki pages for more information.

If anyone has any comments, questions, or suggestion, feel free to reach out and let me know.

[dan369]

Looks pretty cool.
Slight bug, the windows should have a minimum height/width. Seems i could set them via the resizable window to be negative (see attached).

[pgimeno]

Nice progress, it looks great so far!

I've found a few problems with the demo.

The text wrapping width doesn't seem to be correctly calculated.

wrap-width.png (5.24 KiB) Viewed 57005 times

Pressing Ñ or any other UTF-8 > U+007F on the edit window causes this:

Code: Select all

Error: /Internal/UI/Input.lua:121: UTF-8 decoding error: Not enough space
stack traceback:
	[string "boot.lua"]:637: in function <[string "boot.lua"]:633>
	[C]: in function 'getWidth'
	/Internal/UI/Input.lua:121: in function 'GetCursorXOffset'
	/Internal/UI/Input.lua:183: in function 'UpdateTransform'
	/Internal/UI/Input.lua:553: in function 'Text'
	API.lua:162: in function <API.lua:161>
	[string "boot.lua"]:503: in function <[string "boot.lua"]:493>
	[C]: in function 'xpcall'

Resizing the tree window horizontally causes some weird effects, where the controls move to the left and the text is not always displayed in an integer coordinate.

There are other minor issues in the text edit widget.
- The cursor sometimes disappears when going left or right while editing a long line (longer than the width of the control); it tends to happen more when skipping over an 'i'.
- The cursor width is sometimes 1 and sometimes 2 pixels. When it is 1 it's barely visible.
- When I am at the end of a line with text, then hold shift and press left, then press Backspace, the cursor jumps to the left of the last letter, rather than staying at the end. Something similar happens when cutting and pasting: if you cut then immediately paste, you don't get the original text because the cursor moves left on cut.
- Mouse positioning is not very intuitive. Ideally, clicking on the right half of the letter should go between the current and the next character. Right now, it always goes between the current and the previous character.

It would also be nice if it handled the Del key and maybe the Ctrl+Left/Right keys.

[Darlex]

I just found a weird graphical glitch that makes the cursor image change constantly
sadly my recording program just records in 30 fps and the glitch is in 60 fps. (But if you pay attention you can see the cursor contantly changing the state)

[coding.jackalope]

Thanks for the feedback everyone! It is much appreciated.

Looks pretty cool.
Slight bug, the windows should have a minimum height/width. Seems i could set them via the resizable window to be negative (see attached).

Thanks for finding this. I'll add in more error checking to this and other options with controls.

Nice progress, it looks great so far!

I've found a few problems with the demo.

The text wrapping width doesn't seem to be correctly calculated.

wrap-width

Pressing Ñ or any other UTF-8 > U+007F on the edit window causes this:

Code: Select all

Error: /Internal/UI/Input.lua:121: UTF-8 decoding error: Not enough space
stack traceback:
	[string "boot.lua"]:637: in function <[string "boot.lua"]:633>
	[C]: in function 'getWidth'
	/Internal/UI/Input.lua:121: in function 'GetCursorXOffset'
	/Internal/UI/Input.lua:183: in function 'UpdateTransform'
	/Internal/UI/Input.lua:553: in function 'Text'
	API.lua:162: in function <API.lua:161>
	[string "boot.lua"]:503: in function <[string "boot.lua"]:493>
	[C]: in function 'xpcall'

Resizing the tree window horizontally causes some weird effects, where the controls move to the left and the text is not always displayed in an integer coordinate.

There are other minor issues in the text edit widget.
- The cursor sometimes disappears when going left or right while editing a long line (longer than the width of the control); it tends to happen more when skipping over an 'i'.
- The cursor width is sometimes 1 and sometimes 2 pixels. When it is 1 it's barely visible.
- When I am at the end of a line with text, then hold shift and press left, then press Backspace, the cursor jumps to the left of the last letter, rather than staying at the end. Something similar happens when cutting and pasting: if you cut then immediately paste, you don't get the original text because the cursor moves left on cut.
- Mouse positioning is not very intuitive. Ideally, clicking on the right half of the letter should go between the current and the next character. Right now, it always goes between the current and the previous character.

It would also be nice if it handled the Del key and maybe the Ctrl+Left/Right keys.

The input control didn't have much attention this past release but will be getting more in the next release as I will be working on supporting multi-line input controls. All of this information is very helpful and will be addressed in the next release. Thanks.

I just found a weird graphical glitch that makes the cursor image change constantly
sadly my recording program just records in 30 fps and the glitch is in 60 fps. (But if you pay attention you can see the cursor contantly changing the state)

This is a known issue that I will be addressing in the next release. Right now, the system always sets the cursor back to the pointer at the beginning of the frame before the focused control changes it to something else.

[yintercept]

Jackalope just wanted to say thanks for this fantastic little library.

I tried Nuklear and despite my damndest, everything compiled, but it just didn't run for me. No error. No UI. Think I needed to run with '--fused' or something, but anyway. Tried slab, got it working first try. Your documentation is great too.

Your library has been a big help getting my tile editor to up and running quickly.

Thank you man.