Keyboard and Textarea

How-to
1

Description

I am newbie in LVGL and I trying to do an project which has 3 screen. First screen is homepage second one is menu(This is not important for now) and the last one is settings. I defined keyboard and a textarea inside settings screen. When I write something on keyboad I want textarea on both homepage and settings to show it and save what I write. The code that I write it works at the first time but then when I go back to settings from homepage I see “Text area” on text area and I see random variables on text area inside homepage. I want the string that I write on keyboard to be saved inside the variable named str. Then str is shown on homepage and be default value of textarea that inside settings.

Note: I am using stm32f4 discovery, vs code and platform IO.

#include <stdio.h>
#if LV_USE_BTN
//#if LV_USE_CB
#if LV_USE_TEXTAREA && LV_USE_KEYBOARD

static uint8_t x = 10;
static uint8_t y = 10;
bool t = false;
lv_obj_t * kb;
lv_obj_t * ta1;
const char * str= "s";

static void ta_event_cb(lv_obj_t * ta, lv_event_t event);

//Artırma azaltma fonksiyonlari
void x_artirma(lv_obj_t *btn, lv_event_t event){
    if (event == LV_EVENT_CLICKED)
        x++;
    sttings(NULL,NULL);
}

void x_azaltma(lv_obj_t *btn, lv_event_t event){
    if (event == LV_EVENT_CLICKED)
        x--;
    sttings(NULL,NULL);
}

void y_artirma(lv_obj_t *btn, lv_event_t event){
    if (event == LV_EVENT_CLICKED)
        y++;
    sttings(NULL,NULL);
    
}

void y_azaltma(lv_obj_t *btn, lv_event_t event){
    if (event == LV_EVENT_CLICKED)
        y--;
    sttings(NULL,NULL);
   
}

static void cbx_fonksiyonu(lv_obj_t * obj, lv_event_t event)
{
    if (event == LV_EVENT_VALUE_CHANGED){
       if(t==true){
           t=false;
       }
       else if(t==false){
           t=true;
       }
    }
    sttings(NULL,NULL);
}


void Anasayfaya_don(lv_obj_t *btn, lv_event_t event){
    
    if(event == LV_EVENT_CLICKED) {
        lv_obj_del(lv_scr_act());
        hpage();
    }

}


static void Menuye_git(lv_obj_t *btn, lv_event_t event){
    if(event == LV_EVENT_CLICKED) {
        lv_obj_del(lv_scr_act());
        lv_obj_t *scr2 = lv_obj_create(NULL, NULL);
        lv_scr_load(scr2);
        lv_obj_t * label1 =  lv_label_create(scr2, NULL);
        lv_label_set_text(label1, "MENU"); //label ismi
        lv_obj_align(label1, NULL, LV_ALIGN_CENTER, 0, -140); //label konumu


        lv_obj_t * menu_buton = lv_btn_create(scr2, NULL);
        lv_obj_set_event_cb(menu_buton, Anasayfaya_don); //fonksiyon çağırma
        lv_obj_align(menu_buton, NULL, LV_ALIGN_CENTER, 0, 30);
        lv_obj_set_size(menu_buton, 120, 50);
        lv_obj_t * label = lv_label_create(menu_buton, NULL);
        lv_label_set_text(label, "Geri");
    }


}

