Simple GUI stuff - not happening

[lenvdb64]

Hey all
I have been writing code since 1995, starting with Visual Basic 4.
So this is the stuff I have worked with in the last 30 years:
Visual Basic 4 / 5 / 6 / dotNet 25 years
C# for the last 8 years.
Linux Bash scripting and KSH scripting extensively for the last 3 years.

In VS2022 C++ I can add Buttons, Menus other controls to Windows Forms and code events etc.

But in JUCE I cannot seem to find a tutorial to show me how to add a simple Exit button to a screen,
I want to add a Tab control with 2 Tabs (Can be done in VS2022 C++ but not JUCE)
I find JUCE tutorials extremely complex where every control seems like it is a class within a class within a class…

I can get a form to show, but there is no button…

So what does it take for me to create a simple GUI and add some controls??
What I seem to be able to do is effectively create a form (I work in Windows10)
I have not been able to add a button (Exit) to the bottom right of the screen…
This is my first challenge wading through complex tutorials…

Then I would like to : Either add a Tab control with 2 Tabs
or add a Menustrip to the Form with 2 Menu Items

Would anyone have some code I can stick into a cpp file for this?

[reuk]

@lenvdb64

Would anyone have some code I can stick into a cpp file for this?

I doubt anyone has exactly the code you need. However, JUCE comes with lots of example projects that show how to accomplish common tasks. You could take a look at the WidgetsDemo, which has an example of a tabbed component, and the MenusDemo which shows a menu bar in action.

To quit a JUCE app, you can call something like:

JUCEApplication::getInstance()->systemRequestedQuit();

To do this in response to a button press, you can either use a Button::Listener and call the above inside the buttonClicked callback, or you can assign a lambda to the button’s onClick member. You can find examples of both of these techniques by searching the examples for buttonClicked or onClick.

[lenvdb64]

I was able to successfully add a button yesterday after wading through heaps of complex code. I had to dumb it down and simplify it a lot to get to the core of it.
But at least I have a button on the bottom of the window, and I resized it. I cannot see Object properties anywhere and it seems one has to often guess the properties of the objects.
I created a Components.h file in which I add the Button ( and all future components will go here too)
And I added the Button object, and also a listener for it…
It is meant to be a simple Exit button.
In the Event Handler buttonClicked I added _Exit(0) which works perfectly:

void buttonClicked (juce::Button* btnExit) override //Exit button click event
    {
        _Exit(0);
    }

This works perfectly…
Next - moving on to a Tab Control with 2 tabs…
Thank you for listening to my previous rant…
It was driving me nuts to struggle doing something so simple…

[cpr2323]

Take a look at TabbedComponent for your Tab Control.

For Menus take a look at MenuBarComponent and MenuBarModel

[ibisum]

I strongly urge you to get yourself very familiar with the DemoRunner project for JUCE, and learn how to use the PIP functionality so that you can easily write GUI code without having a huge build process to load you up with complexity. With PIP’s you can run the code directly in the project, and it is a great way to avoid all the other complexity while learning the basics of the JUCE GUI framework.

Everything you want to do is very easy - but you must write code to do it - and you should step back a bit and learn how the JUCE GUI components are organized.

For your Tabs GUI, you’ll want to use the TabbedComponent. Check the DemoRunner for a great example of how this works - its pretty simple, but you may need to step back and work to understand the Component classes and how they interact with each other a bit … like I said, DemoRunner is your friend.

[lenvdb64]

Bless you - thank you -

Sorry - I do not know what PIP functionality is.
I am currently debugging with / through Visual Studio 2022 which has been a great help.

When I worked at Lloyds doing Linux Scripting I coded many scripts in Notepad initially but later got Notepad++ which was much better…
Then executed the scripts in Linux…
This was useful as I often had to scrape through thousands of log files looking for specific errors and content and produce summaries…

Right now using Projucer is like coding in Notepad. Notepad++ had some level of Intellisense.

[xenakios]

Right now using Projucer is like coding in Notepad

This doesn’t seem to make any sense, you already mentioned you are using Visual Studio anyway, so why are you not also editing the code in that?

I am not sure what the purpose of the code editor in the Projucer even is these days.

[ibisum]

@lenvdb64

Sorry - I do not know what PIP functionality is.

If you open the DemoRunner project (hint: you have to build it with Projucer first), then you will see that all of the possible UI components are demonstrated in the DemoRunner application.

This is great, because the JUCE guys very cleverly set it up so that you can see the GUI in action - but also gain access to the source code for the demo itself, modify it, make changes, and immediately see the changes reflected in the UI.

This ability, to “paste code” in the DemoRunner, is what the PIP functionality is all about.

PIP means “Projucer Instant Project” - and if you search for PIP’s in this forum, you’ll see why they’re so powerful - you can literally create an entire “mini application” to exercise some JUCE feature, without much fuss, and without having to do a gigantic host-specific project setup step, just to get to a “hello world” state.

Seriously, stop what you’re doing, and invest some effort in learning DemoRunner!

You may be struggling with the online tutorials, but the ability to make live code changes in DemoRunner/Projucer will open the door for a lot greater understanding of whats going on. Its very easy to find the demo of a UI component you’re interested in, switch to the “Code” tab for that Demo, observe the techniques used to produce the UI that is immediately rendered in front of you, copy the PIP into Projucer and make changes/tweaks live, and see the results in realtime.

Alongside the tutorials, I’d be very surprised if this didn’t immediately give you a leg up on understanding JUCE methodology.

@xenakios

I am not sure what the purpose of the code editor in the Projucer even is these days.

To provide PIP functionality, of course! But, you’re better off learning all about this in the context of DemoRunner …

[leehu]

@lenvdb64

void buttonClicked (juce::Button* btnExit) override //Exit button click event
    {
        _Exit(0);
    }

I would definitely call the suggested

JUCEApplication::getInstance()->systemRequestedQuit()

here - calling exit won’t clean anything up and is a rather extreme way of exiting an app.

[xenakios]

@ibisum

copy the PIP into Projucer and make changes/tweaks live, and see the results in realtime

I am not sure what you mean by that? Do you mean the “live build” feature that was in the Projucer for a while but was removed in Juce 6.1?

[lenvdb64]

Hi Leehu
I have tried several options now…
Its so easy in C# ( Application.exit() )
…Here I seem to have to battle against an invading army…

[hugoderwolf]

It’s in namespace juce and you probably have the global using namespace disabled (which is good imo). Try juce::JUCEApplication::getInstance()...

[lenvdb64]

Brilliant! This works a charm!
Thank you for your help.
I have had to add “juce::” to all of my calls to get it to work.

[lenvdb64]

Got the Tab Components to work.
It was a choice between a Tabbed component or Menus.
The tabs work fine and not I have 2 tabs and feel happy.
Next is to add a Listbox or Combobox to the form.
I struggled a good 2 days to try a Listbox with 4 selectable text items and just could not get it.
I then tried a Combobox and it worked in 20 mins. So much easier.
So I will avoid Listboxes like a plague and stick to Comboboxes where possible.
Live and learn. Slowly getting my GUI there…

Len

[cpr2323]

Great to hear!

Listboxes and Comboboxes general serve different purposes. I am assuming you wanted use one of them for selecting a given option, or something, from a list? The Listbox is usualy a view into a list of data, but you could certainly make it work for selecting a option type thing from a list. With the benefit being the user can see all the options without having to open the Combobox, and a Combobox saves space, showing only the current selection until the user wants to select a new option.

[lenvdb64]

Indeed - Boxes look fine and workable…
Tabs looking great!