UiUtils Documentation

Info
====

Table format is as follows:

a = {
    button1 = {
        type = "button",
        xy = {10, 20},
        hw = {50, 100},
        click = myClickFuncton, -- called as myClickFunction(id)
        textColor = colors.white,
        activeTextColor = colors.white,
        color = colors.red,
        activeColor = colors.green,
        toggle = true,
        active = false,
        text = "Button",
        data = myData
    },
    label1 = {
        type = "label",
        xy = {10, 20},
        hw = {50, 100},
        color = colors.blue,
        textColor = colors.white,
        text = "This is some text",
        data = myData
    },
    point1 = {
        type = "point",
        yx = {10, 20},
        color = colors
    line1 = {
        type = "line",
        direction = "horizontal", -- "horizontal", "vertical", "diagonalLeft", "diagonalRight"
        xy = {10, 20},
        length = 5,
        color = colors.blue,
        textColor = colors.white,
        char = " ", -- must have length 1
        data = myData
    box1 = {
        type = "box",
        xy = {10, 20},
        hw = {50, 100},
        color = colors.blue,
        textColor = colors.white,
        char = " ", -- must have length 1
        data = myData
    },
    frame1 = {
        type = "frame",
        xy = {10, 20},
        hw = {50, 100},
        color = colors.red,
        textColor = colors.white,
        char = " ", -- must have length 1
        data = myData
    },
    pattern1 = {
        type = "pattern",
        xy = {10, 20},
        hw = {50, 100},
        iterator = myIteratorFunction, -- will be called as myIteratorFunction(currX, currY, id)
            -- should return "{color = color, textColor = textColor, char = char}"
        data = myData
    },
    textField1 = {
        type = "textField",
        xy = {10, 20},
        hw = {50, 100},
        offsetX = 0,
        offsetY = 0,
        color = colors.black,
        textColor = colors.white,
        text = "This is some auto-wrapped text.\nCool, right?",
        data = myData
    },
    textBox1 = {
        type = "textBox",
        xy = {10, 20},
        length = 10,
        text = "This is some default text",
        cursorPos = 0,
        color = colors.black,
        textColor = colors.white,
        isAtEnd = true -- will automatically set cursorPos to #text
    },
    textEdit1 = {
        type = "textEdit",
        xy = {10, 20},
        hw = {50, 100},
        cursorXY = {1, 1} ...
    }
}

Notes:


When a native UI system element updates, all custom table elements on the screen will be cleared.

Use labels instead of print/write to write text on the screen.

All "xy" values dictate the top left corner of where the element will be drawn (except for diagonal lines).

All "xy" values of lines dictate the start of the line. Horizontal lines start on the left, vertical/diagonal lines start at the top.

Custom table UI elements will NOT effect the native UI system.

The native UI table CANNOT be iterated (it will behave as if it is empty).

The native UI table will automatically update when changed.

The "data" values will not be touched by any components of the API, can be used for your own purposes.

If a textbox is focused, runEvent will never call back mouse clicks as it will be caught to blur the textbox.

Events will NEVER be caught by the api. For any interaction to occur, you MUST run the even through uiutils.runEvent().

This api will NOT rely on os.pullEventRaw(), and you DO NOT EVER have to run terminate events through os.pullEventRaw().


The following applies ONLY to elements using the custom table system (drawCustomTable()):


All functions will be called with original table instead of the id (because there is no id).

You will be responsible for updating and redrawing all elements when they update.

On buttons, the "toggle" value will have no effect.