void sttings(lv_obj_t *btn, lv_event_t event){
    if(event == LV_EVENT_RELEASED) {
        lv_obj_del(lv_scr_act());
        lv_obj_t *scr3 = lv_obj_create(NULL, NULL);
        lv_scr_load(scr3);
        lv_obj_t * label1 =  lv_label_create(scr3, NULL);
        lv_label_set_text(label1, "AYARLAR"); //label ismi
        lv_obj_align(label1, NULL, LV_ALIGN_CENTER, 0, -140); //label konumu

        //X
        lv_obj_t * xl =  lv_label_create(scr3, NULL);
        lv_label_set_text_fmt(xl, "X: %d", x); //label ismi
        lv_obj_align(xl, NULL, LV_ALIGN_CENTER, 0, -100); //label konumu
        
        //artı butonu
        lv_obj_t * btn_arti_x = lv_btn_create(scr3, NULL);
        lv_obj_set_event_cb(btn_arti_x, x_artirma); //fonksiyon çağırma
        lv_obj_align(btn_arti_x, NULL, LV_ALIGN_CENTER, 130, -100); //konum ayarlama
        lv_obj_set_size(btn_arti_x, 40, 40); //buton boyutu
        lv_obj_t * label3 = lv_label_create(btn_arti_x, NULL);
        lv_label_set_text(label3, "+");
        //eksi butonu
        lv_obj_t * btn_eksi_x = lv_btn_create(scr3, NULL);
        lv_obj_set_event_cb(btn_eksi_x, x_azaltma); //fonksiyon çağırma
        lv_obj_align(btn_eksi_x, NULL, LV_ALIGN_CENTER, 80, -100); //konum ayarlama
        lv_obj_set_size(btn_eksi_x, 40, 40); //buton boyutu
        lv_obj_t * label4 = lv_label_create(btn_eksi_x, NULL);
        lv_label_set_text(label4, "-");

        //Y
        lv_obj_t * yl =  lv_label_create(scr3, NULL);
        lv_label_set_text_fmt(yl, "Y: %d", y); //label ismi
        lv_obj_align(yl, NULL, LV_ALIGN_CENTER, 0, -60); //label konumu

        //artı butonu
        lv_obj_t * btn_arti_y = lv_btn_create(scr3, NULL);
        lv_obj_set_event_cb(btn_arti_y, y_artirma); //fonksiyon çağırma
        lv_obj_align(btn_arti_y, NULL, LV_ALIGN_CENTER, 130, -60); //konum ayarlama
        lv_obj_set_size(btn_arti_y, 40, 40); //buton boyutu
        lv_obj_t * label5 = lv_label_create(btn_arti_y, NULL);
        lv_label_set_text(label5, "+");
        //eksi butonu
        lv_obj_t * btn_eksi_y = lv_btn_create(scr3, NULL);
        lv_obj_set_event_cb(btn_eksi_y, y_azaltma); //fonksiyon çağırma
        lv_obj_align(btn_eksi_y, NULL, LV_ALIGN_CENTER, 80, -60); //konum ayarlama
        lv_obj_set_size(btn_eksi_y, 40, 40); //buton boyutu
        lv_obj_t * label6 = lv_label_create(btn_eksi_y, NULL);
        lv_label_set_text(label6, "-");

        
        //Checkbox
        lv_obj_t * cb1 = lv_checkbox_create(scr3, NULL);
        lv_checkbox_set_checked(cb1, t);
        lv_obj_align(cb1, NULL, LV_ALIGN_CENTER, -40, -60); //checkbox konumu
        lv_checkbox_set_text(cb1, " "); //checkbox yazısı
        lv_obj_set_event_cb(cb1, cbx_fonksiyonu); //checkbox callback
        lv_obj_t * cbl = lv_label_create(scr3, NULL);
        // lv_label_set_text(cbl, "T: "); //label ismi
        // lv_obj_align(cbl, NULL, LV_ALIGN_CENTER, -40, -55); //label konumu

        
        //Text
        lv_obj_t *ta1 = lv_textarea_create(scr3, NULL); //text yaratma
        lv_obj_set_size(ta1, 100, 30); //boyut ayarlama
        lv_obj_align(ta1, NULL, LV_ALIGN_CENTER, 0, -10); //konum ayarlama
        lv_obj_set_event_cb(ta1, ta_event_cb);

        //klavye
        kb = lv_keyboard_create(scr3, NULL);
        lv_keyboard_set_textarea(kb, ta1);
        lv_keyboard_set_cursor_manage(kb, true);

        //geri butonu
        lv_obj_t * ayarlar_buton = lv_btn_create(scr3, NULL);
        lv_obj_set_event_cb(ayarlar_buton, Anasayfaya_don); //fonksiyon çağırma
        lv_obj_align(ayarlar_buton, NULL, LV_ALIGN_CENTER, -40, -100); //konum
        lv_obj_set_size(ayarlar_buton, 50, 40);//buton boyutu
        //lv_checkbox_set_checked(cb, t);
        lv_obj_t * label = lv_label_create(ayarlar_buton, NULL);
        lv_label_set_text(label, "Geri");
    }


}

