Qlik Sense / Qlik Analytics Platform Articles, Projects & Tutorials by Stefan Walther

Using Leonardo-UI

Bring the typical Look & Feel of Qlik Sense into your widgets.
Star

Exercise

  • Create a new widget and call it “Leonardo-UI”
  • Use the “Insert” dialog to add code snippets using Leonardo-UI

Bonus exercise

  • Make e.g. a ButtonGroup dynamic by combining Leonardo-UI and AngularJS

Solution

This is how your widget could look like:

A possible result can be seen in “Result: Leonardo-UI” as part of the widget library “widget-exercises”.

Suggest edits
In this tutorial
General
Table of Contents
Basic Introduction
The widget concept
Widget personas
Widgets vs. Visualization extensions
Styling widgets: Recommendations
Responsive widgets
Actions
Debugging widgets
What makes a widget a good citizen?
Getting Started
The widget editor
Widget organization WIP
Components
Component: sys-info
Tutorial
Prerequisites
The basic concept
Basic data-binding
Custom properties
Working with data WIP
Leonardo UI
AngularJS binding
Actions WIP
Minimalistic KPI tile
Bonus: Containers
Bonus: Advanced KPI tile WIP
Recipes
Table with dynamic label
Show/Hide
FAQ
Widget organization
What's the difference between qWidget & Widget?
On this page
Exercise
Bonus exercise
Solution