How to: Create a BulletDecorator
This example shows how the Bullet of a BulletDecorator control aligns with different types of Child objects. This example also shows different types of Bullet objects.
The following example shows how to define a BulletDecorator control that uses an image as the Bullet and a text object as the Child. When a text object contains multiple lines of text, as it does in this example, the Bullet object lines up with the first line of text.
<BulletDecorator Grid.Row="1" Grid.Column="0" Margin="0,5,0,0" VerticalAlignment="Center" Background="Yellow"> <BulletDecorator.Bullet> <Image Source="images\apple.jpg"/> </BulletDecorator.Bullet> <TextBlock Width="100" TextWrapping="Wrap" HorizontalAlignment="Left" Foreground ="Purple"> A Simple BulletDecorator </TextBlock> </BulletDecorator>
The following example shows how to define a BulletDecorator control that uses an image as the Bullet and a text object that has a specified font size as the Child. Because the Bullet is smaller than the letters that are specified by the font size, the Bullet object centers itself next to the text.
<BulletDecorator Margin="0,5,0,10" Grid.Column="0" Grid.Row="2" VerticalAlignment="Center"> <BulletDecorator.Bullet> <Image Source="images\apple.jpg"/> </BulletDecorator.Bullet> <TextBlock Name="FontSizeExample" FontSize="12" Foreground="Green">FontSize = 12 </TextBlock> </BulletDecorator>
The following example shows how to define a BulletDecorator control that uses an image as the Bullet and a non-text element as the Child. In this example, the Bullet object centers itself next to the non-text element.
<BulletDecorator Grid.Row="3" Grid.Column="0" Margin="0,5,0,0"> <BulletDecorator.Bullet> <Image Source="images\apple.jpg"/> </BulletDecorator.Bullet> <Ellipse Height="75" Width="50" Fill="Purple" HorizontalAlignment="Left" ></Ellipse> </BulletDecorator>
The following example shows three kinds of Bullet options for a BulletDecorator control.
<BulletDecorator Margin="0,5,0,0">
<BulletDecorator.Bullet>
<CheckBox/>
</BulletDecorator.Bullet>
<TextBlock
Width="100"
TextWrapping="Wrap"
HorizontalAlignment="Left"
Foreground = "Blue"
Margin="5,0,0,0">
A BulletDecorator with a CheckBox Bullet.
</TextBlock>
</BulletDecorator>
<BulletDecorator Margin="0,5,0,0">
<BulletDecorator.Bullet>
<TextBox Width="30"/>
</BulletDecorator.Bullet>
<TextBlock
Width="100"
TextWrapping="Wrap"
HorizontalAlignment="Left"
Foreground ="Blue"
Margin="5,0,0,0">
A BulletDecorator with a TextBox Bullet.
</TextBlock>
</BulletDecorator>
<BulletDecorator Margin="0,5,0,0">
<BulletDecorator.Bullet>
<RadioButton/>
</BulletDecorator.Bullet>
<TextBlock
Width="100"
TextWrapping="Wrap"
HorizontalAlignment="Left"
Foreground ="Blue"
Margin="5,0,0,0">
A BulletDecorator with a RadioButton Bullet
</TextBlock>
</BulletDecorator>