void hpage(){
    lv_obj_t *scr1 = lv_obj_create(NULL, NULL);
    lv_scr_load(scr1);
    lv_obj_t * label1 =  lv_label_create(scr1, NULL);
    lv_label_set_text(label1, "ANASAYFA"); //label ismi
    lv_obj_align(label1, NULL, LV_ALIGN_CENTER, 0, -140); //label konumu

    
    //X
    lv_obj_t * xl =  lv_label_create(scr1, NULL);
    lv_label_set_text_fmt(xl, "X: %d", x); //label ismi
    lv_obj_align(xl, NULL, LV_ALIGN_CENTER, 0, -120); //label konumu
    //Y
    lv_obj_t * yl =  lv_label_create(scr1, NULL);
    lv_label_set_text_fmt(yl, "Y: %d", y); //label ismi
    lv_obj_align(yl, NULL, LV_ALIGN_CENTER, 0, -100); //label konumu
    //T
    lv_obj_t * tl =  lv_label_create(scr1, NULL);
    lv_label_set_text_fmt(tl, "T: %d", t); //label ismi
    lv_obj_align(tl, NULL, LV_ALIGN_CENTER, 0, -80); //label konumu
    
    //Text
    lv_obj_t * tex =  lv_label_create(scr1, NULL);
    lv_label_set_text_fmt(tex, "Z: %s ", str); //label ismi
    lv_obj_align(tex, NULL, LV_ALIGN_CENTER, 0, -60); //label konumu
    // lv_obj_t * mtnl =  lv_label_create(scr1, NULL);
    // lv_obj_align(mtnl, NULL, LV_ALIGN_CENTER, 20, -60);
    
    
    //Menü butonu
    lv_obj_t * btn1 = lv_btn_create(scr1, NULL);
    lv_obj_set_event_cb(btn1, Menuye_git); //fonksiyon çağırma
    lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, 30);
    lv_obj_set_size(btn1, 120, 50);
    lv_obj_t * label2 = lv_label_create(btn1, NULL);
    lv_label_set_text(label2, "Menu");

    //Ayarlar butonu
    lv_obj_t * btn2 = lv_btn_create(scr1, NULL);
    lv_obj_set_event_cb(btn2, sttings); //fonksiyon çağırma
    lv_obj_align(btn2, NULL, LV_ALIGN_CENTER, 0, 100); //konum ayarlama
    lv_obj_set_size(btn2, 120, 50); //buton boyutu
    lv_obj_t * label3 = lv_label_create(btn2, NULL);
    lv_label_set_text(label3, "Ayarlar");


}



static void ta_event_cb(lv_obj_t * ta, lv_event_t event)

{
    if( event == LV_EVENT_VALUE_CHANGED)
        str = lv_textarea_get_text(ta);
        
    
    sttings(NULL, NULL);

}



#endif
#endif
//#endif
2

Hi @trustablecoder,

I am really busy at the moment so this is just a couple of pointers that hopefully will get you on the right track.

You need to make your objects static/global, currently you are creating new objects each time you navigate between screens. I would think about how you want to structure the program.

Firstly I would create the objects with static/global variables and set all their parameters in some kind of initialisation function just the once and then show/hide/update them based on the events.

I hope that makes sense.

Kind Regards,

Pete