By default, the C1ProgressBar control label displays a label with the current percentage of progress. In this topic, you will customize the label 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 Label in Design View

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 LabelFormatString property to 'Maximum Value: {5}'.

   

4. Press F5 to run the project and run your cursor over the C1ProgressBar control. Observe that a label appears with 'Maximum value: 100' as its string.

Formatting the Label in Source View

Complete the following steps:

1. . Click the Source button to enter Source view.
2. Place LabelFormatString = 'Maximum Value: {5}' in the <cc1:C1ProgressBar> tag so that the markup resembles the following:
   <cc1:C1ProgressBar ID="C1ProgressBar1" runat="server" Width="288px" Height="22px" UseEmbeddedVisualStyles="True" VisualStyle="ArcticFox" LabelFormatString="Maximum value: {5}" />
3. Press F5 to run the project and run your cursor over the C1ProgressBar control. Observe that a label appears with 'Maximum value: 100' as its string.

Formatting the Label in Code

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:

   Visual Basic

   Visual Basic	Copy Code
   Imports C1.Web.Wijmo.Controls.C1ProgressBar

   C#

   C#	Copy Code
   using C1.Web.Wijmo.Controls.C1ProgressBar;

3. Customize the label by adding the following code to the Page_Load event:

   Visual Basic

   Visual Basic	Copy Code
   C1ProgressBar1.LabelFormatString = "Maximum value: {5}"

   C#

   C#	Copy Code
   C1ProgressBar1.LabelFormatString = "Maximum value: {5}";

4. Press F5 to run the project and run your cursor over the C1ProgressBar control. Observe that a label appears with 'Maximum value: 100' as its string.

This Topic Illustrates the Following:

In this topic, you created a custom label for the C1ProgressBar control. The following topic illustrates a progress bar with its LabelFormatString property set to 'Maximum Value: {5}'.