At run time, the C1ProgressBar control will display a ToolTip if a user runs his cursor over it. By default, this ToolTip will display the current percentage of progress. In this topic, you will customize the ToolTip so that it displays a modified string along with the maximum value setting of the control. This topic assumes that you have created an ASP.NET AJAX-Enabled Web site containing a ScriptManager control and a C1ProgressBar control.
Formatting the ToolTip in Design View
To format the ToolTip, complete the following steps:
1. Click the Design button to enter Design view.
2. Right-click the C1ProgressBar control to open its context menu and select Properties from the list.
The Properties window opens with the C1ProgressBar control’s properties in focus.
3. Set the ToolTip property to “Maximum Value: {5}”.
4. Press F5 to build the project and run your cursor over the C1ProgressBar control. Observe that a ToolTip appears with “Maximum value: 100” as its string.
Formatting the ToolTip in Source View
To format the ToolTip, complete the following steps:
1. Click the Source button to enter Source view.
2. Place ToolTip = “Maximum Value: {5}” in the <cc1:C1ProgressBar> tag so that the markup resembles the following:
<cc1:C1ProgressBar ID="C1ProgressBar2" runat="server"
Width="288px" Height="22px" UseEmbeddedVisualStyles="True" VisualStyle="ArcticFox" ToolTip="Maximum value: {5}" />
3. Press F5 to run the project and run your cursor over the C1ProgressBar control. Observe that a ToolTip appears with “Maximum value: 100” as its string.
Formatting the ToolTip in Code
To format the ToolTip, complete the following steps:
1. On the Visual Studio toolbar, click View | Code to enter Code view.
2. Import the following namespace into your project:
Imports C1.Web.UI.Controls.C1ProgressBar
• C#
using C1.Web.UI.Controls.C1ProgressBar;
3. Customize the ToolTip by adding the following code to the Page_Load event:
C1ProgressBar1.ToolTip = “Maximum value: {5}”
• C#
C1ProgressBar1.ToolTip = “Maximum value: {5}”;
4. Press F5 to run the project and run your cursor over the C1ProgressBar control. Observe that a ToolTip appears with “Maximum value: 100” as its string.
This Topic Illustrates the Following:
In this topic, you created a custom ToolTip for the C1ProgressBar control. The result of this topic resembles the following:
|
