Moderators: Despellanion, Dr. Best

UI Scripts

Ultimga
Newbie
Ultimga
Newbie
Joined: 3:28 PM - Apr 18, 2013

11:47 PM - Apr 25, 2013 #1

**UPDATE: I modified the update script so the collision width & height adjust with form scaling!

I found that coding UI for U3D can get messy and modifying/adding/removing UI elements can be tough (That is, when you are using lots of UI elements.)
So, for UI to be easy to modify/add/remove in U3D I'm working on a series of scripts.

Currently you need a separate object for each form, and I hope to make it so you can create and update your forms all in one object - I think I will probably have to use arrays to store the individual variables and use for loop(s) to update every form.

To use call: ui_create_form(width,height,aplha,scale,hover?,click?,key?,key,text?,fontID,text,txtXOff,txtYOff) in create event of a object,
and call: ui_update_form(formX,formY) in the draw event of the same object.

---Form features---
+Text
+Textures
+Scaling
+Hovering
+Clicking
+Key activation
+Check if mouse is over UI
+Alpha
+Text offset
+Text position scales with form scaling
+Easy UI creation and handling :)

--Planned features--
+Font color
+Scaling along certain axis
+Using singe object for multiple forms (For a UI handler)
+Text size scaling with form scaling (A option when creating a form)
+Special forms (Scroll bars, sliders, text boxes, ect)
...and many more!

--Scripts--
ui_create_form()

Code: Select all

//ui_create_form()
//1. User defined events are used for the form actions (Clicked, hovering, key activated, nothing)
//The events are only activated if enabled on the form.
//Hovering is event 0, Clicking is event 1, Key activated is event 2, nothing/idle is event 3!
//It is planned to add font colors as well!

//2. You don't have to worry about text adjustments with scaling. Text offset is adjusted
//according to the form scale.

//3. The "Collision" for hovering & clicking is in square/rectangles according the width & height.
//Also you can't have multiple "buttons" on a form, so you may want to use multiple forms to 
//create UI elements whether for collision reasons or for interaction reasons.

//4. There is a global variable (global.MOUSE_OVER_UI) that can be used to check if the mouse 
//is over UI as well.

//----------[USAGE]------------------------------
//--> In create event call: ui_create_form(width,height,aplha,scale,hover?,click?,key?,key,text?,fontID,text,txtXOff,txtYOff)
//--> In draw event call: ui_update_form(buttonX,buttonY)
//Put code in corrosponding user defined events (Event 0 is for hovering, Event 1 is for clicking, Event 2 is for key press, Event 3 is idle/nothing)
//You can modify some arguments to affect the form if needed at any time. Some are.. (All can be modified, these are just some)
//FORM_SCALE, FORM_ALPHA, FORM_TEXT, FORM_WIDTH, FORM_HEIGHT, FORM_TEX_ID, FORM_FONT_ID

//--------[ARGUMENTS]----------------------------
//argument0 = Form width (Number)
//argument1 = Form height (Number)
//argument2 = Form alpha (Number)
//argument3 = Form scale [1 is normal size] (Number)
//argument4 = Form texture ID (Number) - This is the ID of the texture loaded in via LoadTexture
//argument5 = Is hovering enabled? (True/False)
//argument6 = Is clicking enabled? (True/False)
//argument7 = Is key press enabled? (True/False)
//argument8 = The activation key (Character, or vk)
//argument9 = Is text enabled? (True/False)
//argument10 = Font ID (Number) - This is the ID of the font created with SetFont
//argument11 = The text on the form (String)
//argument12 = Text X offset (Number)
//argument13 = Text Y offset (Number)

FORM_WIDTH = argument0
FORM_HEIGHT = argument1
FORM_ALPHA = argument2
FORM_SCALE = argument3
FORM_TEX_ID = argument4
FORM_HOVER = argument5
FORM_CLICK = argument6
FORM_KEY = argument7
ACTIVATE_KEY = argument8
FORM_ENABLE_TEXT = argument9
FORM_FONT_ID = argument10
FORM_TEXT = argument11
FORM_TEXT_XOFF = argument12
FORM_TEXT_YOFF = argument13
FORM_X = 0
FORM_Y = 0
global.MOUSE_OVER_UI = false

FORM_KEYED = false
FORM_CLICKING = false
FORM_HOVERING = false
ui_update_form()

Code: Select all

ui_update_form()
//Call this in the draw event
//argument0 = form X
//argument1 = form Y

GetMousePos();

FORM_HOVERING = false
FORM_CLICKING = false
FORM_KEYED = false
global.MOUSE_OVER_UI = false

if (global.mouse_x > FORM_X && global.mouse_y > FORM_Y)
{
    if (global.mouse_x < FORM_X+(FORM_WIDTH*FORM_SCALE) && global.mouse_y < FORM_Y+(FORM_HEIGHT*FORM_SCALE))
    {
        if (FORM_HOVER = true)
        {
            event_user(0);
            FORM_HOVERING = true
        }
        
        global.MOUSE_OVER_UI = true
    }
}

if (FORM_CLICK = true)
{
    if (MouseCheckButton(mb_left))
    {
        if (global.mouse_x > FORM_X && global.mouse_y > FORM_Y)
        {
            if (global.mouse_x < FORM_X+(FORM_WIDTH*FORM_SCALE) && global.mouse_y < FORM_Y+(FORM_HEIGHT*FORM_SCALE))
            {
                event_user(1);
                FORM_CLICKING = true
            }
        }
    }
}

if (FORM_KEY = true)
{
    if (keyboard_check(ord(ACTIVATE_KEY)))
    {
        event_user(2);
        FORM_KEYED = true
    }
}

if (FORM_HOVERING = false && FORM_CLICKING = false && FORM_KEYED = false)
{
    event_user(3);
}

DrawTex(0,argument0,argument1,FORM_SCALE,0,FORM_ALPHA);
if (FORM_ENABLE_TEXT = true) { DrawText(FORM_FONT_ID,argument0+(FORM_TEXT_XOFF*FORM_SCALE),argument1+(FORM_TEXT_YOFF*FORM_SCALE),FORM_TEXT); }
FORM_X = argument0
FORM_Y = argument1
Quote
Like
Share