Jump to content
Ultra Engine Community

Video Tutorials for Ultra App Kit?

Josh

By Josh
in General Discussion

 Share

Recommended Posts

Josh Grand Master

Josh

Posted
  • Author
Posted

I think in the future lines, polygons, and Bezier curves could be supported. For the time being, you might want to use OpenGL for advanced drawing if possible.

I will see about the custom widgets. It is doable by creating a panel and then adding "widget blocks" to it, which I have not documented yet.

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
m.yuneeb90 Newbie

m.yuneeb90

Posted
Posted
7 hours ago, Josh said:

I think in the future lines, polygons, and Bezier curves could be supported. For the time being, you might want to use OpenGL for advanced drawing if possible.

I will see about the custom widgets. It is doable by creating a panel and then adding "widget blocks" to it, which I have not documented yet.

Yes at the moment I am thinking about combining app kit with imgui rendered in directx as directx is what I use mostly instead of opengl. Also I digged into widget blocks and tried to make them work with panel but couldnt get it working, so I will look forward to when you document it. Thanks. 

Link to comment
Share on other sites
Josh Grand Master

Josh

Posted
  • Author
Posted

Here is a quick custom widget example:
  

#include "UltraEngine.h"

using namespace UltraEngine;

enum CustomWidgetStyle
{
    CUSTOMWIDGET_DEFAULT = 0
};

class CustomWidget : public Widget
{
    bool hover;
protected:
    virtual void MouseMove(const int x, const int y) {}
    
    virtual void MouseEnter(const int x, const int y)
    {
        hover = true;
        Redraw();
    }
    
    virtual void MouseLeave(const int x, const int y)
    {
        hover = false;
        Redraw();
    }

    virtual void MouseDown(const MouseButton button, const int x, const int y) {}
    virtual void MouseRepeat(const MouseButton button, const int x, const int y) {}
    virtual void MouseUp(const MouseButton button, const int x, const int y) {}
    virtual void LoseFocus() {}
    virtual void DoubleClick(const MouseButton button, const int x, const int y) {}
    virtual void TripleClick(const MouseButton button, const int x, const int y) {}
    virtual void GainFocus() {}
    virtual void KeyDown(const KeyCode key) {}
    virtual void KeyUp(const KeyCode key) {}
    virtual void KeyChar(const int keychar) {}
    virtual void MouseWheel(const int delta, const int x, const int y) {}
    virtual void Activate() {}

    virtual void Draw(const int x, const int y, const int width, const int height)
    {
        blocks.clear();
        Vec4 color = Vec4(1, 0, 0, 1);
        if (hover) color = Vec4(0, 1, 0, 1);

        //Background rectangle
        AddBlock(iVec2(0), this->size, color);

        //Foreground text
        AddBlock(text, iVec2(0), this->size, Vec4(1), TEXT_CENTER | TEXT_MIDDLE);
    }
public:
    CustomWidget() : hover(false)
    {}
};

shared_ptr<Widget> CreateCustomWidget(const WString& text, const int x, const int y, const int width, const int height, shared_ptr<Widget> parent, const CustomWidgetStyle style)
{
    auto widget = make_shared<CustomWidget>();
    widget->Initialize(text, x, y, width, height, parent, style);
    return widget;
}

int main(int argc, const char* argv[])
{
    //Get the displays
    auto displays = GetDisplays();

    //Create a window
    auto window = CreateWindow("Ultra Engine", 0, 0, 800, 600, displays[0]);

    //Create User Interface
    auto ui = CreateInterface(window);

    //Create widget
    auto widget = CreateCustomWidget("Custom",20,20,120,36,ui->root, CUSTOMWIDGET_DEFAULT);

    while (true)
    {
        const Event ev = WaitEvent();
        switch (ev.id)
        {
        case EVENT_WIDGETACTION:
            Print("Widget action: " + String(ev.data));
            break;
        case EVENT_WINDOWCLOSE:
            return 0;
            break;
        }
    }
    return 0;
}

 

  • Like 1

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
m.yuneeb90 Newbie

