Hello everyone!
I have implemented some UI elements into my application.
Before I delve into the features, I must first explain on how to run the code. All the code is available at https://github.com/lannisraurus/carbon-tools.
Compilation
First off, you will need to have installed g++, SDL2, SDL2_image and SDL2_ttf.
sudo apt install g++
sudo apt install libsdl2-dev
sudo apt install libsdl2-image-dev
sudo apt install libsdl2-ttf-dev
Program Structure
The inner structure of the program looks like this as of now:
-> bin stores the application.
-> headers store the header files.
-> main stores the main.cpp.
-> src stores all the cpp files.
If we look inside bin:
-> The menus folder has all the menus (each menu is an application).
-> font.ttf (slkscr.ttf) is the font I'll be using for the program.
-> main.exe is the application (run ./main.exe inside the folder).
-> Makefile is used to compile (run make main.exe inside the folder).
-> settings.data stores base program settings (resolution, looks, etc...)
If we take a peek inside settings.data:
So far we have 2 settings - colours and screen dimensions.
Screen dimensions are self explanatory; colours, on the other hand, dictate how we highlight buttons and UI elements:
0: red
1: green
2: blue
3: magenta
4: yellow
5: cyan
6: rainbow (happy pride!)
Now let's take a look inside the menus folder:
This has a list of data files containing menu information. A menu is defined by an ID and a list of buttons (which will do stuff like travel between menus, be text input, etc).
Looking inside ui.data, the base menu that displays on start we see:
ID X defines the menu ID (negative numbers are reserved for utility, such as the settings menu).
So far I have implemented 3 types of buttons:
-> button: does nothing except glow upon mouse hover.
-> menu_button: warps between menus upon clicking.
-> text_display: glowy text with highlight colour.
All buttons are initialized like this:
buttonType WIDTH HEIGHT X Y TEXT_SIZE(0, 1 or 2) N_PARAMTERS <PARAMETERS> [NAME]
WIDTH, X -> [0,1] in relative screen width.
HEIGHT, Y -> [0,1] in relative screen height.
TEXT_SIZE -> how does the text fill the button.
N_PARAMETERS -> how many extra parameters will the button take (for utility buttons like menu buttons).
PARAMETERS -> list of parameters following (int).
[NAME] -> must be between [], the text displayed in the button.
Progress so far
Having said this, let's see how the application looks so far!
NOTE: compiling takes quite a while on the raspberry pi! Do not panic hehe.
I have decided to coin the name "Carbon Tools", because I thought the element 14 was Carbon (chemistry was a looong time ago...). It has now come to my attention that the element 14 is, indeed, Silicon (thank you genebren)! I am keeping the name carbon though :)
So far we have no application displaying on screen. Just 2 text displays and 1 menu button. clicking it warps us to menu -2, which will be used for the settings (the button on the top left changes, clicking it again goes back to the main menu):
Last message
That will be all for today! Cheers!
