I’ve set up GitHub Codespace for LVGL. With this you can create, test, develop, build UIs with LVGL in an online VSCode editor. The result UI will be shown in VSCode too as a HTML file. All these are free for 30 hours per month (with the default 4 CPU core server)
All this takes only 4 click and 2 minutes assuming that you are already at the lvgl repo
First of all, thank you for your great effort. I stumbled accross your project when making the first steps for LVGL. I successfully could follow all your steps to setup the environment.
Now, wenn I try to run the project, I get this error The path to the compiler for one or more source files was not found in the CMake cache. If you are using a toolchain file, this probably means that you need to specify the CACHE option when you set your C and/or C++ compiler path
and in the output I notice
[cmake] – Warning: Did not find file Compiler/-ASM
Hi there!
Being not very expert.
When runnig build_all.sh
I get these erros:
/workspace/lvgl_app $ ‘/workspace/lvgl_app/build_all.sh’
configure: cmake … -DCMAKE_TOOLCHAIN_FILE=/usr/local/emsdk/upstream/emscripten/cmake/Modules/Platform/Emscripten.cmake -DCMAKE_CROSSCOMPILING_EMULATOR=/usr/local/emsdk/node/18.20.3_64bit/bin/node
– The ASM compiler identification is unknown
– Found assembler: /usr/local/emsdk/upstream/emscripten/emcc
– Warning: Did not find file Compiler/-ASM
– Configuring done
– Generating done
– Build files have been written to: /workspace/lvgl_app/build
make: make -j4
Scanning dependencies of target lvgl
[ 0%] Building C object lvgl/CMakeFiles/lvgl.dir/src/core/lv_obj.c.o
[ 0%] Building C object lvgl/CMakeFiles/lvgl.dir/src/core/lv_group.c.o
[ 0%] Building C object lvgl/CMakeFiles/lvgl.dir/src/core/lv_obj_draw.c.o
[ 0%] Building C object lvgl/CMakeFiles/lvgl.dir/src/core/lv_obj_class.c.o
ports:INFO: retrieving port: sdl2 from https://github.com/libsdl-org/SDL/archive/release-2.28.4.zip
ports:INFO: unpacking port: sdl2
cache:INFO: generating port: sysroot/lib/wasm32-emscripten/libSDL2.a… (this will be cached in “/usr/local/emsdk/upstream/emscripten/cache/sysroot/lib/wasm32-emscripten/libSDL2.a” for subsequent builds)
system_libs:INFO: compiled 117 inputs in 12.17s
cache:INFO: - ok
/workspace/lvgl_app/lvgl/src/core/lv_obj.c:384:5: error: call to undeclared function ‘lv_obj_assign_id’; ISO C99 and later do not support implicit function declarations [-Wimplicit-function-declaration]
384 | lv_obj_assign_id(class_p, obj);
| ^
/workspace/lvgl_app/lvgl/src/core/lv_obj.c:384:5: note: did you mean ‘lv_obj_align_to’?
/workspace/lvgl_app/lvgl/src/core/lv_obj_pos.h:190:6: note: ‘lv_obj_align_to’ declared here
190 | void lv_obj_align_to(lv_obj_t * obj, const lv_obj_t * base, lv_align_t align, int32_t x_ofs,
| ^
/workspace/lvgl_app/lvgl/src/core/lv_obj.c:421:5: error: call to undeclared function ‘lv_obj_free_id’; ISO C99 and later do not support implicit function declarations [-Wimplicit-function-declaration]
421 | lv_obj_free_id(obj);
| ^
/workspace/lvgl_app/lvgl/src/core/lv_obj.c:421:5: note: did you mean ‘lv_obj_fade_in’?
/workspace/lvgl_app/lvgl/src/core/lv_obj_style.h:218:6: note: ‘lv_obj_fade_in’ declared here
218 | void lv_obj_fade_in(lv_obj_t * obj, uint32_t time, uint32_t delay);
| ^
2 errors generated.
make[2]: *** [lvgl/CMakeFiles/lvgl.dir/build.make:78: lvgl/CMakeFiles/lvgl.dir/src/core/lv_obj.c.o] Error 1
make[2]: *** Waiting for unfinished jobs…
make[1]: *** [CMakeFiles/Makefile2:212: lvgl/CMakeFiles/lvgl.dir/all] Error 2
make: *** [Makefile:130: all] Error 2
emmake: error: ‘make -j4’ failed (returned 2)
Like japi_vgl I am not very expert, in fact I have no knowledge at all of how to use Codespace.
I have worked through your four clicks, including build_all.sh
As far as I can tell this all works OK with no errors.
The Terminal Prompt is “@Ken - 1010”, so I guess this is the moniker assigned to me.
A tab opens in the editing pane showing the display that I think is generated by file:
lv_demo_widgets.c
( Profile Tab shows Elena Smith )
So far so good, but where do I go from here?
I’d like to try to run some of the many demos and examples that I can see in the explorer pane, and try some edits myself to see how the display changes.
Can you give a short description of how to go about this?, or point me to some instructions – hopefully fairly short and simple.
Hi again,
Your instruction is very straightforward, but I now seem to have a new problem.
I open file main.c, with its original call to lv_demo_widgets();
Build: Build finished with exit code 0 (I assume this mean no errors)
Run:
To run, I click on the small triangle icon at bottom, which says
“Launch the selected target in terminal window: [index]”
when I hover mouse on it.
I’m not sure if that is correct, because it fails to run. In the Terminal panel I get:
“Setting environment variables”, followed by PATH= and then a large block of text which
looks quite normal to me. But it finishes with: @Ken-1010 ➜ /workspace/lvgl_app/build $ /workspace/lvgl_app/build/index.html
bash: /workspace/lvgl_app/build/index.html: Permission denied @Ken-1010 ➜ /workspace/lvgl_app/build $
I tried editing main.c to replace lv_demo_widgets(); with lv_demo_keypad_encoder();
It is same as above; Build is OK, but it has same “Permission denied” when I Run.
I did not have this problem when I first launched lvgl in CodeSpaces, so I don’t know what has gone wrong.
Deleted my codespace “account”, and started from scratch.
LVGL compiles and runs as before.
I now realise that the command “./build_all.sh” launches the simulation – it is in effect the “Run” button. That is where I was stuck.
In file main.c I replaced “lv_demo_widgets()” with “lv_demo_keypad_encoder()”, and it runs correctly – big step forward!
I have tried a few of the demos, some work OK, eg “lv_demo_stress()”, but some do not work, eg “lv_demo_vector_graphic()”.
I am not too bothered about that, but what I want is to be able to run the examples, such as:
examples/widgets/button/lv_example_button_1.c
I’d like to be able to run the file, do some edits, and run again to see effect of my edits.
I cannot figure out how to do this. Just putting “lv_example_button_1()” in the main.c file does not work.
upon running the shell file i got this: [ 27%] Building C object lvgl/CMakeFiles/lvgl.dir/src/libs/fsdrv/lv_fs_win32.c.o
/workspace/lvgl_app/lvgl/src/libs/fsdrv/lv_fs_memfs.c:51:6: error: “LV_FS_MEMFS_LETTER must be set to a valid value”
51 | #error “LV_FS_MEMFS_LETTER must be set to a valid value”
| ^
1 error generated.
make[2]: *** [lvgl/CMakeFiles/lvgl.dir/build.make:2622: lvgl/CMakeFiles/lvgl.dir/src/libs/fsdrv/lv_fs_memfs.c.o] Error 1
make[2]: *** Waiting for unfinished jobs…
make[1]: *** [CMakeFiles/Makefile2:212: lvgl/CMakeFiles/lvgl.dir/all] Error 2
make: *** [Makefile:130: all] Error 2
emmake: error: ‘make -j4’ failed (returned 2)
[ 28%] Building C object lvgl/CMakeFiles/lvgl.dir/src/libs/gif/gifdec.c.o
/workspace/lvgl_app/lvgl/src/libs/fsdrv/lv_fs_memfs.c:51:6: error: "LV_FS_MEMFS_LETTER must be set to a valid value"
51 | #error "LV_FS_MEMFS_LETTER must be set to a valid value"
| ^
1 error generated.
make[2]: *** [lvgl/CMakeFiles/lvgl.dir/build.make:2832: lvgl/CMakeFiles/lvgl.dir/src/libs/fsdrv/lv_fs_memfs.c.o] Error 1
make[2]: *** Waiting for unfinished jobs....
make[1]: *** [CMakeFiles/Makefile2:212: lvgl/CMakeFiles/lvgl.dir/all] Error 2
make: *** [Makefile:130: all] Error 2
emmake: error: 'make -j4' failed (returned 2)
The PC simulator is maybe not so well maintained, so no mention there. It’s also possible that the PC simulator doesn’t support any input (from either mouse or keyboard) so it’s in a different quality class.
This method (using Github Codespace) supports intput right, or is it also missing all input methods?
) You can also just type 