m.yuneeb90

Posted
Posted
44 minutes ago, Josh said:

I have added some documentation here:
https://www.ultraengine.com/learn/CPP/CustomWidgets

It is not a detailed explanation but I don't think you will have trouble with it. Please let me know if you have any questions.

Its more than enough for me for now. I understood the concept, ran the code everything worked fine, also modified the code to add 2 buttons in a single widget which also worked perfect. I have some ideas that i will be testing using this system for the next few days will let you know if i face an issue. Thanks for the help.

Link to comment
Share on other sites
Josh Grand Master

Josh

Posted
  • Author
Posted
On 4/4/2021 at 12:34 AM, Martin Harris said:

That's great news, looking forward to seeing it. I'm wanting to put a black and grey checkerboard into a window with openGL would that be something which could go in? I'm working through GL at the moment as it's the first time with this for me.

I have not dealt with OpenGL in a couple of years, and in immediate mode in much longer. I came up with this, but something is still missing to make the texture appear on the background and I don't know what: 

#include "UltraEngine.h"

#include <GL/GL.h>
#pragma comment (lib, "opengl32.lib")

using namespace UltraEngine;

int main(int argc, const char* argv[])
{
    //Get the available displays
    auto displays = GetDisplays();

    //Create a window
    auto window = CreateWindow("OpenGL Example", 0, 0, 800, 600, displays[0], WINDOW_TITLEBAR | WINDOW_RESIZABLE);

    //Initialize OpenGL context
    HWND hwnd = window->GetHandle();
    HDC hdc = GetDC(hwnd);

    PIXELFORMATDESCRIPTOR pfd =
    {
        sizeof(PIXELFORMATDESCRIPTOR),
        1,
        PFD_DRAW_TO_WINDOW | PFD_SUPPORT_OPENGL | PFD_DOUBLEBUFFER,    // Flags
        PFD_TYPE_RGBA,        // The kind of framebuffer. RGBA or palette.
        32,                   // Colordepth of the framebuffer.
        0, 0, 0, 0, 0, 0,
        0,
        0,
        0,
        0, 0, 0, 0,
        24,                   // Number of bits for the depthbuffer
        8,                    // Number of bits for the stencilbuffer
        0,                    // Number of Aux buffers in the framebuffer.
        PFD_MAIN_PLANE,
        0,
        0, 0, 0
    };

    // Select an appropriate pixel format that is supported by the hdc
    int format = ChoosePixelFormat(hdc, &pfd);

    if (SetPixelFormat(hdc, format, &pfd) == 0) RuntimeError("SetPixelFormat() failed.");

    HGLRC glcontext = wglCreateContext(hdc);

    if (glcontext == NULL) RuntimeError("wglCreateContext() failed.");

    wglMakeCurrent(hdc, glcontext);

    auto pixmap = CreatePixmap(2, 2, TEXTURE_RGBA);
    pixmap->WritePixel(0, 0, RGBA(0,0,0,255));
    pixmap->WritePixel(1, 0, RGBA(0, 255, 255, 255));
    pixmap->WritePixel(0, 1, RGBA(0, 0, 0, 255));
    pixmap->WritePixel(1, 1, RGBA(0, 255, 255, 255));

    GLuint tex;
    glGenTextures(1,&tex);
    glBindTexture(GL_TEXTURE_2D, tex);
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 2, 2, 0, GL_RGBA8, GL_UNSIGNED_BYTE, pixmap->pixels->Data());
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    
    while (!window->Closed())
    {
        iVec2 sz = window->ClientSize();
        glViewport(0, 0, sz.x, sz.y);
        glClearColor(0.15f, 0.15f, 0.15f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

        glEnable(GL_TEXTURE_2D);

        glBegin(GL_QUADS);

        glColor3f(1, 1, 1);

        glTexCoord2f(0, 1);
        glVertex2f(-1, -1);

        glTexCoord2f(1, 0);
        glVertex2f(1, -1);

        glTexCoord2f(1, 0);
        glVertex2f(1, 1);

        glTexCoord2f(1, 0);
        glVertex2f(-1, 1);

        glEnd();

        glBegin(GL_TRIANGLES);
        glColor3f(1, 0, 0);
        glVertex3f(0, 0.5, 0);
        glColor3f(0, 1, 0);
        glVertex3f(0.5, -0.5, 0);
        glColor3f(0, 0, 1);
        glVertex3f(-0.5, -0.5, 0);
        glEnd();

        SwapBuffers(hdc);
    }
    return 0;
}

 

  • Like 1

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
Josh Grand Master

