Lokasenna's GUI library for Lua v2

[jkooks]

Originally Posted by solger

I guess it's possible by making a custom function in your script for creating and returning a 'full' selection table.

I ended up just creating another return value within the listbox class that keeps track of everything and returns it as the full bool list.

Originally Posted by solger

What's the use-case for which you require the 'full' listbox selection table?

I tend to iterate through the entire list in order to remove certain objects from arrays and what not, so only having the partial array would never work for me because I need the index of what items are true or not. At least in my opinion, having this full list is a lot more useful then only having the partial list.

Originally Posted by solger

By the way: are you using v2 or v3 (Scythe) of the GUI library?

I am currently using v2.

[cohler]

Is there some maximum font point size above which the Label element does not work?

I have a label that I resize according to size of the GUI window. Above a certain size, it vanishes, and then comes back if I resize down back below that size.

Is this a Windows limitation? Anybody know?

[cohler]

Did some more testing.

Above 255 pixel height as returned by gfx.measurestr on Windows, the caption just vanishes.

Is this a known PC/Windows limitation? On Mac it goes to any size.

[cohler]

I have simplified this function as much as possible and provided LICEcap videos below to demonstrate the problem.

The function below creates a GUI window to display a 3-digit number with leading zeros as necessary using the Lokasenna GUI V2.

Initially the window is sized 349x291 and the font size of the number is 255.

As the user drags the corner of the window to resize it, the GUI.onresize function adjusts the font size of the number to fit in the window at the same ratio while keeping it in the center.

This code works perfectly on the Mac. On Windows it works ONLY when the window is sized such that the height of the number in the window is 255 or less. When the number is a height of 256 or more, it disappears!

Any insights or help would be appreciated!

function Number(n)
  local lib_path = reaper.GetExtState("Lokasenna_GUI", "lib_path_v2")
  loadfile(lib_path .. "Core.lua")(); GUI.req("Classes/Class - Label.lua")()

  local w,h,sz = 349,291,255
  GUI.name, GUI.fonts.bigfont = "Number", {"Calibri",sz}  
  GUI.x, GUI.y, GUI.w, GUI.h = 0, 0, w, h
  GUI.anchor, GUI.corner, GUI.freq = "screen", "C", .03
  GUI.colors.wnd_bg = {255,255,255,255}
  
  GUI.New("mylabel", "Label", 1, 20, 20, string.format("%03d",n), 
          false, "bigfont", "white", "black")
          
  local rw,rh,bf,label = sz/w, sz/h, GUI.fonts.bigfont, GUI.elms.mylabel
  GUI.onresize = function()
    bf[2] = math.floor(math.min(GUI.cur_h*rh,GUI.cur_w*rw))
    label.x, label.y = GUI.center(label)      
    GUI.Val("mylabel",label.caption)
  end

  GUI.Init(); GUI.Main()
end
Number(1)

Here is the INCORRECT behavior on Windows...



Here is the CORRECT behavior on Mac OS X...

[aurelien]

Hello all,
Thanks for this great library, was able to create my GUI with v3.
However, I'm having a really hardtime using listbox : i spent two hours trying to add an element in my listbox...

Spent some times in the example, but there's no example of adding an element in a listbox.

I just have a button mapped to add a value in my table, and maybe refresh the listbox.

If someone is able to help

Thanks!

PHP Code:

squares = {1, 4, 9, 16, 25, 36, 49, 64, 81}
local function addText()
  -- Get the list boxs selected item(s)
  local selected = GUI.Val("lst_titles")
  local lstbox = GUI.findElementByName("lst_titles")

    -- Get and sort the selected item numbers
    for k, v in pairs(selected) do
        Msg(v)
        Msg(k)
    end
    
     table.insert(squares, 99)
     lstbox.recalculateWindow()
     
end 


[solger]

.list lets you get/set the current list values: https://jalovatt.github.io/scythe/#/...ements/Listbox

Here are two short examples to try:


1) Updating the squares table and passing this one to the listbox

PHP Code:

local squares = {1, 4, 9, 16, 25, 36, 49, 64, 81}

local function addText()
    table.insert(squares, 99)
    myListBox.list = squares
end 


2) Or updating the list directly:

PHP Code:

