Step 2 of 3: Customizing the Control

In the previous step you set up the application's user interface and added a C1ProgressBar control to your application. In this step you will customize the control and add a check box.

1.   With the C1ProgressBar control selected on the page, select View | Properties.

2.   In the Properties window, locate the Margin property and enter "3" in the text box next to the property name.

3.   Next to the Height property, enter "200" and next to the Width property enter "450". Your XAML markup should now look like this:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <my:C1ProgressBar HorizontalAlignment="Left" Margin="3" Name="C1ProgressBar1" VerticalAlignment="Top" Height="200" Width="450" />

</Grid>

4.   In Source View edit the markup to add a check box to the application. The markup will now look like the following:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <my:C1ProgressBar HorizontalAlignment="Left" Margin="3" Name="C1ProgressBar1" VerticalAlignment="Top" Height="200" Width="450" />

<CheckBox Content="Show C1ProgressBar1" IsChecked="{Binding IsIndeterminate, ElementName=C1ProgressBar1, Mode=TwoWay}"/>

</Grid>

You have successfully customized the C1ProgressBar control. In the next step, you will observe the final application.


Send us comments about this topic.
Copyright © GrapeCity, inc. All rights reserved.