The code view shows the LVGL source code generated from the current project, so you can read the exact implementation before integrating it. This guide explains the concept, how to use the view, and what to watch out for.

Overview

anyui-LIVE converts the design into C source code in {root}/generated of the workspace; see Codegen. The code view is the in-editor window onto that output: you inspect screen sources, asset sources, and headers without leaving the editor or downloading the project.

It is meant for:

  • Reviewing what the design compiles down to before committing it to firmware.
  • Finding the declaration of a screen, widget, or generated variable when wiring application logic.
  • Confirming that resource conversion produced the expected assets.

The generated output itself - file layout, configuration options, and the setup_ui() integration point - is defined in Codegen.

Usage

  1. In the view bar of the toolbar, select Code. Selecting it triggers a build of the LVGL source code first, so the view appears after the build completes.
  2. Browse the generated sources. The contents mirror {root}/generated: screen source files, asset sources, and header files.
  3. Use Export in the document bar when you need the whole bundle: it regenerates the source bundle and exports it, for example as a ZIP download.
  4. Copy the generated/ files into your project build and call setup_ui() - see Transplant.

Attention points

  • Opening the view always builds first; expect a delay on large projects, and wait for the build instead of switching views repeatedly.
  • The view mirrors generated output, which is produced automatically and must not be edited by hand: change the design and rebuild instead. See Codegen.
  • The code depends on the active LVGL runtime (and language) version, such as LVGL 9.x versus 8.x; switching the Runtime version changes the generated code. See Dynamic LVGL version.
  • Output follows project configuration (resolution, color depth); after changing it in Settings, open the view again to see the regenerated code.
  • Preview runs the same generated code, so anything you notice in the code view is also what the device will run.
  • Toolbar - the view bar and the export command.
  • Codegen - what is generated and where.
  • Preview - running the same generated code live.
  • Transplant - integrating generated code into a target project.
  • Simulator - running generated code on a local machine.
  • Resource - the assets converted into the generated sources.