local squares = {1, 4, 9, 16, 25, 36, 49, 64, 81}

-- version 1
local function addText()
    local listboxEntries = myListBox.list 
    table.insert(listboxEntries, 99)
end

-- version 2
local function addText()
    table.insert(myListBox.list, 99)
end 


myListBox in the examples is the variable name:

 
local myListBox = GUI.createElement({
...

As mentioned in the link, calling Listbox:recalculateWindow() is only necessary when changing certain listbox parameters:

Listbox:recalculateWindow()
Update internal values for the window size. If you change the listbox's w, h, pad, or textFont, this method should be called afterward.

[aurelien]

Thanks for this awesome reply.
I'm not used to lua and basic functions are taking quite some time for me !

It's working great now

[forsakenlight]

Hi, I'm new here so first of all I want to say hello to everyone!
And now lets go straight to the business
I have a trivial problem, I can't find how can I get resized, window height and width. When I ask for window.h after resizing window, it doesn't hold changed value and returns my initial window size. Please can anyone can point me in the right direction?
btw I'm using Scythe v 3 form ReaPack

[Meo-Ada Mespotine]

Look at gfx.h and gfx.w.

Maybe you can transfer those values to give the guilib the current windowsize to work with.

Welcome to the forum

[forsakenlight]

Originally Posted by Meo-Ada Mespotine

Look at gfx.h and gfx.w.

Maybe you can transfer those values to give the guilib the current windowsize to work with.

Welcome to the forum

Superb, thank you, great it work like charm

[aurelien]

Hello,
Is there a way to have a validator like behavior on MenuBox item ? Exactly like the textbox have ?
The idea is to have a callback when the users is selecting a menubox item.

Is there a way to add keyboard shortcuts for specific action?

Thanks!

[solger]

Originally Posted by aurelien

Hello,
Is there a way to have a validator like behavior on MenuBox item ? Exactly like the textbox have ?
The idea is to have a callback when the users is selecting a menubox item.

Hi,

try this example (side note: selecting a menubox item via mouse is possible by clicking or using the mousewheel):

function myClickFunction(self)
  local index, value = myMenuBox:val()
  reaper.ShowConsoleMsg("Click: " .. index .. " / " .. value .. "\n")
end

function myWheelFunction(self)
  local index, value = myMenuBox:val()
  reaper.ShowConsoleMsg("Wheel: " .. index .. " / " .. value .. "\n")
end

myMenuBox = GUI.createElement({
  name = "menubox",
  type = "Menubox",
  x = 80,
  y = 20,
  w = 100,
  h = 20,
  options = {"Option 1", "Option 2", "Option 3"},
  afterMouseUp = myClickFunction,
  afterWheel = myWheelFunction
})

Originally Posted by aurelien

Is there a way to add keyboard shortcuts for specific action?

Can you post more details or an example about what you're looking for, exactly?
Like, what's the specific action in this case (that should be triggered or performed)?

[aurelien]

Awesome it's working perfectly for the menubox ! Didn't find in the documentation

As for the keyboard shortcut it's pretty simple, just launch one function when i enter some specific key.

Like press "Insert" and it's using the same function as the button...Etc

[solger]

Originally Posted by aurelien

Awesome it's working perfectly for the menubox ! Didn't find in the documentation

Yeah, the part about user events is currently not in the documentation. Only the empty placeholder (User events (placeholder)).

Some hints can be found in the examples and code files of the Scythe library v3 (developer tools) - which is a separate entry in ReaPack besides the Scythe library v3 one.
Or by looking at the code of the core Scythe library files.

Originally Posted by aurelien

As for the keyboard shortcut it's pretty simple, just launch one function when i enter some specific key.

Like press "Insert" and it's using the same function as the button...Etc

OK, I believe the approach in Scythe is still the same as in v2 of the GUI library:

If you look, for instance, at the code of the Radial Menu and Theory Helper scripts (both created with v2) from Lokasenna, the character codes for allowed input keys are usually defined in a table (GUI.chars) for easier access:

GUI.chars = {
  ESCAPE    = 27,
  SPACE    = 32,
  BACKSPACE  = 8,
  HOME    = 1752132965,
  END      = 6647396,
  INSERT    = 6909555,
  DELETE    = 6579564,
  RETURN    = 13,
  UP      = 30064,
  DOWN    = 1685026670,
  LEFT    = 1818584692,
  RIGHT    = 1919379572,
  
  F1      = 26161,
  F2      = 26162,
  F3      = 26163,
  F4      = 26164,
  F5      = 26165,
  F6      = 26166,
  F7      = 26167,
  F8      = 26168,
  F9      = 26169,
  F10      = 6697264,
  F11      = 6697265,
  F12      = 6697266
}

Checking key inputs globally (by comparing the character codes retrieved via gfx.getchar() with entries in the GUI.chars table) can be done with the help of a separate (defer loop) function:

local function CheckKeyInput()
  local char = gfx.getchar()

  -- console output to check/debug which value is sent on a button press
  -- if char > 0 then
  --  reaper.ShowConsoleMsg(tostring(char) .. "\n")
  -- end
  
  if char == GUI.chars.INSERT then
      reaper.MB("Insert", "Key", 0)
      -- do something when this particular key is pressed (as example: call the same function assigned to a button click here)
  end

  reaper.defer(CheckKeyInput)
end

GUI.func = CheckKeyInput()

Some details about the gfx.getchar function can be found here: https://www.extremraym.com/cloud/rea...ua_gfx.getchar

[jkooks]

Is there a better way of redrawing the main window rather than using gfx.quit and then gfx.init? As context, I am trying to force the resize of the main window so the height changes.

This is in version 2, by the way.

[Meo-Ada Mespotine]

No quitting necessary.

To set the window-size anew, just pass "" as name-parameter into gfx.init.

From the docs:

To resizes/reposition the window, call gfx.init again and pass an empty string as name-parameter.

The following example-code moves position and size of the gfx-window every half of a second:

gfx.init("Test")
A=0
function main()
  A=A+1
  if A==15 then 
    A=0
    gfx.init("", math.random(20)*10, math.random(20)*10, 0, math.random(20)*10, math.random(20)*10)
  end
  reaper.defer(main)
end

main()

I'm not sure, if Lokasenna's Gui-Lib reads out the windowsize dynamically, so maybe, you need to transfer gfx.w and gfx.h to some internal Gui-Lib-variables after having changed that.

If I remember, the resize/repositioning of the gfx-window had been added long after v2 of the Gui-Lib was finished, so I think, it's not automatically supported yet, but I might be wrong.

Edit: Probably related to this post? https://forum.cockos.com/showpost.ph...&postcount=728

Edit2:
I smoothed out the example code. So now, the window changes its size and position transitionary. Because it looks cooler that way

X=100
Y=100
W=100
H=100
DifX=101
DifY=101
DifW=101
DifH=101

gfx.init("Test", W, H, 0, X, Y)
function main()
  if DifX>X then X=X+1 else X=X-1 end
  if DifY>Y then Y=Y+1 else Y=Y-1 end
  if DifW>W then W=W+1 else W=W-1 end
  if DifH>H then H=H+1 else H=H-1 end
  
  if X==DifX then DifX=(math.random(20)*40)/2 end
  if Y==DifY then DifY=(math.random(20)*40)/2 end
  if W==DifW then DifW=(math.random(20)*40)/2 end
  if H==DifH then DifH=(math.random(20)*40)/2 end

    gfx.init("", W, H, 0, X, Y)

  reaper.defer(main)
end

main()

[jkooks]

Awesome, works like a charm! Not sure how I missed that post above, but thank you for pointing it out!

And for anyone else that is curious, I believe the only Lokasenna GUI variables you would need to change are setting the current width and height to the new ones.

GUI.cur_w, GUI.cur_h = GUI.w, GUI.h

[joe2]

Is there any way to give focus to a specific element programmatically in v3?

Specifically, I want a Textbox I've got to have focus when the script is launched (so the user can immediately start typing in it).

If you set focus = true for the element, it will appear to have focus, however typing won't work until you click in the textbox (it starts working with mousedown).

Another example would be "click this button and that textbox gets focus". Again, setting focus = true doesn't work as you might expect.

I've had a good dig through the code/docs/examples/etc. and have tried a few things, but unfortunately nothing works so far. I think it could be to do with the "state" that's often being passed around, about which I know nothing.

Thanks for any help!

PS if it's *not* currently possible, I wonder if it could be made possible by altering something in gui/window.lua...

[jkooks]

Originally Posted by joe2

Is there any way to give focus to a specific element programmatically in v3?

I've had success directly setting the focus to true with GUI.elms.ElementName.focus = true before I initialize the GUI (with GUI.init)

That being said I haven't found a way to reliably set focus after the main GUI has been made (even if I redraw everything), and I am also using v2 - so this may not necessarily work in v3.

[joe2]

Originally Posted by jkooks

I've had success directly setting the focus to true with GUI.elms.ElementName.focus = true before I initialize the GUI (with GUI.init

Thanks, that's useful to know. (FWIW, GUI.Init was removed for v3.[0])

I don't have the coding chops/time to pick it apart right now, but my eyes are on this bit of window.lua for possibly building a "give this element focus" method.

function Window:updateInputEvents()

...

  if elementToFocus then
    elementToFocus.focus = true
    elementToFocus:handleEvent("GotFocus", state, last)
    elementToFocus:redraw()

    state.focusedElm = elementToFocus
  end

...

Perhaps there's already a way to call/trigger that. If anyone with a better working knowledge of v3 has any ideas, let me know.

Cheers!

[0] https://github.com/jalovatt/scythe/b...p/CHANGELOG.md

[joe2]

So I made a copy of

function Window:updateInputEvents()

in window.lua, removed most of the (mouse-handling, etc.) code, and to my complete surprise it worked first time:

function Window:giveElmFocus(element)
  local state = self.state
  local last = self.lastState

  local elementUpdated
  local elementToFocus = self:findElementByName(element)
  local elementToLoseFocus

  if last.focusedElm then
    elementToLoseFocus = last.focusedElm
  end

  -- TODO: Ensure that only one element can lose focus at a time, since this
  -- would potentially override them
  if elementToFocus then elementToLoseFocus = last.focusedElm end
  if state.shouldLoseFocus then elementToLoseFocus = state.shouldLoseFocus end

  if elementToLoseFocus then
    elementToLoseFocus.focus = false
    elementToLoseFocus:handleEvent("LostFocus", state, last)
    elementToLoseFocus:redraw()

    state.focusedElm = nil
  end

  if elementToFocus then
    elementToFocus.focus = true
    elementToFocus:handleEvent("GotFocus", state, last)
    elementToFocus:redraw()

    state.focusedElm = elementToFocus
  end
end

Haven't tested extensively so some cases might break (and some of the code above might be redundant), but it seems to work, so now it's possible to give elements focus programmatically from your main script:

window:giveElmFocus("Element Name")

[Meo-Ada Mespotine]

Hey, I'm toying around with Scythe(v3) and try to alter dynamically the background-color of the window.
How can I do this or better, where are the colors of the window stored?

I can hardcode it in the theme.lua-file but this isn't feasible for the stuff I want to attempt.

[X-Raym]

Using Scythe v3,


Can someone confirm this issue ?
Q: val() get/set unit


EDIT: I found the formula:

slider:val(  (val- slider.min) / slider.inc )

---------------------

Also, is there a way to make slider width relative to gfx.w ? I tried some thing but it crashes.

--
Also, any way to hide the watermark (apart drawing over it ^^)?

[X-Raym]

@Sogler

afterMouseUp

I don't see this on the doc, or in the IDE... How did you implement it ? Where is the doc about this ? Would this work for sliders ?

[X-Raym]

Is there a way to see what element ws last in focus ?


To implement arrow key incrementation of different sliders.

[Meo-Ada Mespotine]

Ask Amagalma who needed to work on that focusing stuff for the chunkeditor.
Edit: https://forum.cockos.com/showthread.php?t=194369&page=3

[sonictim]

Originally Posted by X-Raym

Is there a way to see what element ws last in focus ?


To implement arrow key incrementation of different sliders.

Solger just taught me a cool technique involving tab indexes... perhaps you could use for sliders....

https://forum.cockos.com/showthread.php?t=243116

[solger]

Originally Posted by X-Raym

@Sogler

afterMouseUp

I don't see this on the doc, or in the IDE... How did you implement it ? Where is the doc about this ?

Mainly from looking at the code files of the core library (..\Scythe library v3\library) and of the developer tools (..\Scythe library v3\development). And then trying some things out

As example from the Scythe library v3 (developer tools):

• user-event-hooks.lua
• Scythe_Example - Working with Images.lua

Originally Posted by X-Raym

Would this work for sliders ?

Not sure. I'll have to take a look ...

[X-Raym]

@sogler
Thanks for the hint, I'll explore that !








I don't succeed to make the window open at last close position, cause the X Y positions of the window element doesn't seem to be considered at init,


How do you save/restore GFX and dock state with Scythe v3 ?

----

ALso... any idea about flexible width ?

---
I'm exploring this library, I have lots to learn to see what is possible, what isn't builtin etc.

[solger]

Originally Posted by X-Raym

I don't succeed to make the window open at last close position, cause the X Y positions of the window element doesn't seem to be considered at init,

How do you save/restore GFX and dock state with Scythe v3 ?

Here's an adapted version of the save/load window state functions based on the v2 library code to try *:

...

GUI.name = "Scythe v3 Test"

function LoadWindowState(name, title)
  if not name then return end
  
  local str = reaper.GetExtState(name, title or "window")
  if not str or str == "" then return end
  
  local dock, x, y, w, h = string.match(str, "([^,]+),([^,]+),([^,]+),([^,]+),([^,]+)")
  if not (dock and x and y and w and h) then return end

  gfx.init("", w, h, dock, x, y)
end

function SaveWindowState(name, title)
    if not name then return end

    local state = {gfx.dock(-1, 0, 0, 0, 0)}
    reaper.SetExtState(name, title or "window", table.concat(state, ","), true)
end

reaper.atexit(function ()
  SaveWindowState(GUI.name)
end)

window:open()
LoadWindowState(GUI.name)

GUI.Main()

* Restoring the previous window size and position doesn't seem to be implemented in the latest available version of the Scythe library.

Originally Posted by X-Raym

ALso... any idea about flexible width ?

Looks like it still needs to be done manually (as it was the case with v2) by using, for instance, the onResize hook:

window.onResize = function()
  reaper.ShowConsoleMsg("window resize hook triggered \n")
  -- add code for adjusting the element parameters (width, height, etc.) here
end

Here's a demo code with the code parts mentioned above:

local libPath = reaper.GetExtState("Scythe v3", "libPath")
if not libPath or libPath == "" then
    reaper.MB("Couldn't load the Scythe library. Please install 'Scythe library v3' from ReaPack, then run 'Script: Scythe_Set v3 library path.lua' in your Action List.", "Whoops!", 0)
    return
end

loadfile(libPath .. "scythe.lua")()
GUI = require("gui.core")

GUI.name = "Scythe v3 Test"

local window = GUI.createWindow({
  name = GUI.name,
  w = 200,
  h = 200
})

function LoadWindowState(name, title)
  if not name then return end
  
  local str = reaper.GetExtState(name, title or "window")
  if not str or str == "" then return end
  
  local dock, x, y, w, h = string.match(str, "([^,]+),([^,]+),([^,]+),([^,]+),([^,]+)")
  if not (dock and x and y and w and h) then return end

  gfx.init("", w, h, dock, x, y)
end

function SaveWindowState(name, title)
    if not name then return end

    local state = {gfx.dock(-1, 0, 0, 0, 0)}
    reaper.SetExtState(name, title or "window", table.concat(state, ","), true)
end

reaper.atexit(function ()
  SaveWindowState(GUI.name)
end)

window.onResize = function()
  reaper.ShowConsoleMsg("window resize hook triggered \n")
  -- add code for adjusting the element parameters (width, height, etc.) here
end

window:open()
LoadWindowState(GUI.name)

GUI.Main()

[X-Raym]

@Sogler
Thanks for this !


It is a progress for sure :P

Looks like it still needs to be done manually (as it was the case with v2) by using, for instance, the onResize hook:

I tried:

  slider_zoom.w = gfx.w -40
  layer.window.w = gfx.w
  layer.window.currentW = gfx.w
  layer.window.elmUpdated = true
  layer.needsRedraw =true
  layer.window.needsRedraw = true

But this doesn't works properly, seems like the slider has an original bounding that the slider can go beyond:

it only resize left by shrinking, not extending.





Any idea ?

[X-Raym]

I tried the hidden redrawn function,
it give similar results:

slider_zoom.w = gfx.w -16*2
layer.window.w = gfx.w
layer.window.currentW = gfx.w
slider:recalculateInternals()
slider:redraw()

Label is centered according to gfx.width change but slider doenst change.


In, fact it seems only slider background isnt updated

[X-Raym]

seems like :init() is the only place where roundrect is called.


so

  slider.w = gfx.w -16*2
  --layer.window.w = gfx.w
  layer.window.currentW = gfx.w
  val = slider:val()
  --slider:recalculateInternals()
  --slider:redraw()
  slider:init()
  slider:val( slider_zoom:stepFromValue( val ) )

this seems to work, though calling init restore the default value too so it has to been updated as well with current val, and then restore.


Maybe it has other issue too, needs testing.




But it seems to me that something would have to be changed right in the library to overcome all these dirty workarounds (well, maybe not that dirty after all... needs testing ^^)

[X-Raym]

I have implemented a nice Focused element system and keyboard control (incrementation or button action)

[solger]

Originally Posted by X-Raym

I have implemented a nice Focused element system and keyboard control (incrementation or button action)

Very nice

[X-Raym]

@solger
I have extened it to manage MAJ+Sift for greater incremntation, and Click element to set focus as well.
It is very close to be accessible.


With this focus system, adding text to speach function for visual impair viewer to value change event and focus change event can make this GUI usable by everyone:


https://forum.cockos.com/showthread.php?t=242284

(though it would surely need some consideration to not spam the text to speech translator at every increment change)

Thx for our help which put me on track :P

[joe2]

Originally Posted by X-Raym

I have implemented a nice Focused element system and keyboard control (incrementation or button action)

Looks like great stuff!

Are you keeping this code on a public github or anything? (I didn't spot it here at a glance: https://github.com/X-Raym )

In addition to the stuff I mentioned above about giving elements focus, I've also added some element classes (if that's what they're called?), like a more complex listbox that supports keyboard interaction, etc. etc.

I haven't worked on/with Scythe much recently but I'm hoping to do more at some point.

[woodslanding]

I'd like to use Lokasenna's 'require' functionality and I can't figure out where it's located....

I'd like to be able to point it to my script folder, rather than Scythe's, so I can require my own scripts. Anybody managed to do that?

Thanks!!!
-eric

[MusoBob]

I'm trying to capture the Enter key with textbox entry.

solger's code example

local function CheckKeyInput()
    local char = gfx.getchar()

    if char == GUI.chars.ESCAPE then
        -- do something when ESCAPE is pressed
        ...
    elseif char == GUI.chars.RETURN then
       -- do something when RETURN is pressed
       ...
    end

    reaper.defer(CheckKeyInput)
end

GUI.func = CheckKeyInput()

GUI.func = Check() -- will work to get the Enter key with the code above
BUT the LS elements won't update in the check function unless I use
GUI.func = Check -- without () but then it won't get the Enter key.

-- GUI.func will run on every loop
-- Use this to set the poll time in seconds:
GUI.freq = .05

So I want to be able to update the Label name to the current bpm
and check if Enter in the textbox then set new bpm.

cur_bpm = reaper.Master_GetTempo()
GUI.elms.bpm_label:ondelete()
GUI.New("bpm_label", "Label", 1, 140, 1, cur_bpm , true, 1)
GUI.elms.bpm_label:init()

[solger]

Originally Posted by MusoBob

-- GUI.func will run on every loop
-- Use this to set the poll time in seconds:
GUI.freq = .05

So I want to be able to update the Label name to the current bpm
and check if Enter in the textbox then set new bpm.

cur_bpm = reaper.Master_GetTempo()
GUI.elms.bpm_labelndelete()
GUI.New("bpm_label", "Label", 1, 140, 1, cur_bpm , true, 1)
GUI.elms.bpm_label:init()

One option is to add your code logic in the lostfocus hook (which is triggered when hitting ENTER in the textbox):

local function setBPM()
  bpm = GUI.Val("my_txt")
  reaper.SetCurrentBPM(0, bpm,0)
end

function GUI.elms.my_txt:lostfocus()
  setBPM()
  GUI.Textbox.lostfocus(self)
end