Josh

Posted
  • Author
Posted

I've got the texture appearing now but it's not quite right: 

#include "UltraEngine.h"

#include <GL/GL.h>
#pragma comment (lib, "opengl32.lib")

using namespace UltraEngine;

int main(int argc, const char* argv[])
{
    //Get the available displays
    auto displays = GetDisplays();

    //Create a window
    auto window = CreateWindow("OpenGL Example", 0, 0, 800, 600, displays[0], WINDOW_TITLEBAR | WINDOW_RESIZABLE);

    //Initialize OpenGL context
    HWND hwnd = window->GetHandle();
    HDC hdc = GetDC(hwnd);

    PIXELFORMATDESCRIPTOR pfd =
    {
        sizeof(PIXELFORMATDESCRIPTOR),
        1,
        PFD_DRAW_TO_WINDOW | PFD_SUPPORT_OPENGL | PFD_DOUBLEBUFFER,    // Flags
        PFD_TYPE_RGBA,        // The kind of framebuffer. RGBA or palette.
        32,                   // Colordepth of the framebuffer.
        0, 0, 0, 0, 0, 0,
        0,
        0,
        0,
        0, 0, 0, 0,
        24,                   // Number of bits for the depthbuffer
        8,                    // Number of bits for the stencilbuffer
        0,                    // Number of Aux buffers in the framebuffer.
        PFD_MAIN_PLANE,
        0,
        0, 0, 0
    };

    // Select an appropriate pixel format that is supported by the hdc
    int format = ChoosePixelFormat(hdc, &pfd);

    if (SetPixelFormat(hdc, format, &pfd) == 0) RuntimeError("SetPixelFormat() failed.");

    HGLRC glcontext = wglCreateContext(hdc);

    if (glcontext == NULL) RuntimeError("wglCreateContext() failed.");

    wglMakeCurrent(hdc, glcontext);

    auto pixmap = CreatePixmap(2, 2, TEXTURE_RGBA);
    pixmap->WritePixel(0, 0, RGBA(0, 0, 0, 255));
    pixmap->WritePixel(1, 0, RGBA(255, 255, 255, 255));
    pixmap->WritePixel(0, 1, RGBA(0, 0, 0, 255));
    pixmap->WritePixel(1, 1, RGBA(255, 255, 255, 255));

    GLuint tex;
    glGenTextures(1, &tex);
    glBindTexture(GL_TEXTURE_2D, tex);
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA8, 2, 2, 0, GL_RGBA, GL_UNSIGNED_BYTE, pixmap->pixels->Data());
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);

    while (!window->Closed())
    {
        iVec2 sz = window->ClientSize();
        glViewport(0, 0, sz.x, sz.y);
        glClearColor(0.15f, 0.15f, 0.15f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

        glEnable(GL_TEXTURE_2D);

        glBegin(GL_QUADS);

        glColor3f(1, 1, 1);

        glTexCoord2f(0, 1);
        glVertex2f(-1, -1);

        glTexCoord2f(1, 1);
        glVertex2f(1, -1);

        glTexCoord2f(1, 0);
        glVertex2f(1, 1);

        glTexCoord2f(0, 0);
        glVertex2f(-1, 1);

        glEnd();
        
        glDisable(GL_TEXTURE_2D);

        glBegin(GL_TRIANGLES);
        glColor3f(1, 0, 0);
        glVertex3f(0, 0.5, 0);
        glColor3f(0, 1, 0);
        glVertex3f(0.5, -0.5, 0);
        glColor3f(0, 0, 1);
        glVertex3f(-0.5, -0.5, 0);
        glEnd();

        SwapBuffers(hdc);
    }
    return 0;
}

 

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
Josh Grand Master

