Vizlib Community

Submit a ticket Sign in
Welcome
Login

Vizlib Filter - Listbox Settings and Styling

Listbox Settings


If the Listbox is chosen as the filter type, there are several of interesting options you can choose from before you proceed with the detailed styling options:



  • Enable/ Disable Selection Bar
  • Responsive mode
  • Smart pop-up positioning
  • Custom styling
  • Left/ Right Tick position

Selection Bar 

The selection bar is a very thin bar which indicates the number of selected vs available or excluded values in the field. It's very useful if you wish to get a feeling of how many values the dimension has, and see it respond to your selections.




Responsive mode 

Naturally, Listboxes are very long objects, but instead of always having a vertical scrollbar, you might want to make the filter responsive to the user's screen size. This means, that once the object is very small, it automatically transforms into a dropdown. In such a case, all dropdown settings are inherited. 



Popup Position

Popup position can be set on Auto mode or on Top/ Bottom by Custom.




Style 


Here you can change the styling of your listbox values with options such as None, LED, Tick and Checkbox.

Left or Right Position can be set for any Style.




Tick Position


Set left or right position for Ticks.







Listbox Styling


While the Listbox styling is mostly defined by its cell values, you still have the possibility to add a border to make your filter look a little bit more like a card.



Property Settings: 

Vizlib Filter
Resulting Listbox with Border: 


Vizlib Filter


Cell Styling


This section permits you to style individual cells of a Listbox.

 It's full of different customization possibilities which categorise 

themselves into the following sections:

  • Size Settings (Height)
  • Font Styling
  • Row Border
  • Text Alignment
  • Coloring Type (Qlik vs Custom)


Header


The header always sits on top of the Listbox which offers rich customization options

Most relevant are:

  • Show/Hide the Header
  • Custom Header Title (supports expression)
  • Font Properties
  • Actions
  • Send to Excel icon on header bar
  • Clear Field icon on header bar



M
Martin is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.