DESCRIPTION

ProUI is a collection of Construct 3 behaviors that makes it super easy to create professional User Interfaces for your game, for any platform.

Creating UIs has always been daunting in Construct. But thanks to ProUI now everyone can create beautiful and juicy UIs right from the comfort of the C3 editor, without needing to touch the event sheet most of the time.

With ProUI you can easily make :

  • Buttons
  • Checkbox
  • Radio Buttons
  • Slider Bar
  • Progress Bar
  • Discrete Progress Bar
  • Scroll View
  • Grid View
  • Dialog boxes (Pop ups)
  • Translation

TUTORIAL & DOCUMENTATION

SUPPORT & SUGGESTIONS

IMPORTANT

  • ProUI only supports the new C3 runtime
  • A copie bought is only valid for one seat/Develope


New Release :  The Sprite Bundle

StatusReleased
CategoryTool
PlatformsHTML5
Rating
Rated 4.6 out of 5 stars
(10 total ratings)
Authoraekiro
Made withConstruct
Tags2D, addon, construct, Construct 2, construct3, Game engine, Graphical User Interface (GUI), User Interface (UI)

Purchase

Buy Now$29.00 USD or more

In order to download this tool you must purchase it at or above the minimum price of $29 USD. You will get access to the following files:

ProUI_v1.817.zip 848 kB

Development log

View all posts

Comments

Log in with itch.io to leave a comment.

Hi can you show me how to have 2 gridviews on the same layout? I sent message to your discord but it requires friend to receive message. Thanks!

I just bought the plugin a few days ago and works great in the layout. What if I want to access it from Javascript? Can it be controlled from javascript such as opening dialog from scripting etc.. ?

unfortunatly no

Thanks for the reply. Finally I found out a solution to bridge between javascript and event sheets which solved my problems.

(1 edit)

hi , i follow youtube tutorial in gridview, the problem i have is that text and icon not go inside list like you see. i dont know what i miss if you can help me i will be very thankful.

Can you provide expressions to access the values on DiscreteProgressPart? At the very least, the part index?

Hi,

I found that when I use the plugin in a web export, the sound on a click doesn't work if I try on Safari, iPhone XR, iOS 15.4.1. It works fine on any other device and navigator. It is not my project, even the demo (on this page) doesn't work. If you click on the first button on the first page : no sound.

Do you have an idea on this issue ?

Very good plugin however is it possible to change with the script the gridview parameter in game or by default of horizontal padding/spacing, vertical padding/spacing using the item name.

Hey, first I want to say I love the plugin. But I'm running into an issue with button behavior. 

First, the full 9-patch button is clickable. But once I open a dialog over it, and close it, that same button becomes only clickable in certain areas of the 9-patch. It results in having to press the button a couple times to get it to work which feels very janky. This is only on android export.

Any idea Aekiro?

Hey, have you found a fix for this yet?

(+1)

Yes, that dialog that I opened - I had to manually move its Y position further away once I closed it. It was actually still hanging out over part of my screen (invisible), covering part of the button.

Hi, great job, very useful plugin. Do you consider to include someday a way to control the mouse cursor style within the pluign ? (for example hover a button the mouse style becomes a hand, wich is a really common UI behavior !). Thanks !

Thank you. tbh no plan to add mouse cursor feature for now.

Hi. I'm sorry for my bad english. I want to make a scrollable list, but I don't want to get this list from the JSON object. I want to create the data in the array one after the other. Is there any way I can do this?

Hi, I'm using ProUI a week and it's very nice addon. But I have a question about the gridView. It works nice while I'm not trying to add more than one gridView behavior on the same layer. For example, if object1 has gridView behavior and object2 also has, than everything is broken and any of it doesn't work. Objects are on the different layers. Is it expected behavior? Thank you!

(1 edit)

hi, it's possible to have 2 gridviews (with scrollviews) on same layout.  Just check how each of them is set up. Reach me on discord I can show you an example. 

discord username = Aekiro#1066

Does this work with Construct 2? Sorry, but the 'Construct 2' tag has my hopes up.

no unfortunately it's only for C3.

Deleted 1 year ago
(1 edit)

You can get the download links again from here : https://itch.io/docs/buying/already-bought

(1 edit)

Hi, aekiro, this is a great plug-in! But I want to know 1. How to make an itemlist scroll type, then scroll at the bottom to load more projects and Ajax 2. Scroll type can scroll to gridviewdatabind. Index? TNX

(-1)

You can scroll to a an item like this : 

I can not use proui in C3 234.4

even if set the Script type to Classic

please help~~


That does not look like a proui error.  To be sure, try using proui + button in a empty project and see if you still get this error.

