Introduction

LCUI.css is a UI component framework for building LCUI application, it provides basic styles for typography and elements, simple layout system, CSS components and utilities. Its CSS code is based Bootstrap, so its usage is basically the same as Boostrap.

Installation

Download the compiled LCUI.css package:

  1. <w type="p">
  2.   <w type="a" class="btn" href="https://github.com/lc-ui/lcui.css/releases">Download LCUI.css</w>
  3. </w>

CSS

Copy the files from the dist directory to your project directory, and configure your project assets include path.

  1. <resource type="text/css" src="assets/stylesheets/lcui.css"/>

C Dependencies

Copy include and lib directory from the dist directory to you project vendor directory, and configure your project compiler settings.

Starter template

main.xml:

  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <lcui-app>
  3.   <resource type="text/css" src="assets/stylesheets/lcui.css"/>
  4.   <ui>
  5.     <w type="h1">Hello, world!</w>
  6.   </ui>
  7. </lcui-app>

main.c:

  1. #include <LCUI_Build.h>
  2. #include <LCUI/LCUI.h>
  3. #include <LCUI/gui/widget.h>
  4. #include <LCUI/gui/builder.h>
  6. int main( int argc, char **argv )
  7. {
  8.         LCUI_Widget root, pack;
  10.         LCUI_Init();
  11.         LCUIEx_Init();
  12.         root = LCUIWidget_GetRoot();
  13.         pack = LCUIBuilder_LoadFile( "main.xml" );
  14.         if( !pack ) {
  15.                 return -1;
  16.         }
  17.         Widget_Append( root, pack );
  18.         Widget_Unwrap( pack );
  19.         return LCUI_Main();
  20. }

That’s all you need for overall app requirements. Visit the Layout docs or our official examples to start laying out your app’s content and components.