Josh

Posted
  • Author
Posted

Here you go:

Untitled.thumb.png.a06d42a135356fa2bc60e88d3470503b.png 

#include "UltraEngine.h"

#include <GL/GL.h>
#pragma comment (lib, "opengl32.lib")

using namespace UltraEngine;

int main(int argc, const char* argv[])
{
    //Get the available displays
    auto displays = GetDisplays();

    //Create a window
    auto window = CreateWindow("OpenGL Example", 0, 0, 800, 600, displays[0], WINDOW_TITLEBAR | WINDOW_RESIZABLE);

    //Initialize OpenGL context
    HWND hwnd = window->GetHandle();
    HDC hdc = GetDC(hwnd);

    PIXELFORMATDESCRIPTOR pfd =
    {
        sizeof(PIXELFORMATDESCRIPTOR),
        1,
        PFD_DRAW_TO_WINDOW | PFD_SUPPORT_OPENGL | PFD_DOUBLEBUFFER,    // Flags
        PFD_TYPE_RGBA,        // The kind of framebuffer. RGBA or palette.
        32,                   // Colordepth of the framebuffer.
        0, 0, 0, 0, 0, 0,
        0,
        0,
        0,
        0, 0, 0, 0,
        24,                   // Number of bits for the depthbuffer
        8,                    // Number of bits for the stencilbuffer
        0,                    // Number of Aux buffers in the framebuffer.
        PFD_MAIN_PLANE,
        0,
        0, 0, 0
    };

    // Select an appropriate pixel format that is supported by the hdc
    int format = ChoosePixelFormat(hdc, &pfd);

    if (SetPixelFormat(hdc, format, &pfd) == 0) RuntimeError("SetPixelFormat() failed.");

    HGLRC glcontext = wglCreateContext(hdc);

    if (glcontext == NULL) RuntimeError("wglCreateContext() failed.");

    wglMakeCurrent(hdc, glcontext);

    auto pixmap = CreatePixmap(2, 2, TEXTURE_RGBA);
    pixmap->WritePixel(1, 0, RGBA(0, 0, 0, 255));
    pixmap->WritePixel(0, 0, RGBA(255, 255, 255, 255));
    pixmap->WritePixel(0, 1, RGBA(0, 0, 0, 255));
    pixmap->WritePixel(1, 1, RGBA(255, 255, 255, 255));

    GLuint tex;
    glGenTextures(1, &tex);
    glBindTexture(GL_TEXTURE_2D, tex);
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA8, 2, 2, 0, GL_RGBA, GL_UNSIGNED_BYTE, pixmap->pixels->Data());
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);

    while (!window->Closed())
    {
        iVec2 sz = window->ClientSize();
        glViewport(0, 0, sz.x, sz.y);
        glClearColor(0.15f, 0.15f, 0.15f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

        glEnable(GL_TEXTURE_2D);

        glBegin(GL_QUADS);

        glColor3f(1, 1, 1);

        float scale = 1.0f / 64.0f;

        glTexCoord2f(0, sz.y * scale);
        glVertex2f(-1, -1);

        glTexCoord2f(sz.x * scale, sz.y * scale);
        glVertex2f(1, -1);

        glTexCoord2f(sz.x * scale, 0);
        glVertex2f(1, 1);

        glTexCoord2f(0, 0);
        glVertex2f(-1, 1);

        glEnd();
        
        glDisable(GL_TEXTURE_2D);

        glBegin(GL_TRIANGLES);
        glColor3f(1, 0, 0);
        glVertex3f(0, 0.5, 0);
        glColor3f(0, 1, 0);
        glVertex3f(0.5, -0.5, 0);
        glColor3f(0, 0, 1);
        glVertex3f(-0.5, -0.5, 0);
        glEnd();

        SwapBuffers(hdc);
    }
    return 0;
}

 

  • Thanks 1

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
SlipperyBrick Rookie

