CreatingBasicApp.adoc

Creating basic application

Install ruis on your system.

This sample uses ruisapp complementary library as OS adaptation layer, so install it on your system too.

Entry point of the ruisapp application is a method called ruisapp::create_application(), and not a traditional main(). ruisapp defines main() internally, so the user should not define main().

User should derive their application class from ruisapp::application, which will be a singleton class. Then, return an instance of that class from ruisapp::create_application(). To do that, in main.cpp include necessary ruis files:

#include <ruisapp/application.hpp>

Then we define our application class as forllows

class application : public ruisapp::application{
public:
	application() :
			ruisapp::application(ruisapp::window_params(r4::vec2ui(800, 600)))
	{
		// Here we will do all the initializations of our app, like loading the UI etc.
	}
};

And then we define the ruisapp::create_application() function

std::unique_ptr<ruisapp::application> ruisapp::create_application(int argc, const char** argv){
	return std::make_unique<::application>(); // note, that we use global namespace
}

So, now we can build and run the project, but it will display just an empty window.

Now, lets add some UI. We want to use standard ruis widgets, so, let’s initialize them in the Application constructor

class application : public ruisapp::application{
public:
	application() :
			ruisapp::application(ruisapp::window_params(r4::vec2ui(800, 600)))
	{
		// ruisapp::application has the 'gui' member variable which is an instance of ruis::gui
		this->gui.init_standard_widgets(*this->get_res_file());
	}
};

Let’s describe our GUI using the GUI script. Create a file named main.gui in the res/ directory of your project with following contents

@pile{ // frame layout places widgets in the center one on top of another
	@column{ // vertical area layout places widgets one below each other
		@push_button{
			id{hw_button} // we can find this button by ID from code
			@text{
				text{"Hello world!!!"}
			}
		}

		@text{
			id{info_text} // we can find this label by ID from code
			text{Information}
		}
	}
}

Now we need to "inflate" the GUI from script in the code and set it to application:

class application : public ruisapp::application{
public:
	application() :
			ruisapp::application(ruisapp::window_params(r4::Vec2ui(800, 600)))
	{
		this->gui.init_standard_widgets(*this->get_res_file());

		// Inflate widgets hierarchy from GUI description script
		auto c = this->gui.context->inflater.inflate(
				*this->get_res_file("res/main.gui.")
			);

		// set the widgets hierarchy to the application
		this->gui.set_root(c);
	}
};

After running the app we will see a button and a text label below it. But pressing the button will do nothing. Let’s add some action on the button press

#include <ruisapp/application.hpp>

#include <ruis/widget/label/text.hpp>
#include <ruis/widget/button/button.hpp>


class application : public ruisapp::application{
public:
	application() :
			ruisapp::application(ruisapp::window_params(r4::vec2ui(800, 600)))
	{
		this->gui.init_standard_widgets(*this->get_res_file());

		// Inflate widgets hierarchy from GUI description script
		auto c = this->gui.context->inflater.inflate(
				*this->get_res_file("res/main.gui")
			);

		// set the widgets hierarchy to the application
		this->gui.set_root(c);

		auto textLabel = c->try_get_widget_as<ruis::text>("info_text");
		ASSERT(textLabel)

		auto button = c->try_get_widget_as<ruis::push_button>("hw_button");

		auto textLabelWeak = utki::make_weak(textLabel); // make a weak pointer to the TextLabel widget.

		bool even = true;

		// connect some action on button click
		button->click_handler = [textLabelWeak, even](ruis::push_button&) mutable {
			if(auto tl = textLabelWeak.lock()){
				even = !even;
				if(even){
					tl->set_text("even");
				}else{
					tl->set_text("odd");
				}
			}
		};
	}
};



std::unique_ptr<ruisapp::application> ruisapp::create_application(int argc, const char** argv){
	return std::make_unique<::application>();
}

Now we can run the app and press the button and see that it will do something :).