Layout example

This example shows how to dynamically create a contact list using the Kanzi Engine API. The layout and prefabs that set the structure of the contact items are defined in the Kanzi Studio project. The project uses the Kanzi Engine API to instantiate the prefabs. Build and run the example application using Visual Studio.

You can find the example in the <KanziWorkspace>/Examples/Layout.

In the Kanzi Studio project:

  • gridLayout node arranges the contact items.

    ../../_images/layout-gridlayout.png
  • contactCard prefab defines the structure for each contact item.

    ../../_images/layout-contactcard.png

Running the example

To run the example:

  1. Open the command line in the <KanziWorkspace>/Examples/Layout/Application directory and run

    generate_cmake_vs2017_solution.bat
    

    This script generates a Visual Studio solution for the application in the directory <KanziWorkspace>/Examples/Layout/Application/build_vs2017.

    Tip

    You can open the project directory from Kanzi Studio by selecting File > Open in Windows Explorer.

    ../../_images/open-in-windows-explorer.png
  2. In Visual Studio open the <KanziWorkspace>/Examples/Layout/Application/build_vs2017/Layout.sln Visual Studio solution.

  3. In Visual Studio in the Solution Explorer right-click the Layout project and select Set as StartUp Project.

  4. Select the solution configuration that you want to use and run your application.

    During development select the Debug configuration. When you are ready to create a version for production, select the Release configuration.

    ../../_images/debug-configuration.png