How to display multi-language on the screen with LVGL using Gui Guider?

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

How to display multi-language on the screen with LVGL using Gui Guider?

Jump to solution
4,098 Views
ChesterLee
Contributor II

Now I'm going to develop a product with displaying multi-language (such as Chinese, English, Russian, etc.) on the LCD screen using LVGL. I wonder if there is a way to set widgets' texts with parameters? Like define a series of parameters about language and use them set text content:

/* --------------------------- Code example --------------------------- */

typedef struct {

    char *itemChinese,

    char *itemEnglish,

} param_language_t;

param_language_t param_language = {

    .itemChinese = "你好",

    .itemEnglish = "Hello",

};

lv_label_set_text_fmt(ui->screen_main_label_hello, "%s", param_language.itemEnglish);

/* --------------------------- Code example --------------------------- */

Or just using a middleware named lv_i18n, which also needs using parameters to set widgets text.

Tags (2)
0 Kudos
Reply
1 Solution
4,065 Views
Celeste_Liu
NXP Employee
NXP Employee

Hello @ChesterLee ,

Thanks for your post. According to GUI Guider v1.8.1 User Guide, currently the GUI Guider IDE only supports two language: English and Chinese. However, this can be achieved by developing custom code. The following is an example.

Celeste_Liu_0-1731562555570.png

For the detailed description of this example, you can refer to the section of "7.10 How to develop a multi - language application".

Celeste_Liu_1-1731563390966.png

Hope it helps.

Best Regards,

Celeste

View solution in original post

0 Kudos
Reply
3 Replies
4,066 Views
Celeste_Liu
NXP Employee
NXP Employee

Hello @ChesterLee ,

Thanks for your post. According to GUI Guider v1.8.1 User Guide, currently the GUI Guider IDE only supports two language: English and Chinese. However, this can be achieved by developing custom code. The following is an example.

Celeste_Liu_0-1731562555570.png

For the detailed description of this example, you can refer to the section of "7.10 How to develop a multi - language application".

Celeste_Liu_1-1731563390966.png

Hope it helps.

Best Regards,

Celeste

0 Kudos
Reply
4,061 Views
ChesterLee
Contributor II

Hi @Celeste_Liu ,

Tks for your kindly reply. I wish Gui Guider could support more languages in the future. Anyway, tks a lot!

Best Regard

Chester

0 Kudos
Reply
4,042 Views
Celeste_Liu
NXP Employee
NXP Employee

Hello @ChesterLee ,

I'm glad to help you. I will feed back your suggestion. Any new issues, welcome to create a new thread.

BRs,

Celeste

