QlikView documentation and resources.
Appropriate use of color in an application can not only improve its appeal but help in its adoption and understanding. QlikView provides the flexibility to define colors for many elements but in doing so it can be tricky to keep track of what colors have been used, and a lengthy process to change the palette if a new scheme is required.
Imagine how great it would be to change the palette by simply loading your palette and selecting the required theme from a list box? By defining the colors by labels and defining the values in the load you wont have to look up previously used RGB settings or change every object when you want to change the scheme. This is a really simple method which can be extended once you’re used to it.
This is how it’s done
That’s it! It takes less time than you think (certainly no more than typing in RGB values). And once established you can enjoy seeing your apps in a new light at the flick of a selection.
Extending this to multiple palettes
Once established you can have a number of palettes loaded and use Set Analysis or setup Alternate States (my preferred method) to help you pick colors from the required scheme
$(=$(=only({<_ThemeName={'BlueTheme'}>}_Dark)))
$(=$(=only({BlueTheme}_Dark)))
Color…Fast
Having a range of palettes available without having to redefine them can dramatically improve your productivity as there is no need to constantly lookup required colors.
You can set different themes for intensity, such as Dark, Medium, Light so that the same colors can be referenced with differing saturation. This is useful when you want to keep colors consistent across dimensions but use the higher intensity for fine point charts or thin bars where they would be difficult to see otherwise, medium intensity for bars or to highlight values, and light when the data is supportive but color still has meaning.
You can use them to quickly pick out the correct colors for the ColorMix wizard, perhaps to setup TeamA ColorMixed from Dark to Light in the {BlueTheme} but use {RedTheme} for TeamB.
It becomes a simple matter of picking your palette and the reference, rather than searching for the RGB value.
This is awesome! I've been waiting for something like this to come along.
Everything I have seen and done was piecemeal typing RGB values everywhere and not leveraging the ETL as much as this.
Thanks!
Fantastic!!!
Wonderful post !
Great post!
Hi Steve
This is awesome, many thanks for sharing with the community.
Great post Steve. Always on the lookout for good colour pallets! Bookmarked and will be using these in the future.
Richard
Steve, I went to the two web sites you referenced but I don't see how to use them to create complete color palettes like the examples you posted. Can you post a quick explanation please?
Hi Brian,
These websites (and there are numerous others) allow you to create color palettes. In http://tools.medialab.sciences-po.fr/iwanthue/ you can select the number of colours to create, alter the colour range, and hit 'Make a palette' and it will generate the required scheme, detailing the colors and various different code references below. (Note that this website doesn't work in IE for me - I use Chrome). Use the 'RGB list for CSS' and copy paste these values into the spreadsheet. Define the scheme name as the column header, the labels and the RGB values and use this file to load into QlikView.
http://www.colorbrewer2.org/ works in a similar way but you will need to select RGB from the dropdown and contain the values listed in rgb() when you include them in the spreadsheet.
I hope this helps ...
Excellent! Thanks
Thanks Steve. I've tried a few different methods but have settled on your method. I am adding a modified blue theme that we are using for our primary Sales app. I encourage others to upload color themes that they have set up for their apps.
Theme Name | Blue |
%Background | rgb(255,255,255) |
%BorderColor | rgb(125,202,235) |
%ButtonColor | rgb(125,202,235) |
%ButtonColorActive | rgb(15,157,217) |
%ButtonTextColor | rgb(0,0,0) |
%ButtonTextColorActive | rgb(0,0,0) |
%CaptionColor | ARGB(0,0,0,0) |
%CaptionColorActive | ARGB(0,0,0,0) |
%CaptionTextColor | rbg(15,157,217) |
%CaptionTextColorActive | rbg(15,157,217) |
%HelpBackground | rgb(140,198,64) |
%HelpBorder | rgb(0,0,0) |
%HelpText | rgb(0,0,0) |
%Highlight | ARGB(255,196,214,0) |
%ScrollBackground | rgb(224,224,224) |
%ScrollButton | rgb(199,199,199) |
%TextBox | rbg(15,157,217) |
%TextBoxBackground | ARGB(0,0,0,0) |
%Transparent | ARGB(0,0,0,0) |
%UtilityBackground | rgb(195,224,210) |
%Black | rgb(0,0,0) |
%White | rgb(255,255,255) |
%Red | rgb(255,0,0) |
%Blue | rgb(0,0,255) |
%Green | rgb(0,255,0) |
%VLightGray | ARGB(255,202,203,204) |
%LightGray | ARGB(255,159,161,164) |
%MediumGray | ARGB(255,126,128,131) |
%DarkGray | ARGB(255,95,96,98) |
%Color1 | rgb(8,64,129) |
%Color2 | rgb(8,104,172) |
%Color3 | rgb(43,140,190) |
%Color4 | rgb(78,179,211) |
%Color5 | rgb(123,204,196) |
%Color6 | rgb(168,221,181) |
%Color7 | rgb(204,235,197) |
%Color8 | rgb(224,243,219) |
%Color9 | rgb(247,252,240) |
%Color10 | rgb(8,64,129) |
%Color11 | rgb(8,104,172) |
%Color12 | rgb(43,140,190) |
%Color13 | rgb(78,179,211) |
%Color14 | rgb(123,204,196) |
%Color15 | rgb(168,221,181) |
%Color16 | rgb(204,235,197) |
%Color17 | rgb(224,243,219) |
%Color18 | rgb(247,252,240) |
%Others | ARGB(255,126,128,131) |
%Total | rgb(0,0,0) |