This page has 0 threads | Add post

Blogs

Finding our blogs useful? Please consider helping us to share more!

The new button slicer visual in Power BI Desktop Part two of a three-part series of blogs
Microsoft have introduced a new button slicer visual in the November 2023 Power BI Desktop update, which adds additional functionality and formatting features to the old tile slicer. The new button slicer visual in Power BI Desktop Formatting the new button slicer (this blog) Adding images and text to the new button slicer

The new button slicer visual in Power BI Desktop

Part two of a three-part series of blogs

Microsoft have introduced a new button slicer visual in the November 2023 Power BI Desktop update, which adds additional functionality and formatting features to the old tile slicer.

The new button slicer visual in Power BI Desktop
Formatting the new button slicer (this blog)
Adding images and text to the new button slicer

Posted by Rick Gould on 01 December 2023

In this blog

Selection options
Button shapes
Layout options
Formatting the buttons
Accents

Formatting the new button slicer visual

As with the new card visual, Microsoft continue to offer a wider range of formatting features for users to modify in the new button slicer.

Power BI Desktop button slicer formatting pane

At first glance formatting looks straightforward, but as ever, the devil is in the detail.

Selection options

You can configure selection with three different options:

Single select is turned on by default and you can now force the slicer to have an option selected at all times.

There is no longer an option for multi-select as with the old tile slicer.

If you want to select multiple options, simply turn off the single select setting:

Power BI desktop new button slicer multiple select

You can now select as many buttons as you want in your slicer...

Here's what that would look like:

Power BI Desktop button visual with multi select

This slicer has three options selected.

Button shapes

You can choose three different types of border:

Power BI Desktop button slicer shape formatting

These options are the same as those for the new card visual.

If you choose snipped tabs, you can control how much you want to snip by at the top and bottom:

Power BI Desktop button visual snipped tabs

See below for an example of these choices...

Here's what snipped tabs look like:

Power BI Desktop button visual snipped tabs top and bottom

These have been snipped by 25% at the top and bottom.

With both the snipped tab and rounded corner settings you can customise the percentage of snip (or rounding) on a corner by corner basis:

Power BI Desktop button visual customised formatting

Switch on Customize style to set individual values for each corner.

Here's an example of individual snipped corners:

Poower BI Desktop button visual individual corners

At the time of writing this blog the top right corner snip only worked if the top left corner was also snipped. When using the rounded rectangle option, this property worked as you'd expect it to.

This isn't the only formatting option that needs to be fixed!

Layout options

You can control how many columns and how many rows of buttons you want to display here:

The vertical alignment property affects the text in the image below...

Here's what the layout settings look like:

Power BI Desktop button slicer button layout

These buttons have been arranged into two columns with three rows in each.

If your buttons overflow your slicer visual due to its size, you have two options for controlling the overflow:

Choose whether you want to scroll to your remaining buttons or display them on a separate page in the visual.

You can also choose whether the option to scroll or move to the next page of buttons is horizontal or vertical:

Power BI Desktop button slicer overflow direction

See below for how these choices affect the slicer.

Here's what a button slicer with horizontal paginated overflow looks like:

Power BI Desktop button slicer paginated horizontal

You click on the chevrons to navigate to other pages of buttons.

Formatting the buttons

Having set the layout and shape of your buttons, you can now set the border, fill colour, shadow, and glow settings for them - or for separate states that they might be found in:

Power BI Desktop button slicer buttons formatting

A general principle of the new button slicer: you can apply formatting to different states the button is under.

Here I've set the Border, Fill, Shadow and Glow settings for my buttons under the default state:

Power BI Desktop button slicer button properties

These can all be changed to give a different appearance when the button is hovered over, pressed or selected.

You can make it very clear that you are about to interact with a button:

The PG button is set to have a blue fill colour when the user hovers over it.

Accents

You can set something called an accent bar to make each button stand out more:

Power BI Desktop button slicer accent bar

This accent bar is set to appear black, 10 pixels wide and on the left. It's also been set to work when the button is pressed.

Here is what it looks like:

Power BI Desktop button slicer accent bar pressed

The thick vertical bar to the left on the U button is the accent.

Many of these properties can be dynamic. You could set the fill colour of the buttons to be an expression based on a field or measure in your dataset.

Parts of this blog
The new button slicer visual in Power BI Desktop Formatting the new button slicer (this blog) Adding images and text to the new button slicer

Some other pages relevant to the above blogs include:

This blog has 0 threads

Add a new post

BLOGS BY TOPIC

BLOGS BY AUTHOR

Formatting the new button slicer visual

Selection options

Button shapes

Layout options

Formatting the buttons

Accents

Head office

London

Manchester