Overlapping screens

How-to
1

Description

Hi Team,
when i switch to other screen on button click the second screen overlapping on first screen

What MCU/Processor/Board and compiler are you using?

ARM

What LVGL version are you using?

Version 7

What do you want to achieve?

When i switch the screen i want to show my second screen without overlap with any other screen

What have you tried so far?

i am just calling second screen function in first screen button click event

Code to reproduce

Page 1 Code

/**
 * @file lv_iotgizmo_wifi.c
 *
 */

/*********************
 *      INCLUDES
 *********************/
#include "../../lv_examples.h"
#include "iotgizmo_wifi.h"
#include "wifi_manager.h"
#if LV_USE_IOTGIZMO

/*********************
 *      DEFINES
 *********************/

/**********************
 *      TYPEDEFS
 **********************/

/**********************
 *  STATIC PROTOTYPES
 **********************/
static void ta_event_cb(lv_obj_t * ta, lv_event_t e);
static void event_handler(lv_obj_t * obj, lv_event_t event);
/**********************
 *  STATIC VARIABLES
 **********************/
LV_IMG_DECLARE(logo)
static lv_obj_t * keyboard;
static lv_style_t style_border;
lv_obj_t * ssid;
lv_obj_t * password;
/**********************
 *      MACROS
 **********************/

/**********************
 *   GLOBAL FUNCTIONS
 **********************/

void iotgizmo_wifi(void)
{

    //logo
    lv_obj_t * logo_title = lv_img_create(lv_scr_act(), NULL);
    lv_img_set_src(logo_title, &logo);
    lv_obj_align(logo_title, NULL, LV_ALIGN_IN_TOP_MID, 0, 150);
    lv_obj_add_style(logo_title, LV_OBJ_PART_MAIN, &style_border);
    //label
    lv_obj_t * label_txt;
    label_txt = lv_label_create(lv_scr_act(),NULL);
    lv_label_set_text(label_txt, "Please Enter WIFI Details Here.");
    lv_obj_set_width(label_txt, 150);
    lv_obj_align(label_txt, logo_title, LV_ALIGN_CENTER, 0, 100);
    //textarea_ssid
    ssid= lv_textarea_create(lv_scr_act(), NULL);
    lv_obj_set_size(ssid, 300, 100);
    lv_obj_align(ssid, label_txt, LV_ALIGN_CENTER, 0, 100);
    lv_textarea_set_text(ssid, "");
    lv_textarea_set_one_line(ssid, true);
    lv_textarea_set_cursor_hidden(ssid, true);
    lv_textarea_set_placeholder_text(ssid, "SSID");
   // lv_obj_set_event_cb(ssid, ta_event_cb);
    lv_textarea_set_text_sel(ssid, true);
    //textarea_password
    password= lv_textarea_create(lv_scr_act(), NULL);
    lv_obj_set_size(password, 300, 100);
    lv_obj_align(password, ssid, LV_ALIGN_CENTER, 0, 100);
    lv_textarea_set_text(password, "");
    lv_textarea_set_pwd_mode(password,true);
    lv_textarea_set_one_line(password, true);
    lv_textarea_set_cursor_hidden(password, true);
    lv_textarea_set_placeholder_text(password, "Password");
   // lv_obj_set_event_cb(password, ta_event_cb);
    //button
    lv_obj_t * label;
    lv_obj_t * cnt_btn = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_event_cb(cnt_btn, event_handler);
    lv_obj_align(cnt_btn, NULL, LV_ALIGN_CENTER, 0, 100);
    label = lv_label_create(cnt_btn, NULL);
    lv_label_set_text(label, "Connect");
    //Keyboard
    keyboard = lv_keyboard_create(lv_scr_act(), NULL);
    lv_obj_set_size(keyboard,480,250);
    lv_keyboard_set_textarea(keyboard, ssid);
    lv_keyboard_set_cursor_manage(keyboard, true);
    lv_obj_align(keyboard, NULL, LV_ALIGN_IN_BOTTOM_MID, 0, 0);


}

/**********************
 *   STATIC FUNCTIONS
 **********************/

static void event_handler(lv_obj_t * obj, lv_event_t event)
{
    if(event == LV_EVENT_CLICKED) {
        printf("### Passing values\n");
        char ssid_val[64];
        char passwd_val[64];
        sprintf(ssid_val,"%s",lv_textarea_get_text(ssid));
        sprintf(passwd_val,"%s", lv_textarea_get_text(password));
        connect_wifi(ssid_val,passwd_val);


    }
}
static void ta_event_cb(lv_obj_t * ta, lv_event_t event)
{
    if(event == LV_EVENT_CLICKED) {
        /* Focus on the clicked text area */
        if(keyboard != NULL)
            lv_keyboard_set_textarea(keyboard, ta);
    }

    else if(event == LV_EVENT_INSERT) {
        const char * str = lv_event_get_data();
        if(str[0] == '\n') {
            printf("Ready\n");
        }
    }
}
#endif

