Getting Started Overview

The following tutorial demonstrates how you can add a simple RadProgressBar control with a preset value displayed in percent. The end result will be similar to Figure 1:

Figure 1: A RadProgressBar with a predefined percentage value.

1. Add a ScriptManager control on a Web Form.

2. Add a RadProgressBar control on this AJAX-enabled Web Form:

   Example 1: Declaration of a RadProgressBar control.

   ASP.NET

   <telerik:RadProgressBar RenderMode="Lightweight" runat="server" ID="RadProgressBar1">
   </telerik:RadProgressBar>
   

3. Set some of the properties of the ProgressBar like BarType, Value, MaxValue and Orientation to configure the progress bar in the desired way.

   Example 2: The progress bar now is horizontally oriented, configured with the desired value in percent.

   ASP.NET

   <telerik:RadProgressBar RenderMode="Lightweight" runat="server" ID="RadProgressBar1" 
       BarType="Percent" MaxValue="100" Value="33" Width="250" 
       Orientation="Horizontal" ShowLabel="true" Skin="Silk">
   </telerik:RadProgressBar>
   

See Also

• RadProgressBar Elements Structure

• Types

• RadProgressBar Server-Side Programming