SlipperyBrick

Posted
Posted

I'm currently porting over my OpenGL renderer into my newest solution which is an application that will have a UAK GUI. I've not been able to completely focus on this at the moment as I have a bunch of University assignments I need to finish before start my masters research project. My end goal is to have an application that meets my current requirements for my research project (real-time neural supersampling, think NVIDIA DLSS but without NVIDIA hardware).

I'll write a short blog when I get back to working on it on how I managed to get modern OpenGL and UAK into my project (I've seen a few people ask about this in a couple of other posts).

On 4/4/2021 at 2:52 PM, m.yuneeb90 said:

Yes at the moment I am thinking about combining app kit with imgui rendered in directx as directx is what I use mostly instead of opengl. Also I digged into widget blocks and tried to make them work with panel but couldnt get it working, so I will look forward to when you document it. Thanks. 

Out of interest why would you want to use IMGUI with UAK? UAK pretty much does the same thing bar the fact that IMGUI is an immediate-mode GUI library. Personally I think UAK is actually better than IMGUI right now and offers so much more (GUI events, process handling, window creation and management, multi-threading) not to mention the whole library is wrapped in smart pointers ?

Link to comment
Share on other sites
m.yuneeb90 Newbie

m.yuneeb90

Posted
Posted
1 hour ago, SlipperyBrick said:

Out of interest why would you want to use IMGUI with UAK? UAK pretty much does the same thing bar the fact that IMGUI is an immediate-mode GUI library. Personally I think UAK is actually better than IMGUI right now and offers so much more (GUI events, process handling, window creation and management, multi-threading) not to mention the whole library is wrapped in smart pointers

I was thinking about using imgui for things like graph plotting and lines with in the UAK, the main editor would be build using UAK where as imgui only in a few renderable panels for quick out of the box ready widgets freely available online such as implot etc. But I am liking the customizable widgets demo that josh shared, playing with it at the moment. The only thing for me for now lacking in UAK is the ability to draw lines, bezier curves / shapes etc. Once those are in it will be a complete solution for me without any 3rd party library.

  • Like 1
Link to comment
Share on other sites
Josh Grand Master

Josh

Posted
  • Author
Posted
25 minutes ago, Martin Harris said:

I don't know  why, but when I try to open a file from Ultra Engine app, it now opens up Studio 17 and not Studio 19. 

Right-click on the sln file and select the "Open with"... option.

  • Thanks 1

My job is to make tools you love, with the features you want, and performance you can't live without.

Link to comment
Share on other sites
SlipperyBrick Rookie

SlipperyBrick

Posted
Posted
Just now, m.yuneeb90 said:

I was thinking about using imgui for things like graph plotting and lines with in the UAK, the main editor would be build using UAK where as imgui only in a few renderable panels for quick out of the box ready widgets freely available online such as implot etc. But I am liking the customizable widgets demo that josh shared, playing with it at the moment. The only thing for me for now lacking in UAK is the ability to draw lines, bezier curves / shapes etc. Once those are in it will be a complete solution for me without any 3rd party library.

Nice man! I'd be interested in seeing your progress. I agree, shapes would be a welcomed addition (as well as custom fonts). I think UAK would be a complete solution then that would probably overtake IMGUI and other similar GUI libraries

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
Copyright © 2024 Ultra Software.
All rights reserved.
×
×
  • Create New...