Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / desktop / Win32

Introducing an Open Source DirectUI Library - SOUI

4.75/5 (12 votes)
17 Nov 2015MIT4 min read 48K   654  
SOUI is a directui library and had been used in many commercial softwares, which is published based on MIT and is completely free to any user.

Introduction

SOUI is a directui library and had been used in many commercial softwares, which is published based on MIT and is completely free to any user. SOUI is a lightweight direct UI framework, and provides many wonderful features to help the user have a good experience in making a beautiful UI application on Windows.

Download demo (EXE), source code see "Using the Code" section.

Background

There are quite a few UI libraries used on Windows platform, such as MFC, WTL, QT, Juce, WPF and DuiLib, etc. MFC, WTL are wrappers of traditional controls based on their application framework. Because each control has a native HWND, in general, it's difficult to build a "beautiful" UI with them. QT and Juce are designed to use cross platforms which make them relatively diffcult to use and the final EXE file will depend on some larger DLLs. Furthermore, they seem to lack layout capability based on XML which are widely used in e.g. Android, IOS. (My opinion, if you don't agree with me, just ignore it). WPF is designed to make beautiful UI easily. However, it depends on .NET and WPF codes are not compiled to native code. Thus, it seems unsuitable for many small applications. DuiLib is a directui library and is widely used in companies in China. But Duilib is based on an older framework and many bugs have to be fixed while developing your apps.

SOUI is designed to resolve problems mentioned above.

Using the Code

Code of SOUI is managed by both SVN and GIT. You can fetch code from github https://github.com/soui2/soui.git.

 

After fetching SOUI code, you will get a folder that looks like:

Image 1

If you are using VS 2008, you can simply open soui.08.sln and run complile. After all components are compiled successfully, selecting a project under demos as the startup project and run it. Here, we recommend you to see "demo" at first.

In that step, note that you may encounter two problems:

  1. You may have found an error in building sosmily module. This is because you start your VS without administrator role. SoSmily module is a COM module and will automatically register after building finish. So, you should know why.
  2. When you are trying to run "demo" using skia render, which is the default option at the beginning of the app, you may get an assert dialog that looks like:

    Image 2

The problem is caused by the lack of render-skia.dll module. render-skia module is set to be ignored duing building. You need to build it manually.

Finally, you should see the following snapshot:

Image 3

Note that if you are using VS 2008+, you can run build.bat to generate a new soui.sln for your VS environment.

If you are interested in SOUI and try to use it to make your own application, let's go on.

We recommend you run the SOUI VS wizard installer at first (look for it under the wizard folder). After installing the wizard for your VS, you should find that the SOUI Application Wizard looks like:

Image 4

As the language used in soui wizard is Chinese, if you don't understand it, just click "finish" is OK.

SOUI wizard will prepare an application framework for you to use SOUI.

Switch the VS workspace to "Solution Explorer" and Check "Show All Files", you will see the file structure looks like:

Image 5

You will find all resources used in the application are located in the uires folder and uires.idx is the index file for all other file resources. For more details, please look into the relevant XML file.

Open the "SouiWizard.cpp" and look through "WinMain" function, I'm sure you can understand how the framework will run.

Points of Interest

The UI framework borrows ideas including COM, WTL, QT, CEGUI, Android, etc.

Image decoder, render, language translator, script module were abstracted to virtual interface. Thus, you can decide how to config your application modules.

There are some snapshots:

A multiply columns list view control, based on MVC model and can contain as many as int limits lines.

Image 6

A simple game, all logical codes were written in LUA script.

Image 7

Show how to use IAnimation in SOUI.

Image 8

Show "LayeredWindow" in SOUI.

Image 9

A property control:

Image 10

In summary, SOUI is a lightweight DirectUI framework and has been polished for more than 3 years. It is proved to be easily expendable. We believe SOUI would greatly release you from UI work.

History

  • 2015.10.12 First submission

License

This article, along with any associated source code and files, is licensed under The MIT License