Dashboard Number Widget

Last published at: May 2nd, 2023

This sample will illustrate how to write a new dashboard number widget, how to configure it using the Configuration Manager, add the widget in a dashboard designer and then have the widget displaying in the dashboard.

Start Microsoft Visual Studio 2015 and select “New Project”. Select “C#” as the language and select “Class Library” as the project type. This example is going to use C# as the development language. This same example can be also written using Visual Basic .Net.

For the name of the project, provide “TestCustomWidget”.

Once the project is created, select “Class1.cs” and rename the class to “clsNumberofTestUsers.cs”

Right click References under TestCustomWidget Project. Click Add Reference…

Reference manager window will open. Click browse button.

Add a reference to FlowWright, navigate to the following directory “C:\inetpub\wwwroot\cDevWorkflow\bin”. Select the file “cDevDecisionEngine.dll”.

Add a using statement : cDevWorkflow.cDevDecisoinEngine

Let’s start building the class, first implement the interface called: “deNumberWidget”. In order to implement the interface, we have to implement the “getData” method. The getData method is going to return clsNumberWidgetReturn object. clsNumberWidgetReturn constructor takes 4 parameters. First parameter requires image path which will assign the image to this number widget. Second parameter requires the number which will show the number in the widget. Third parameter requires the text which will be the title for this widget. Fourth parameter is optional, which assigns an URL to the link in the widget.

Add the widgetData attribute above the “clsNumberofTestUsers” class. The attribute accepts four parameters. The first parameter will be the widget name. Second parameter accepts the widget description. Third parameter will be the widget category. Fourth parameter is the widget display name.

Using widgetData attribute, we could automatically configure the widget in the configuration manager.

Navigate to the directory where the DLL was compiled to and select the DLL: “TestCustomWidget.dll”. Right click on the file and select “Copy” from the context menu.

Copy the widget dll to the following directory: “C:\inetpub\wwwroot\cDevWorkflow\bin”.

Start the FlowWright Configuration Manager > Manage Dashboards and select the “widgets” tab.

Select “UtilsAuto Detect” to auto configure the new number dashboard widget.

Select the widget, and select “ManageConfigure” menu item.

Now that the widget is fully configured, let us add the new widget in a dashboard. Go to Manage Dashboards. Create a new dashboard called “TestCustomWidgetDashboard”. Enter the new dashboard name, select the layout and click the “Create” button to create the dashboard.