Page 2 Code

/**
 * @file lv_iotgizmo_login.c
 *
 */

/*********************
 *      INCLUDES
 *********************/
#include "../../lv_examples.h"
#include "iotgizmo_login.h"
#include "iotgizmo_menu.h"

#if LV_USE_IOTGIZMO

/*********************
 *      DEFINES
 *********************/

/**********************
 *      TYPEDEFS
 **********************/

/**********************
 *  STATIC PROTOTYPES
 **********************/
static void ta_event_cb(lv_obj_t * ta, lv_event_t e);
static void event_handler(lv_obj_t * obj, lv_event_t event);
/**********************
 *  STATIC VARIABLES
 **********************/
LV_IMG_DECLARE(logo)
static lv_obj_t * keyboard;

/**********************
 *      MACROS
 **********************/

/**********************
 *   GLOBAL FUNCTIONS
 **********************/

void iotgizmo_login(void)
{
    //logo
    lv_obj_t * logo_title = lv_img_create(lv_scr_act(), NULL);
    lv_img_set_src(logo_title, &logo);
    lv_obj_align(logo_title, NULL, LV_ALIGN_IN_TOP_MID, 0, 150);
    //label
    lv_obj_t * label_txt;
    label_txt = lv_label_create(lv_scr_act(),NULL);
    lv_label_set_text(label_txt, "Hello, Please Login Here.");
    lv_obj_set_width(label_txt, 150);
    lv_obj_align(label_txt, logo_title, LV_ALIGN_CENTER, 0, 100);
    //textarea
    lv_obj_t * email= lv_textarea_create(lv_scr_act(), NULL);
    lv_obj_set_size(email, 300, 100);
    lv_obj_align(email, label_txt, LV_ALIGN_CENTER, 0, 100);
    lv_textarea_set_text(email, "");
    lv_textarea_set_one_line(email, true);
    lv_textarea_set_cursor_hidden(email, true);
    lv_textarea_set_placeholder_text(email, "Email");
   // lv_obj_set_event_cb(email, ta_event_cb);
    lv_textarea_set_text_sel(email, true);

    lv_obj_t * password= lv_textarea_create(lv_scr_act(), NULL);
    lv_obj_set_size(password, 300, 100);
    lv_obj_align(password, email, LV_ALIGN_CENTER, 0, 100);
    lv_textarea_set_text(password, "");
    lv_textarea_set_one_line(password, true);
    lv_textarea_set_cursor_hidden(password, true);
    lv_textarea_set_placeholder_text(password, "Password");
   // lv_obj_set_event_cb(password, ta_event_cb);
    //button
    lv_obj_t * label;
    lv_obj_t * lgn_btn = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_event_cb(lgn_btn, event_handler);
    lv_obj_align(lgn_btn, NULL, LV_ALIGN_CENTER, 0, 100);
    label = lv_label_create(lgn_btn, NULL);
    lv_label_set_text(label, "Login");
    //Keyboard
    keyboard = lv_keyboard_create(lv_scr_act(), NULL);
    lv_obj_set_size(keyboard,480,250);
    lv_keyboard_set_textarea(keyboard, email);
    lv_keyboard_set_cursor_manage(keyboard, true);
    lv_obj_align(keyboard, NULL, LV_ALIGN_IN_BOTTOM_MID, 0, 0);


}

/**********************
 *   STATIC FUNCTIONS
 **********************/

static void event_handler(lv_obj_t * obj, lv_event_t event)
{
    if(event == LV_EVENT_CLICKED) {
        printf("### iotGizmo Menu\n");
        iotgizmo_menu();
    }
}

static void ta_event_cb(lv_obj_t * ta, lv_event_t event)
{
    if(event == LV_EVENT_CLICKED) {
        /* Focus on the clicked text area */
        if(keyboard != NULL)
            lv_keyboard_set_textarea(keyboard, ta);
    }

    else if(event == LV_EVENT_INSERT) {
        const char * str = lv_event_get_data();
        if(str[0] == '\n') {
            printf("Ready\n");
        }
    }
}



#endif

Please help with this.
Thanks in Advance.

2

There’s a lot of code here, so it’s hard for me to understand the flow, but I think your problem here is that you are just creating new objects on the same screen. You need to hide the other widgets, delete the other widgets, create a background for each menu, or use a different screen (i.e. lv_scr_load).

3

i added background for each screen.Now the scree is not overlapping
but when redirected to new screen some widgets are missing in new screen

4

Are you reusing some widgets from the first screen? If so you probably need to move them to the top using lv_obj_move_foreground.