0 Kudos
Reply
%3CLINGO-SUB%20id%3D%22lingo-sub-1994093%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3EHow%20to%20display%20multi-language%20on%20the%20screen%20with%20LVGL%20using%20Gui%20Guider%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1994093%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3E%3CP%3ENow%20I'm%20going%20to%20develop%20a%20product%20with%20displaying%20multi-language%20(such%20as%20Chinese%2C%20English%2C%20Russian%2C%20etc.)%20on%20the%20LCD%20screen%20using%20LVGL.%20%3CEM%3E%3CSTRONG%3E%3CFONT%20color%3D%22%23FF0000%22%3EI%20wonder%20if%20there%20is%20a%20way%20to%20set%20widgets'%20texts%20with%20parameters%3F%3C%2FFONT%3E%3C%2FSTRONG%3E%3C%2FEM%3E%20Like%20define%20a%20series%20of%20parameters%20about%20language%20and%20use%20them%20set%20text%20content%3A%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%2F*%20---------------------------%20Code%20example%20---------------------------%20*%2F%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3Etypedef%20struct%20%7B%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%26nbsp%3B%20%26nbsp%3B%20char%20*itemChinese%2C%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%26nbsp%3B%20%26nbsp%3B%20char%20*itemEnglish%2C%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%7D%20param_language_t%3B%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3Eparam_language_t%20param_language%20%3D%20%7B%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%26nbsp%3B%20%26nbsp%3B%20.itemChinese%20%3D%20%22%E4%BD%A0%E5%A5%BD%22%2C%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%26nbsp%3B%20%26nbsp%3B%20.itemEnglish%20%3D%20%22Hello%22%2C%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%7D%3B%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3Elv_label_set_text_fmt(ui-%26gt%3Bscreen_main_label_hello%2C%20%22%25s%22%2C%20param_language.itemEnglish)%3B%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3E%3CFONT%20face%3D%22comic%20sans%20ms%2Csans-serif%22%3E%3CEM%3E%2F*%20---------------------------%20Code%20example%20---------------------------%20*%2F%3C%2FEM%3E%3C%2FFONT%3E%3C%2FP%3E%3CP%3EOr%20just%20using%20a%20middleware%20named%20lv_i18n%2C%20which%20also%20needs%20using%20parameters%20to%20set%20widgets%20text.%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1994323%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3ERe%3A%20How%20to%20display%20multi-language%20on%20the%20screen%20with%20LVGL%20using%20Gui%20Guider%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1994323%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3E%3CP%3EHello%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fcommunity.nxp.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F243024%22%20target%3D%22_blank%22%3E%40ChesterLee%3C%2FA%3E%26nbsp%3B%2C%3C%2FP%3E%0A%3CP%3EI'm%20glad%20to%20help%20you.%20I%20will%20feed%20back%20your%20suggestion.%20Any%20new%20issues%2C%20welcome%20to%20create%20a%20new%20thread.%3C%2FP%3E%0A%3CP%3EBRs%2C%3C%2FP%3E%0A%3CP%3ECeleste%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1994307%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3ERe%3A%20How%20to%20display%20multi-language%20on%20the%20screen%20with%20LVGL%20using%20Gui%20Guider%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1994307%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3E%3CP%3EHi%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fcommunity.nxp.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F237877%22%20target%3D%22_blank%22%3E%40Celeste_Liu%3C%2FA%3E%26nbsp%3B%2C%3C%2FP%3E%3CP%3ETks%20for%20your%20kindly%20reply.%20I%20wish%20Gui%20Guider%20could%20support%20more%20languages%20in%20the%20future.%20Anyway%2C%20tks%20a%20lot!%3C%2FP%3E%3CP%3EBest%20Regard%3C%2FP%3E%3CP%3EChester%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1994302%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3ERe%3A%20How%20to%20display%20multi-language%20on%20the%20screen%20with%20LVGL%20using%20Gui%20Guider%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1994302%22%20slang%3D%22en-US%22%20mode%3D%22CREATE%22%3E%3CP%3EHello%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fcommunity.nxp.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F243024%22%20target%3D%22_blank%22%3E%40ChesterLee%3C%2FA%3E%26nbsp%3B%2C%3C%2FP%3E%0A%3CP%3EThanks%20for%20your%20post.%26nbsp%3BAccording%20to%20%3CA%20href%3D%22https%3A%2F%2Fwww.nxp.com%2Fwebapp%2Fsps%2Fdownload%2FpreDownload.jsp%3Frender%3Dtrue%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3EGUI%20Guider%20v1.8.1%20User%20Guide%3C%2FA%3E%2C%20currently%20the%20GUI%20Guider%20IDE%20only%20supports%20two%20language%3A%20English%20and%20Chinese.%26nbsp%3BHowever%2C%20this%20can%20be%20achieved%20by%20developing%20custom%20code.%20The%20following%20is%20an%20example.%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22Celeste_Liu_0-1731562555570.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3Cspan%20class%3D%22lia-inline-image-display-wrapper%22%20image-alt%3D%22Celeste_Liu_0-1731562555570.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3Cimg%20src%3D%22https%3A%2F%2Fcommunity.nxp.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F310445i53A7FD1A19E970CF%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22Celeste_Liu_0-1731562555570.png%22%20alt%3D%22Celeste_Liu_0-1731562555570.png%22%20%2F%3E%3C%2Fspan%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3EFor%20the%20detailed%20description%20of%20this%20example%2C%20you%20can%20refer%20to%20the%20section%20of%20%227.10%20How%20to%20develop%20a%20multi%20-%20language%20application%22.%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22Celeste_Liu_1-1731563390966.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3Cspan%20class%3D%22lia-inline-image-display-wrapper%22%20image-alt%3D%22Celeste_Liu_1-1731563390966.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3Cimg%20src%3D%22https%3A%2F%2Fcommunity.nxp.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F310456i5E3FAB9796964667%2Fimage-size%2Fmedium%3Fv%3Dv2%26amp%3Bpx%3D400%22%20role%3D%22button%22%20title%3D%22Celeste_Liu_1-1731563390966.png%22%20alt%3D%22Celeste_Liu_1-1731563390966.png%22%20%2F%3E%3C%2Fspan%3E%3C%2FSPAN%3E%3C%2FP%3E%0A%3CP%3EHope%20it%20helps.%3C%2FP%3E%0A%3CP%3EBest%20Regards%2C%3C%2FP%3E%0A%3CP%3ECeleste%3C%2FP%3E%3C%2FLINGO-BODY%3E