Welcome Guest [Log In] [Register]
We hope you enjoy your visit.


You're currently viewing the Ultimate 3D Community as a guest. This means that you can only read posts, but can not create posts or topics by yourself. To be able to post you need to register. Then you can participate in the community active and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.

Join our community!

If you are already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
UI Scripts; U3D UI made easy!
Topic Started: Apr 26 2013, 01:47 AM (453 Views)
Ultimga
Newbie
[ * ]
**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:
 
//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:
 
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
Edited by Ultimga, Apr 26 2013, 10:03 PM.
No Mercy - A indie MMOFPS under development, click me to see the post!
Offline Profile Quote Post Goto Top
 
« Previous Topic · Tutorials and examples · Next Topic »
Add Reply