Hi, it's me again :-) I read on Construct forum that you already solved bug with simple and advanced minification in Construct build but for me it works only without minification. Did I miss something?

Make sure you're not using an old bundled version of ProUI.

If that's not the case, share with me the console errors.

On my side, C3 latest stable, export with advanced minif works  fine.

I use latest version of C3 and proUI plugin (bought it 2 days before). I try also your demo and advanced minif, got this error

And on my project when I use proUI plugin my android app stack on loading for a while and black screen appear after that (even if I comment out/disable all code related to proUI). In C3 preview mode works fine. Any suggestions?

contact me on Discord (Aekiro#1066) to send you a fix.

(2 edits)

Hi Aekiro, I bought your plugin an it seems great.  Demo GridView shows how to load icons and for icons it loads animation frame number from JSON. But when I try to load image directly by image name it loads only last image multiple times. What could be a problem? Tnx


All the picflaggrid instances share the same frames, so when you load an image into one it also loads in all the others. It's just how C3 works. To work around this limitation i made an add-on called remoteSprite, please look at the leaderboard example in the demo project. Also, remoteSprite doesn't work in worker mode, so you need to turn off worker mode in your project before using the remoteSprite add-on.

Tnx, it works now but it doesn't work if worker mode is set to auto too. Do you have plans to make it work in worker mode in the future? I'm just curious because if worker mode brings great improvements in performance in future it would be nice to set worker mode on.

there's no plan to support worker for now. But if you want worker mode, you can still use the sprite object like before, but you need to:

1- create as many frames in sprites as the pictures you want to load

2- when you load a picture into the sprite, increment some counter so that the next image is loaded in the next frame 

Sure, like in your demo. Ok, tnx

Hi Aekiro, the plugin is great! How to get the C3 file of The Demo? I want to learn more from the demo.

I tried many time to preview project but unsuccess. check your pluggin plz

I will check what's wrong and let you know asap  Thanks.

Hi Aekiro, I'm having trouble with ScrollView. I have it added as a child of a sprite that is outside the layout at startup. The user has to click a button to bring in this sprite. When the sprite is brought in the layout in view, the scrollview content does not load unless the user clicks on the 'viewport' first. 

Hi, just make sure you parent the content of the scrollview to the scrollview.

here's an example : https://gofile.io/d/xyz6aH

I figured out the problem, it seems to occur when tweening the parent's size/position. I found a solution though. Thank you and this addon is a lifesaver!

Dear Aekiro, when Using your DemoUI, When I hover or click to check box, the animation didn't play. And The check box was disappeared as below video. Could you please help me to check it?

https://drive.google.com/file/d/1CocSZ6xzSPhaZ2dry1nDphkm0C9IBFc-/view?usp=shari...

(+1)

Hello, sorry that was a bug. It was fixed in the last version.

Thank you.

I'm loving you plugin so far, really helpful!!
Are you planning to add a Text Input too as an update?

Thank you. For now there's no plan.

(2 edits)

Hi, I have an issue with the plugin 1.73. Its giving a TypeError: Cannot read property 'updateLocals' of undefined error pointing at aekiro_gameobject.updateLocals(); I've sent you a message on discord but no reply. Hope you can help! Thanks!!

Thanks for reporting. I just replied to you on Discord.

Is possible to change the number of column of a gridview at runtime? (or by reloading it?)

Hi, it's not possible at this moment. But it shouldn't be hard to add this feature. I'll let you know when it's done.

(1 edit)

the scrollview tool doesn't work for me, I tried 6 times even starting from a white sheet and copying step by step what the youtube video shows, but it doesn't work on contruct 3? could you tell me why and if it happens to you?

Hi, you need to initialize proui. Check the eventsheet  Sorry about it.

lol, I got caught out by the same thing.

Hi, there is a bug in the translation plugin with the "get" expression. In case of null the software trhouw an expression of toString. I solved using the same if(value!=undefined){ of instance.js

Thanks. I'll fix it asap.

(1 edit)

I found a couple of bugs on your Dialog Plugins, if you use the Scale Up and Scale Down animations for opening and closing a dialog respectively, the whole texture of the layer is re-scaled and displaced, which causes the image of the layout to displace incorrectly and leave the blank background visible. Can you take a look at this bug? Thanks

Dude, the plugins has a couple of anoying bugs. If I call the initialize action of ProUI it doesn't necessarily triggers immediatelly to operate with the progresss bar, for instance: I have several event sheets, if I use the "set" of the progress bar, sometimes it throws an exception stating the "width" property of the "transf" attribute can not be set, because "transf" is undefined. So, I know how to solve this by code, I suggest you remove the "initialize" from the ProUI and add an OnLoadPromise to force the engine to initialize always before anything happens. Otherwise, we'll have to make this wait 0.1 ms or a random time before being able to use the properties of the plugin.... 

Is there a way or a site where you file those issues?

Hi, the init action needs to be the first thing to be executed on any eventsheet. So maybe you're including an eventsheet that set the progress bar before init action get called ?

 Can you share with me a simple example where the bug occurs, with me on Discord or here.

What I can do is add "on init" trigger.

I write plugins for C3 too, what I'm suggesting is you add a Load Promise in the instance.js file. I used to have "init" actions on my plugins too, but this caused lots of sync problems since some events are triggered at a different timing than when initiating the plugin.

This codesnipet at the constructor of your ProUI plugin will work.

            this.GetRuntime().AddLoadPromise(

                new Promise(
                    (resolve,reject)=>{
                        try {
                            //DO YOUR STUFF HERE                            
                            resolve();
                        }
                        catch (e){
                            reject(e);
                        }
                    }
                )
            );

This is 100% reliable, the game won't start unless your features are loaded correctly before anything else. You can then deprecate the Init action of your plugin.

(3 edits)

Thanks, I'll try that. The thing is, the init action needs the current layout with its objects ready. So maybe, when this.GetRuntime().AddLoadPromise() resolves, the layout is not ready yet ?

Yes, when the AddLoadPromise is executed is before the rest of the objects are ready, Construct won't finish loading until the promise is resolved. For instance, if I create a dependency with a third party API or I created my own set of classes that MUST be loaded before the plugin works, I use that promise to make sure it is available before anything else. I noticed that some times I had to add a "wait X seconds" before your behaviors work, I saw this with the progress var, I can't set the value right away, so I added a small wait to make sure the behavior works.

hey i just run to this issue .
after i do save game state.and move to another layout... 
and load that save i did.. this happen

(1 edit)

I recently purchased your plugins, nice work. There's one thing that's making me uncomfortable, there's no way I can set like a "prefabs" layout, design the UI there, and then create it dynamically in other layout. For instance, I create my "dialog templates" on a "prefabs" layout and I wanted to spawn them dynamically in different game scenes, but if the object doesn't exist in the scene I want to create it in, there's no way I can do it. So my suggestion, please add an action to Pro UI main plugin so that we can create objects groups that are not in the same layout.

Sorry for late reply, but I don't think that's possible in construct. There's however a clone action in the proui plugin that receive json string. What you can do is when your game launch it first goes through the prefab layout, where you save all the prefabs as json in a dictionary. Now anywhere in the game you can clone a prefab with the clone action of proui plugin.

Actually you can, as long as the object exisit in a layout construct is able to create new objects. The problem with the plugin is that I must have the object in the same layout I'm using it, and this causes more complications since I just want my object to be a template (for instance, the frames with buttons for claiming awards, dialog box templates created at runtime, etc). If the object is part of the gameObject hierarchy, and I create it, it won't create its child objects unless it actually exist in the layout I'm using it. There's also the posibility I'm doing this wrong with your plugin, but I will appreciate it if you can explain more

OK; I'll try to make an example on my side.

Hey aekiro, is there a way to allow scrollview to use text boxes rather than just images?

I wanted to show long text passages using a scrollview/scrollbar

(+1)

Of course, just put the text as child of the content container.

i’ve tried everything and can’t get it to work. is there a way that i can contact you direct?

(+1)

discord.gg/r26yW59

username = Aekiro

when i create the dialogue (i followed your youtube video to the pixel) the child button and image are already in place before the background slides down.

has something been updated in C3 since your last release?

(3 edits) (+1)

Hi, probably you need to initialize ProUI with the init action at the start of the layout. If that's the case, I'm sorry about not updating the tutorials.

Also, please look in the demo project for how things are setup.

(+1)

PERFECT! that was it! - the video doesn’t show the initialise part. Works great now.

If you were to have dialogs with tab sheets, that would be the deal maker for me!

(1 edit)

hey i installed aekiro_progress.c3addon but when i try to run my game it shows black screen (only when i use the progress bar)

and yes i run c3 runtime

Pretty cool set of tools. If you want, I can feature it on my channel

Cool, what's your channel ?

Here is the link to my youtube channel » https://www.youtube.com/user/jogosgratispro

(+1)

Works brilliantly! Thank You!

(1 edit) (+1)

Thank you, great :)

(+2)

Yes please! I need this so badly. Dealing with complex UI is the worst part of making games in C3.

(+1)

agreed!

(+2)

This is more than welcome for Construct 3 community. UI is the worst and most difficult part for C3 developers. Keep working on it. It looks really promising.