Recent Posts

Pages: [1] 2 3 ... 10
1
Help requests / Re: how to use builder tool
« Last post by texus on Yesterday at 23:16:03 »
This question comes up occasionally (which is understandable as it isn't documented). The gui builder itself isn't even in the documentation or tutorials so I wasn't sure where to document it, but I have decided to just add a line on the home page, as this is the only place where the gui builder is currently mentioned on the site.
2
Help requests / Re: how to use builder tool
« Last post by abd dabbour on Yesterday at 15:27:48 »
You can load widgets from file:
Code: [Select]
gui.loadWidgetsFromFile("form.txt");

thank you very much
it works.
3
Help requests / Re: how to use builder tool
« Last post by Kvaz1r on Yesterday at 13:31:08 »
You can load widgets from file:
Code: [Select]
gui.loadWidgetsFromFile("form.txt");
4
Help requests / how to use builder tool
« Last post by abd dabbour on Yesterday at 11:48:38 »
first, thank you for the nice tool you provide
I using TGUI with visual studio 2017 on windows 7 x64
I compiled and run example successfully
now I am trying to using builder tool
I designed my form but I wonder how to use it visual studio

the file generated from GUI Builder like following

Renderer.1 {
    backgroundcolor = transparent;
    bordercolor = #3C3C3C;
    borders = (0, 0, 0, 0);
    textcolor = #3C3C3C;
}

Renderer.2 {
    textcolor = rgb(100, 100, 100);

    scrollbar {
        texturearrowdown = "themes/BabyBlue.png" Part(20, 2, 16, 16);
        texturearrowup = "themes/BabyBlue.png" Part(2, 2, 16, 16);
        texturethumb = "themes/BabyBlue.png" Part(414, 2, 16, 32);
        texturetrack = "themes/BabyBlue.png" Part(432, 2, 16, 32);
    }
}

Renderer.3 {
    textcolor = rgb(100, 100, 100);
    texture = "themes/BabyBlue.png" Part(269, 40, 90, 60) Middle(30, 0, 30, 60);
    texturedisabled = None;
    texturedown = "themes/BabyBlue.png" Part(177, 40, 90, 60) Middle(30, 0, 30, 60);
    texturefocused = None;
    texturehover = "themes/BabyBlue.png" Part(361, 40, 90, 60) Middle(30, 0, 30, 60);
}

Renderer.4 {
    caretcolor = rgb(110, 110, 255);
    defaulttextcolor = rgb(120, 120, 120);
    padding = (6, 4, 6, 4);
    selectedtextbackgroundcolor = rgb( 10, 110, 255);
    selectedtextcolor = White;
    textcolor = rgb(190, 190, 190);
    texture = "themes/Black.png" Part(0, 114, 60, 40) Middle(15, 0, 30, 40);
    texturedisabled = None;
    texturefocused = "themes/Black.png" Part(120, 114, 60, 40) Middle(15, 0, 30, 40);
    texturehover = "themes/Black.png" Part(60, 114, 60, 40) Middle(15, 0, 30, 40);
}

Renderer.5 {
    padding = (3, 3, 3, 3);
    textcolor = rgb(190, 190, 190);
    texturearrow = "themes/Black.png" Part(60, 0, 32, 32);
    texturearrowhover = "themes/Black.png" Part(60, 32, 32, 32);
    texturebackground = "themes/Black.png" Part(0, 154, 48, 48) Middle(16, 16, 16, 16);

    listbox {
        backgroundcolorhover = rgb(100, 100, 100);
        padding = (3, 3, 3, 3);
        selectedbackgroundcolor = rgb( 10, 110, 255);
        selectedbackgroundcolorhover = rgb(30, 150, 255);
        selectedtextcolor = White;
        textcolor = rgb(190, 190, 190);
        textcolorhover = rgb(250, 250, 250);
        texturebackground = "themes/Black.png" Part(0, 154, 48, 48) Middle(16, 16, 16, 16);

        scrollbar {
            texturearrowdown = "themes/Black.png" Part(163, 174, 20, 20) Middle(0, 1, 20, 19);
            texturearrowdownhover = "themes/Black.png" Part(183, 174, 20, 20) Middle(0, 1, 20, 19);
            texturearrowup = "themes/Black.png" Part(163, 154, 20, 20) Middle(0, 0, 20, 19);
            texturearrowuphover = "themes/Black.png" Part(183, 154, 20, 20) Middle(0, 0, 20, 19);
            texturethumb = "themes/Black.png" Part(143, 154, 20, 20);
            texturethumbhover = "themes/Black.png" Part(143, 174, 20, 20);
            texturetrack = "themes/Black.png" Part(123, 154, 20, 20);
            texturetrackhover = "themes/Black.png" Part(123, 174, 20, 20);
        }
    }
}

Label.Label1 {
    AutoSize = true;
    Position = (20, 20);
    ScrollbarPolicy = Never;
    Size = (93.2, 18);
    Text = "Port Number :";
    TextSize = 13;
    VerticalAlignment = Center;
    renderer = &2;
}

ComboBox.combo_Port_Name {
    ChangeItemOnScroll = true;
    ExpandDirection = Down;
    Items = [0, 1, 2, 3, 4, 5];
    ItemsToDisplay = 0;
    MaximumItems = 0;
    Position = (150, 20);
    SelectedItemIndex = 3;
    Size = (100, 22);
    TextSize = 13;
    renderer = &5;
}

Button.but_Connect {
    Position = (260, 20);
    Size = (110, 20);
    Text = Connect;
    TextSize = 13;
    renderer = &3;
}

Label.Label2 {
    AutoSize = true;
    Position = (20, 110);
    ScrollbarPolicy = Never;
    Size = (307.2, 18);
    Text = "*********** Robot Manual Control \"***********";
    TextSize = 13;
    renderer = &1;
}

Label.Label3 {
    AutoSize = true;
    Position = (20, 140);
    ScrollbarPolicy = Never;
    Size = (60.2, 18);
    Text = "Pose X : ";
    TextSize = 13;
    renderer = &1;
}

Label.Label4 {
    AutoSize = true;
    Position = (20, 170);
    ScrollbarPolicy = Never;
    Size = (59.2, 18);
    Text = "Pose Y : ";
    TextSize = 13;
    renderer = &1;
}

Label.Label5 {
    AutoSize = true;
    Position = (20, 200);
    ScrollbarPolicy = Never;
    Size = (61.2, 18);
    Text = "Pose Z : ";
    TextSize = 13;
    renderer = &1;
}

Label.Label6 {
    AutoSize = true;
    Position = (20, 230);
    ScrollbarPolicy = Never;
    Size = (115.2, 18);
    Text = "Theta Up/Down : ";
    TextSize = 13;
    renderer = &1;
}

Label.Label7 {
    AutoSize = true;
    Position = (20, 260);
    ScrollbarPolicy = Never;
    Size = (115.2, 18);
    Text = "Theta Rotation  : ";
    TextSize = 13;
    renderer = &1;
}

EditBox.txt_Pose_X {
    Position = (150, 140);
    Size = (100, 22);
    TextSize = 13;
    renderer = &4;
}

EditBox.EditBox1 {
    Position = (150, 170);
    Size = (100, 22);
    TextSize = 13;
    renderer = &4;
}

EditBox.EditBox2 {
    Position = (150, 200);
    Size = (100, 22);
    TextSize = 13;
    renderer = &4;
}

EditBox.EditBox3 {
    Position = (150, 230);
    Size = (100, 22);
    TextSize = 13;
    renderer = &4;
}

EditBox.EditBox4 {
    Position = (150, 260);
    Size = (100, 22);
    TextSize = 13;
    renderer = &4;
}

Button.But_Go2Pose {
    Position = (260, 140);
    Size = (110, 20);
    Text = "Go to Position";
    TextSize = 13;
    renderer = &3;
}

Button.But_go2HP {
    Position = (260, 170);
    Size = (110, 20);
    Text = "Go to HP";
    TextSize = 13;
    renderer = &3;
}

Button.But_RobotReset {
    Position = (260, 200);
    Size = (110, 20);
    Text = "Reset Position";
    TextSize = 13;
    renderer = &3;
}

Button.But_GO {
    Position = (260, 230);
    Size = (110, 20);
    Text = "Gripper Open";
    TextSize = 13;
    renderer = &3;
}

Button.But_GC {
    Position = (260, 260);
    Size = (110, 20);
    Text = "Gripper Close";
    TextSize = 13;
    renderer = &3;
}

Label.Label8 {
    AutoSize = true;
    Position = (20, 50);
    ScrollbarPolicy = Never;
    Size = (93.2, 18);
    Text = "Port Number :";
    TextSize = 13;
    VerticalAlignment = Center;
    renderer = &2;
}

ComboBox.combo_Port_CommSpeed {
    ChangeItemOnScroll = true;
    ExpandDirection = Down;
    Items = [9600, 14400, 19200, 28800, 38400, 57600, 115200];
    ItemsToDisplay = 0;
    MaximumItems = 0;
    Position = (150, 50);
    SelectedItemIndex = 4;
    Size = (100, 22);
    TextSize = 13;
    renderer = &5;
}


best regards

5
Help requests / Re: Menubar overlap with layout.
« Last post by texus on 21 August 2019, 23:06:50 »
The Group widget is the most basic container widget (a widget that can contain other widgets). Originally this was the Panel widget but it got split up in Group and Panel where the main difference between the two is that Group has no background color. Despite not calling setSize in my example, the group actually has a size and child widgets that would fall outside the group would be clipped.
The default size of the group is to fill the parent widget 100%, so the code that I gave actually makes the bottom part of the group fall outside of the window (as the group was positioned down a bit to start below the menu bar). This doesn't matter in this case, but if you want to rely on bottom padding then you might want to manually call setSize() on the group as well.

VerticalLayout and HorizontalLayout were contributed by someone who found them useful. They are definitely useful for positioning widgets next to each other or below each other, but I would personally only use them for simple cases like having a couple buttons below each other. The gui mostly relies on manually positioning and sizing widgets (either absolute or relative), but these layout widgets are an exception to this. These widgets try to resize and reposition the widgets that you put inside them automatically. This doesn't always perform ideally and some widgets may not work properly when placed inside a layout widget.

So if you need a container of widgets, which you are going to manually give a position, then use Group. It is useful for e.g. creating multiple screens in your program (with each screen being in a group and only one group shown), position a set of widgets relative to some point (like in your case), etc.
If you have a certain amount of space that you want to divide by a couple of widgets, then you can try to use a layout widget.

Quote
I tried set position only for layout without using group and this works too.
You can choose. You either add menuBar->getSize().y to the position of all widgets added to the gui or you create a new group widget that has this offset and add all widgets to that group. The outcome will be the same (as long as the group is large enough to fill the screen, which it is by default).
6
Help requests / Re: Menubar overlap with layout.
« Last post by Kvaz1r on 21 August 2019, 19:37:48 »
Thanks it works, I didn't know about group. I looking through tutorials and examples but didn't found anything related to it. When one should use group and not just layouts?

I tried set position only for layout without using group and this works too.   
7
Help requests / Re: Menubar overlap with layout.
« Last post by texus on 21 August 2019, 18:17:34 »
Simply add all widgets other than the menu bar to a group.

Create a group and position it below the menu bar:
auto group = tgui::Group::create();
group->setPosition(0, menuBar->getSize().y);
gui.add(group);

Remove the lines that add the widgets to the gui
gui.add(grid);
gui.add(topLayout);

And replace them with adding them to the group:
group->add(grid);
group->add(topLayout);
8
Help requests / Menubar overlap with layout.
« Last post by Kvaz1r on 21 August 2019, 12:58:33 »
I can't found a way to insert space between menu bar and panel with other widgets because without it they overlapped. How to do it correctly?

MCVE:

Code: [Select]
#include <TGUI/TGUI.hpp>

static auto File = "File";

int main()
{
sf::RenderWindow window(sf::VideoMode(400, 300), "TGUI window");
tgui::Gui gui(window);
auto topLayout = tgui::VerticalLayout::create();
auto panel = tgui::ScrollablePanel::create();
auto grid = tgui::Grid::create();

tgui::MenuBar::Ptr menuBar = tgui::MenuBar::create();
menuBar->addMenu(File);
menuBar->addMenuItem(File, L"New");
menuBar->addMenuItem(File, L"Open");
gui.add(menuBar);
auto box = tgui::CheckBox::create("0");
grid->addWidget(box, 0, 0);
auto box2 = tgui::CheckBox::create("1");
grid->addWidget(box2, 1, 0);
panel->add(grid);
gui.add(grid);
topLayout->add(panel);
gui.add(topLayout);
menuBar->moveToFront();
// Main loop
while (window.isOpen())
{
sf::Event event;
while (window.pollEvent(event))
{
if (event.type == sf::Event::Closed)
window.close();

gui.handleEvent(event); // Pass the event to the widgets
}
window.clear();
gui.draw(); // Draw all widgets
window.display();
}
}
9
Feature requests / Re: DateTime Selector
« Last post by texus on 19 August 2019, 17:54:25 »
It is a pretty complex widget. I'll add it to the todo list, but unless someone else implements it, it won't be added anywhere soon.
10
Feature requests / DateTime Selector
« Last post by ertanataman on 19 August 2019, 11:34:18 »
A datetime selector seems missing. May seem compilcated for current level but is something really required.
Pages: [1] 2 3 ... 10