One of the hidden features of USD is it’s ability to render the XAML as Display text for Tabs & Buttons (There might be some other places, which I haven’t looked yet 😊, Please post on comments if you see any other). The advantage of able to render the XAML is, you can change the whole look and feel of the tool bar buttons. Have you ever come across a requirement where the customer want to show some highlighted button to show the importance of it, for ex : Number of active cases as shown in below image? Or the number of active calls in the Queue? Or the “escalated” cases count?
Yes, the Red coloured Circles are USD Tool bar buttons, No Custom code except for a bit of XAML. And with a bit more XAML and time, you can even change colour dynamically as well. Let’s dig in to how do we achieve this style.
In this example, we will try to create a highlighted tool bar button that shows number of active cases assigned to the user.
Create an Entity Search
First we will create an entity search which tells us the number of active cases assigned to the logged in user.
TIP: You can use advanced find and get the Fetch XML like how we normally do. Just make sure to get only the fields that we need. In this case, all I’m looking for is Counts, so no other fields included.
|Name||My Active Cases Count (Or any other name you like)|
|Fetch XML||<fetch version=”1.0″ output-format=”xml-platform” mapping=”logical” distinct=”false”>
<attribute name=”incidentid” />
<condition attribute=”ownerid” operator=”eq-userid” />
<condition attribute=”statecode” operator=”eq” value=”0″ />
Call the DoSearch to get the Active Cases Count
Create an Action call, Use CRM Global Manager’s DoSearch Action to get the Active cases count.
|Name||Get My Active Case count (Or any other name you like)|
|Hosted Control||CRM Global Manager (Hoping you are following the same name for Global Manger)|
|Data||name=My Active Cases Countglobal=True|
Add the Action call to Desktop Ready event
Associate the Get My Active Case Count action call created in previous step to the DesktopReady event so that, whenever USD loads – it fetches the Active case count. This is how my DesktopReady event looks after adding the action call.
With this we are done with the Entity Searches, Action calls and events to get the Active cases count. Now let’s look in to the actual tool bar button part.
Create a New tool bar button
Open the existing Main Tool bar (or whatever the other tool bar you want), Add a new button with the following information
|Name||Number of Active cases (Or any other name you like)||Any name should work.|
|Button Text||[[$Context.ActiveCaseButtonText]vg+]||This would be the Replacement parameter which holds the XAML. You can directly place your XAML over here as well, but note that there is number of characters limit in this field so you might not be able to place full XAML.*Note the usage “v” in replacement parameter – this helps in replacing replacement parameters inside a replacement parameter.|
|Visible Condition||“[[$Return.Get My Active Case count]g+]” != “0” && “[[$Return.Get My Active Case count]g+]” !=””||Hiding the button if the cases count is – 0.|
This is how my tool bar button now looks in CRM.
Note: You can add further action calls on what should happen when user click this button. There is nothing new in how do you add an action call to a button. Let me know if any details needed on that front via comments.
Create an Action call to set the Button Text
Create a new action call using CRM Global Manager’s CopyToContext with the following information.
|Name||Copy Active Cases count Button XAML to Context||Any name should work|
|Hosted Control||CRM Global Manager||Hoping you are following the same name for Global Manger|
|Action||CopyToContext||Copies the key-value Data parameter in to Context|
|Data||ActiveCaseButtonText=<Border BorderThickness=”1″ Cursor=”Hand” BorderBrush=”Red” CornerRadius=”20″><Border BorderThickness=”2″ Padding=”2 0 2 0″ BorderBrush=”White” Background=”Red” CornerRadius=”20″><TextBlock Text=”[[$Return.Get
My Active Case count]g+]” HorizontalAlignment=”Center” Padding=”3″ Foreground=”White” FontWeight=”Bold” FontSize=”12″/></Border></Border>
|Piece of XAML that I have used to display a Circular button. You can use your own XAML if you want a different style/layout.* Notice the ActiveCaseButtonText, this is the replacement parameter we used as Button Text in previous step.
* Make a note of the Replacement parameter highlighted. This is the action call which tells us the cases count. Make sure you use your action call name created in previous steps.
* Notice how I have changed the Cursor as well to get it a different experience.
** Once after entering the XAML, the text box in CRM won’t display the XAML, but if you mouse hove, you will be able to see the XAML text.
Add the Action call to Desktop Ready event
Add the above action call as well to Desktop ready event so that when USD starts, after getting the cases count, it will populate the Replacement parameter – ActiveCaseButtonText
That’s all it takes. Close and Open USD and you should see some thing like this in USD.
Hope you enjoyed the post, Let me know your thoughts by comments.
Thank you !!
One thought on “Customize USD Toolbar buttons”
First of all, your blogs are really helpful, thanks a ton!
I am using this logic in my USD environment for Notification (Announcement). I have few doubts regarding this, this actions triggered only when you launch USD, I want this logic to be triggered when any new announcement comes-in (Announcement is custom entity used to stored announcements) and update the count when USD is still opened. And can we use icon with count badge instead of just number?
Please do accept my LinkedIn 🙂