New to Telerik UI for WinForms? Download free 30-day trial

Customize Step Item

The RadStepProgreesBar and its StepProgressItem expose various properties which can be used to further customize their visual appearance. In this article we are going to list them.

RadStepProgressBar

The following properties will be applied to all steps inside the control. In a case, where you want to customize specific steps and their connection, please refer to the next section of this article.

IndicatorSize

Using this property, you can change the size of the indicator shapes. The default size is 30,30. In the following image this property is set to 60,60.

stepprogressbar-layout 001

StepSpacing

Using this property, you can change the space between the steps. The default value is 80. In the following image this property is set to 150.

stepprogressbar-layout 001

ConnectionThickness

Using this property, you can change the connection thickness of the steps. The default value is 3. In the following image this property is set to 8.

stepprogressbar-layout 001

HideConnections

Using this property, you can hide the connection of the steps. In the following image this property is set to true.

stepprogressbar-layout 001

Using this property, you can control the scroll step of the navigation buttons. This property will take affect when the LayoutMode property of the RadStepProgreesBar is set to Absolute. The default value is 80. In the following example this property is set to 20 which will slowdown the scrolling process.

stepprogressbar-layout 001

StepProgressItem

The following properties will be applied to the corresponding step. The other steps won't be affected.

IndicatorSize

Using this property, you can change the size of the step progress item. The default size is 30,30. Setting the property of the step item itself will not affect the size of the other steps. If this property is used, the property will unbind from the RadStepProgressBar IndicatorSize property. To bind it again, you can call the ResetIndicatorSize() method of the item.

stepprogressbar-layout 001

ConnectionLength

Using this property, you can control the connection lenght. The default value is 80. Setting the property of the step item itself will not affect the length of the other connections. If this property is used, the property will unbind from the RadStepProgressBar StepSpacing property. To bind it again, you can call the ResetConnectionLength() method of the item.

stepprogressbar-layout 001

ConnectionThickness

Using this property, you can control the connection thickness. The default value is 3. Setting the property of the step item itself will not affect the thickness of the other connections. If this property is used, the property will unbind from the RadStepProgressBar ConnectionThickness property. To bind it again, you can call the ResetConnectionThickness() method of the item.

stepprogressbar-layout 001

See Also

In this article