[REL] Custom GUI Widget System

[AriosJentu]

Hello. This is my new custom window system with widgets. 

Just rewrited window system, including this custom GUI widgets:

- Scroll Panes

- Buttons (+ buttons with images)

- Progress Bars (automatic checking for vertical or horizontal using its size, square is horizontal)

- Scroll Bars (same as progress bars)

- Custom Themed Edit Boxes, Memo Boxes, new widget - Number Boxes (support mouse scrolling)

- Check Boxes

- Combo Boxes

- Tab Panel with tabs

- Labels

- Dialog Boxes

- Tooltips

- Loading Circles

- Table Views (Grid Lists) 

Here I've just used only OOP coding style, just copy this one lua file in your projects, and start this resource automatically, because this file getting directories from main resourcename, and using files without copying.

Screenshots

Spoiler

Video:

 

Example - Login Panel. Author - Estet (DK).

 

Tutorial of installation:

 

Download (GitHub)

Wiki Documentation

Thank you.

Edited August 28, 2018 by AriosJentu

[thisdp]

WOW! Based on cegui? I was doing the same thing 4 years ago, but failed. So I start dx gui project. Yours are great and have good looking. Keep working! Best custom gui.

[Storm-Hanma]

Great work keep going !!

[^iiEcoo'x_)]

good job , no event ( example : onCustomGUIClick ) ?

[AriosJentu]

6 hours ago, DABL said:

good job , no event ( example : onCustomGUIClick ) ?

Support all default events, look at example. But function to create event is a method of class

[FlyingSpoon]

No gridlists?

[AriosJentu]

15 hours ago, ℓιgнт said:

No gridlists?

No, but you can make scroll pane with image blocks, look at my old PM system, or Phone script:

Spoiler

Bcs this style doesn't need gridlists, what look like CEGUI gridlists

[AriosJentu]

Update: added functions for changing minimal and maximal size, and step size for EditNumberScroller, because I forgot about them.

If you have any questions about this system, how to work with it, how to use it - you can ask me here.

[China_Yann]

WOW，unbelievable

[Ea7gign]

Good job, i will use it in my open source rp project.

[AriosJentu]

Example - Login Panel by Estet (DK):

 

[AriosJentu]

Update:

- Added function to get window parts. There is function to get window frame (window:getFrame()) and window header image - part, where located title and close button (window:getHeader()), and for tab panel you now can get tab button (tab:getTabHeader([string/gui-element] TabIndex)).

- Added functions to create custom labels. It looks like default labels, but it connected with window color scheme

- Fixed events, now you can add every event of object with its method - obj:addEvent(). If event doesn't exists, you can create it using default function addEvent(...), and then add event using object method.

For more information look at the example.lua. In updated file all parent windows replaced with methods of getting frame of its window, replaced all addEventHandler's to method addEvent of object, and added example for labels.

[Ea7gign]

How can i change Windows color and Label font size ?

[AriosJentu]

1 hour ago, Ea7gign said:

How can i change Windows color and Label font size ?

To change windows color you can use changing color schematic - window:setColorSheme(colorScheme)

To change label font size, use label:setFont(font_directory, new_font_size)

[AriosJentu]

Update:

- Added 2 new themes - Purple Light and Purple Dark

- Added new widget - CustomDialog. Created events onCustomDialogAccept and onCustomDialogCancel for them.

- Now you doesn't need to call addEvent("eventName", bool) for events, created in this resource, because I added it in the end of win.lua.

- Added events when player click on close button - onCustomWindowClose, and when player choose value in combobox - onCustomComboBoxSelectItem.

- Look at the example. Now to change theme in DemoWidgets, select item in first ComboBox, called "Select Theme...".

Screenshots:

[AriosJentu]

Update

- Replaced CustomDialog arguments - now you can create Custom Dialogs with random count of buttons, just put their titles in table. Replaced events onCustomDialogAccept and onCustomDialogCancel to single event onCustomDialogClick with one function argument - button title. Look at the example file.

Screenshots:

[AriosJentu]

The Last update for today:

- Added methods to get color scheme of object

- Added new widget - ToolTip. In arguments you can set timeout in seconds to show tooltip when mouse hover on widget.

[AriosJentu]

Update

- Added Loading Circles. You can set them progress. Creation only with coordinates, because size is static.

- Added Side Bar for Window Widget. Now you can put colored bar on background for your window. Its not dynamically changing color for another widgets, just background. For EditBoxes added new method CustomEdit:putOnSide([bool] IsOnSide?) for setting EditBox's Edges colored.

Screenshots

[_Pedrin]

you forgot the grid list or did not create ?

[AriosJentu]

2 hours ago, _Pedrin said:

you forgot the grid list or did not create ?

Look at the comments, I'm not forget about them, and I won't to create them.

[AriosJentu]

Update: Added link for Wiki Documentation of resource. All information about functions will be created soon.

Edited July 19, 2018 by AriosJentu

[AriosJentu]

Update:

- Now for all widgets do not want to use functions Window:getFrame and Window:addElement(s). Just put as parent window widget (look at the example, or documentation)

- In function GuiStaticImage.create now you can use as parent argument window widget.

- Fixed bugs with relative objects and with side bar of window.

- Added more information in documentation.

[AriosJentu]

Update - added all information of functions with examples on wiki.

- Fixed bugs with Tab Panels

- Fixed bugs with Number Scrollers

- Fixed event of Combo Boxes

[AriosJentu]

Update - replaced old custom scroll pane, what I didn't understood to new, more easily for using

- Fixed bugs with removing elements in combo boxes

[dalexoxo]

Nice GUI's