AriosJentu

[REL] Custom GUI Widget System

Recommended Posts

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

Ba78L9L.png

GGyvdoB.png

Wj7Dsze.jpg

dOCpaPx.jpg

WrUwtUD.png

raGfgML.png

aYaF3w0.png

QJQlJHc.png

UiJAp44.jpg

10SM2iK.jpg

t82CxbQ.jpg

dJQkp39.jpg

Video:

 

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

 

Tutorial of installation:

 

Download (GitHub)

Wiki Documentation

Thank you.

Edited by AriosJentu
  • Like 18
  • Thanks 3

Share this post


Link to post

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.

  • Thanks 1

Share this post


Link to post
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

Share this post


Link to post
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

xw1gU9B.png

4v1lmtQ.png

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

  • Like 1

Share this post


Link to post

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.

  • Like 1

Share this post


Link to post

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.

  • Like 1

Share this post


Link to post
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)

  • Like 1

Share this post


Link to post

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:

UiJAp44.jpg

10SM2iK.jpg

t82CxbQ.jpg

  • Like 1

Share this post


Link to post

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:

QJQlJHc.png

  • Like 1

Share this post


Link to post

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.

  • Like 1

Share this post


Link to post

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

raGfgML.png

WrUwtUD.png

Share this post


Link to post

you forgot the grid list or did not create ?

Share this post


Link to post
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.

  • Like 1

Share this post


Link to post

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.

  • Like 2

Share this post


Link to post

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

  • Like 2

Share this post


Link to post

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

- Fixed bugs with removing elements in combo boxes

  • Like 2

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.