Categories

  • Your support helps fund new features, bug fixes, and long-term maintenance

    1 Topics
    1 Posts
    K

    If GUI-O has helped your projects or saved you time, you can optionally support its continued development.

    support_development.png

    Support is completely optional. Using GUI-O does not require any contribution.

    Thank you to everyone who uses, tests, reports issues, or shares feedback - this support already means a lot.

  • GUI-O application translations

    1 Topics
    1 Posts
    K

    Instructions can be found here:
    https://www.gui-o.com/how-to-guides/how-to-translate-gui-o

    Hello GUI-O community!

    There are roughly 700 texts that can be displayed to the user within the GUI-O application.

    Some of them are shown often, while others will probably never be shown at all (maybe in some very specific cases). Nevertheless, all texts deserve equal right to be translated 🙂

    I am looking for translators for various languages. If anyone is interested to help, please send me a private message via Chat. Please specify which language you are interested in to translate. The source language is English.

    The translations that are already finished are (I will update the list as soon as new translation in added):

    English (done) Slovene (in progress) Portuguese (done) German (done) Polish (done) OTHER LANGUAGES...

    Thank you.
    Best regards,
    Kl3m3n

  • GUI-O application through practical examples

    22 Topics
    22 Posts
    K

    This example shows how to create custom push notification on any Internet enabled device (WiFi, Ethernet) and send it to a targeted Android device.

    NOTE: Push notifications are available in GUI-O PRO version only.

    The code from this example can be combined with other GUI-O examples using MQTT, Classic Bluetooth or Low Energy Bluetooth. See https://www.gui-o.com/examples/gui-o-and-boards.

    Software prerequisites:

    Arduino IDE (https://www.arduino.cc/en/software)

    Arduino source code (you can copy the source code from the snippet below, or download it here

    /* * GUI-O Basic Push notification example * * Copyright (C) 2024, GUI-O Team * * SPDX-License-Identifier: BSD-3-Clause */ #include <WiFiClientSecure.h> #include <HTTPClient.h> #include <ArduinoJson.h> static const char* ssid = "<ssid>"; // router name static const char* pass = "<pass>"; // router password static const char* appUuid = "<appUuid>"; // application uuid (retrieve from GUI-O app) static const char* resource = "https://apis.gui-o.com:9501/gui-o/resources/api/sendPushNotification"; // request resource / endpoint static const char* letsencrypt_ca = \ "-----BEGIN CERTIFICATE-----\n" \ "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\n" \ "-----END CERTIFICATE-----\n"; // Connection and requests handling WiFiClientSecure client; HTTPClient http; // Icoming data buffer String in; void setup() { // Debug output Serial.begin(115200); // Connect WiFi (keep trying...) Serial.print("Connecting to "); Serial.println(ssid); // Start WiFi WiFi.begin(ssid, pass); while(WiFi.status() != WL_CONNECTED) { Serial.print("."); delay(500); } // Set root CA client.setCACert(letsencrypt_ca); Serial.println("WiFi connected!"); } void loop() { while(Serial.available()) { const char c = Serial.read(); in += c; if(c == '\n') { // Send push notification sendPushNotification("GUI-O push notification example", in.c_str(), appUuid); // clear buffer in = ""; } } } void sendPushNotification(const char* title, const char* message, const char* appUuid) { DynamicJsonDocument jsonPayload(512); jsonPayload["appUuid"] = String(appUuid); jsonPayload["messageTitle"] = String(title); jsonPayload["messageText"] = String(message); String payload; serializeJson(jsonPayload, payload); if (http.begin(client, resource)) { http.addHeader("Content-Type", "application/json"); const int httpCode = http.POST(payload); if (httpCode == HTTP_CODE_OK) { String response = http.getString(); Serial.print("Response: "); Serial.println(response); } else { Serial.print("Request failed. Status code: "); Serial.println(httpCode); } http.end(); } } GUI-O application (https://play.google.com/store/apps/details?id=com.guio.guioapp)

    Hardware prerequisites:

    Any Internet enabled board (WiFi, Ethernet) that is compatible with Arduino IDE 1. Retrieve application's universally unique identifier (UUID)

    Open GUI-O application, navigate to settings and select "Info"

    Verify that the text "Available" is displayed under "Push notifications" entry

    Make a note of "Application UUID" (you can share the "Application UUID" by tapping on it)

    2. Modify and upload the code

    Open Arduino IDE

    Select "File -> Open"

    Navigate to location where BasicPushNotification.zip archive was extracted (if downloaded)

    Select BasicPushNotification.ino and confirm

    Set your router name and password

    Set your "Application UUID" (retrieved in form the GUI-O app)

    Make sure that your board is connected to your PC

    Ensure that the correct port and baud rate are selected

    Press upload button to start code upload

    3. Send a push notification

    Open any serial terminal and connect to your board (baud rate 115200)

    Enter your push notification message on the serial terminal - the text must be terminated with the \n (new line) character.

    Observe the response on the serial terminal - if successful, message "Push notification sent" will be displayed

    Check the push notification on your Android device

    NOTE: Customize the sound, vibration, LED light, and priority of GUI-O app notifications by navigating to "Android settings -> Apps -> Manage apps".

    If you have any questions or run into any problems, please let me know!

    Best regards,
    kl3m3n

  • Various video tutorials to help you get started with GUI-O

    10 Topics
    10 Posts
  • Share your GUI-O projects with us

    23 Topics
    36 Posts
    K

    @Bernard That is great! 🙂

    I also use AI for various tasks. It is incredibly useful, but in my opinion it is only a tool and should be treated as such.

    Kl3m3n

  • Request new application features

    18 Topics
    86 Posts
    K

    @mile_hi_guy

    Fixed, v0.0.20. Also added the comments to the selection view.
    I made some minor changes and you will need to update your comments.

    Best regards,
    Kl3m3n

  • Examples of GUI-O in action

    4 Topics
    5 Posts
    G

    Here is the new RFID access control screen.
    https://i.imgur.com/8NE7gvC.png

  • Questions that frequently pop up

    15 Topics
    86 Posts
    K

    @mile_hi_guy 👍

  • Announcements regarding our community

    10 Topics
    96 Posts
    K

    Our services will have scheduled outages on Nov 5-8, from 8:00 to 13:00. We apologize for the inconvenience and appreciate your understanding.

  • A place to talk about whatever you want

    39 Topics
    209 Posts
    K

    @Bernard Hi!

    Currently, no, it is not possible.
    I will see if i can make a "toggle visibility" option for the next release.

    Kl3m3n

  • Got a question? Ask away!

    59 Topics
    400 Posts
    S

    Hello @kl3m3n,

    Works very good, Thank You

    Best regards

  • Report GUI-O bugs and anomalies here

    31 Topics
    188 Posts
    K

    @RudiP Hi.

    I am fairly positive that settings are not the cause of this.

    Can you first try changing the keyboard? I assume that your default keyboard is Samsung keyboard. Try changing it to Gboard (should be something like Android settings -> Additional settings -> Language and input).

    Best regards,
    Kl3m3n

  • Blog posts from individual members

    6 Topics
    6 Posts
    japJ

    In the first part, I described the basics: I created a switch on the local GUI-O and described all the necessary settings so that it also works as an IoT - via a remote GUI-O. In the second part, I added the functionality of a thermometer, thermostat, created other graphic elements, set parameters, images, video. In the third part, however, follow the corrections of the mistakes I made. I will also add some important parameters.

    DoloÄŤanje formata ekrana ASR

    As I mentioned in the first part, the weekend management interface was also given to my wife on her phone. At the end of the second part, I wrote down my satisfaction, but when I saw the picture on my wife's phone, it was clear that something else needed to be done: Temperature display UID: lb_tmp went over the edge of the base UID: temp_container. The cause is in different screen formats. The wife has a more modern phone with a more elongated screen. The consequence is obvious. Graphic elements whose size is tied to the vertical dimension are larger in width here. With font size, this is obvious. I had a bit of a pitch in developing it because I was working on an older screen design. In principle, we need to predict what the screen format will be for most users. If you work for the market, I advise you to choose a modern format.

    How It Works

    The GUI-O application follows commands and cannot know if something is going over the edge intentionally or because of a different screen. The GUI-O determines the sizes according to the screen used, if we do not specify the format with the command. Therefore, the image where we develop is always consistent with our settings. The result is, of course, different on different screens. The solution is simple: Before we start developing the GUI, or before setting the W and H parameters to the graphic elements, we need to fix the screen format, otherwise we work on our own format. It is best to choose a commonly used format. Other screens will fill the extra space with a defined background color. This means that on a more elongated screen in terms of height, the GUI-O automatically adds a background color band at the bottom and top so that we get a reference format on the screen. Of course, this also applies to the width deviation - the wider screen gets a band right and left.

    All interfaces must be given information about the reference screen - this is the ratio between the pages: ASR . The data can be read from the technical data of the screen, or it can be obtained from the ANDROID device via the GUI-O interface by turning on the Developer mode: Settings menu → Info → 10x by pressing the Application version. New settings are opened for the developer. Developer mode can then be turned off with this same interface. The ASR of our appliance is also displayed here.
    I immediately added @guis ASR 0.5625\r\n to the initialization - after @cls\r\n:
    Of course, the format must also be specified on remote GUI-O: @guis ASR: 0.5625 PUB: ""\r\n
    My wife’s GUI-O interface got a white edge at the top and bottom. Both pictures: on my phone and my wife’s phone are now the same.

    Screen dimming
    The next problem and solution is completely user-friendly. The wife complained that the local GUI-O was lit at night and therefore could not sleep. Of course I solved the problem. I did a screen dimming. In the second part of the blog, I made different interfaces: on the remote interface, a BT UID: bt1 ... button has been added, with which we can look at the current temperature. The thermometer or uP against the mqtt server does not emit a constant temperature, so that I do not cause data traffic unnecessarily. There is no such BT on the local GUI-O. In the same place on the local GUI-O, I put another |BT UID:bt2 ... to dim the screen. I added to the local GUI-O initialization:

    sendstr2("|BT UID:bt2 X:90 Y:57 W:15 H:8 BGC:#a4d4e2 SBGC:#54b2cd RAD:3 SHE:1 SHHR:1 SHVR:1 SVAL:\"tipkal\" FSZ:10 TXT:\"<b>ZA</b>\"\r\n");

    Dimming is very simple: In response to the newly initialized @ bt2 1\r\n clear the screen and place a new large (full screen) |BT bt3 in the middle, where I specify all black colors.

    else if (!strcmp(argument[0],"@bt2")) {//new button response on the local sendstr2("@cls\r\n");//clear full screen - all GUI elements sendstr2("@guis ASR:0.5625 BGC:#000000\r\n");//reference format sendstr2("|BT UID:bt3 X:50 Y:50 W:110 H:110 FGC:#000000 BGC:#000000 SBGC:#000000 SVAL:\"tipka3\" FSZ:10 TXT:\"\"\r\n"); //full screen black button }

    The response to @bt3 1\r\n is to re-initialize the entire interface, which I do in the same way as after loading SW.

    else if (!strcmp(argument[0],"@bt3")) }//full screen black button response init_request = 1; //an event that triggers reinitialization in processing() in the same way as @init processing(); //analysis otherwise triggered \n\r - at the end of the string }

    The project is complete, HW installed on the cottage. Fixes and new functionalities will be in the following articles.

    Sources:

    https://www.gui-o.com/resources-stm-led.html. https://www.gui-o.com/assets/gui-o_developer_manual.pdf https://htmlcolorcodes.com/color-picker/