Text object – Small but mighty

Many QlikView developers do not know, how huge possibilities are behind seemingly simple Text Object. It of course can just display text, but personally I often give it totally different job, much more interesting job 🙂 Let’s see what it can do!

 Table of contents:

1. Showing Text
2. Showing Images
3. Text Object’s true power – Actions
   1.  Text Object as a button – creating custom menu
   2. Adding URLs to the document
   3. Custom interface elements
   4. KPI indicator
4. Utilizing image transparency – custom Gauge

 

[wpfmb type=’info’ theme=1]I have combined all usages inside a small app, which is attached to this blog post (on the bottom of the page)[/wpfmb]

1. Showing Text

Let’s start with what we get out of the box:

 

Not that fancy… When created text object is just a square with blueish background. But with just few tweaks, we can turn it into something which is nice and clean:

 

Which properties were used here?

• First of all color transparency (General tab) was set to 100%
• Font changed to Calibri, Bold, 12
• 1 pt Soft Solid Border, with color fitting UI was added
• Corner Radius set to 5pt

2. Showing Images

We are of course just warming up. Presenting images is second common usage of Text Object. I remember how surprised I was when I first learnt about that 🙂

How to do it? Simply choose image you want to add and set it as Text Object’s background:

 

It is worth mentioning that you can also Bundle Load images to your QlikView document. You can then use them in multiple ways, one of the being in Text Object. In properties change its representation to “Image”, and as Text enter path to loaded image. Example:

This will show this image in the document:

[wpfmb type=’info’ theme=1]If you want to know details about how images can be loaded & used in QlikView document, please let me know! I may create a blog post dedicated to this topic.[/wpfmb]

 

3. Text Object’s true power – Actions

We discussed basics, time for something more interesting. With help of Actions we can really spread our wings.

– Text Object as a button – creating custom menu.

I am not a big fan of QlikView tabs. I often turn them off completely and create my own custom navigation for documents. And guess which objects I use for that 🙂 Let’s start with and example. This is how such menu can look like:

• It consists of 6 Text Boxes.
• Actions are used to set navigation variables
• Currently selected item is marked with a blue background.
• First and last Text Object have Corner Radius defined.

 

How exactly does it work? I will explain using first element as an example:

I have created variables:

• vSelectedMenuOption – this is set via Action, when Text Object is clicked (variable value corresponds to number of menu item)
• vSelectedMenuOptionBackground – color (set using RGB function) for active (clicked) Text Box – blue
• vColorQlikpadGreen – default color (set using RGB function) – green
• Calculated Background color is used & below formula “tells” QV which color to use (if menu item is active, set blue color as background, otherwise show green color)

IF(vSelectedMenuOption = 1,  vSelectedMenuOptionBackground,  vColorQlikpadGreen) 

• Then for all objects I want to show on a first “page”, Show property (Layout -> Show -> Conditional) is set to vSelectedMenuOption = 1

[wpfmb type=’info’ theme=1]Note: In business documents I often use ActivateSheet Action instead of variables. This allows to switch between Sheets, even though default navigation is turned off.[/wpfmb]

– Adding URLs to the document.

“Open URL” Action can be used to add hyperlink, which will be triggered when Text Box is pressed:

URL Link:

• QlikPad.com has “Open URL” action defined as: https://qlikpad.com

Email Link:

• Envelope has “Open URL” action defined as: mailto:kuba@qlikpad.com

– Custom Interface Elements

Below example is very simple, but using only Text Object is is possible to create interactive, website-like, infographic styled Dashboards!

– KPI indicator.

When developing dashboards I often use Text Object to show KPIs:

KPI indicators are cool, but business always wants to see what does this number represent. Who exactly are those 14 Female developers? This is why all my KPI indicators have an action defined. In this example it is simply calling previously saved Bookmark. When clicked variable is set and proper data table returned:

[wpfmb type=’info’ theme=1]Note: In business documents I create Chart (Straight Table), with set of (condition enabled) dimensions & expressions, which is much more flexible than Table Box[/wpfmb]

 

How does it work? I will explain below:

• KPI indicator is a styled,  Caption enabled Text Box, with an expression entered as its Text. Expression is resolved to show a number.
• Both KPI indicator, on click set value of variable vSelectedMenuOption to 6 (which automatically sets menu to option “Report”
• Each Indicator has a second Action set: “Apply bookmark”
  • First bookmark was saved with Gender set to F (Female), second one with Gender set to M (Male)
  • This allows to open proper data table

4. Utilizing image transparency – custom Gauge

I find this trick pretty cool myself – I like my dashboards to be unique and knowing a way to create my own (dynamic!) indicators makes me happy. Using this method you can create custom gauge which can look like that:

I will not go into details, just underline few points:

[wpfmb type=’info’ theme=1]Again – If you want me to write a separate blog post dedicated to custom gauge, please let me know! I may create a blog post dedicated to this topic.[/wpfmb]

• We make us of a fact that QlikView can properly view transparent images.
• What you can see as a woman-shaped gauge is basically a transparent image on top of a chart (Chart’s background is set to black)
  • We make use of Custom Layer Level for each object, to properly put them on top of each other.
• On top of that we also have a small Text Object, which in addition shows numeric representation of gauge (basically telling how much of the image is filled)
• You are limited only by your imagination, and can use almost any shape. I create my own in one of open source vector graphics software.

Just to make everything clear, here are 3 objects, which put together create above gauge:

 

 

 

And that’s it! I hope you liked this article and leant something new from it! You can find qvw file below!

Please share your questions / opinions / additional ideas in comment section below!