Share via


HOW TO:建立 BulletDecorator

更新:2007 年 11 月

本範例說明 BulletDecorator 控制項的 Bullet 如何與不同型別的 Child 物件對齊。這個範例也會顯示不同型別的 Bullet 物件。

範例

下列範例顯示如何定義 BulletDecorator 控制項,這個控制項使用影像做為 Bullet,並使用文字物件做為 Child。當文字物件包含多行文字 (如本範例所示) 時,Bullet 物件會與第一行文字對齊。

Dim myBulletDecorator = New BulletDecorator()
Dim myImage = New Image()
Dim myBitmapImage = New BitmapImage()
myBitmapImage.BeginInit()
myBitmapImage.UriSource = _
   New Uri("pack://application:,,/images/apple.jpg")
myBitmapImage.EndInit()
myImage.Source = myBitmapImage
myImage.Width = 10
myBulletDecorator.Bullet = myImage
myBulletDecorator.Margin = New Thickness(0, 10, 0, 0)
myBulletDecorator.VerticalAlignment = VerticalAlignment.Center
myBulletDecorator.Background = Brushes.Yellow
Dim myTextBlock = New TextBlock()
myTextBlock.Text = "This BulletDecorator created by using code"
myTextBlock.TextWrapping = TextWrapping.Wrap
myTextBlock.HorizontalAlignment = HorizontalAlignment.Left
myTextBlock.Width = 100
myTextBlock.Foreground = Brushes.Purple
myBulletDecorator.Child = myTextBlock
BulletDecorator myBulletDecorator = new BulletDecorator();
Image myImage = new Image();
BitmapImage myBitmapImage = new BitmapImage();
myBitmapImage.BeginInit();
myBitmapImage.UriSource = new Uri(@"pack://application:,,/images/apple.jpg");
myBitmapImage.EndInit();
myImage.Source = myBitmapImage;
myImage.Width = 10;
myBulletDecorator.Bullet = myImage;
myBulletDecorator.Margin = new Thickness(0, 10, 0, 0);
myBulletDecorator.VerticalAlignment = VerticalAlignment.Center;
myBulletDecorator.Background = Brushes.Yellow;
TextBlock myTextBlock = new TextBlock();
myTextBlock.Text = "This BulletDecorator created by using code";
myTextBlock.TextWrapping = TextWrapping.Wrap;
myTextBlock.HorizontalAlignment = HorizontalAlignment.Left;
myTextBlock.Width = 100;
myTextBlock.Foreground = Brushes.Purple;
myBulletDecorator.Child = myTextBlock;
<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>

下列範例顯示如何定義 BulletDecorator 控制項,這個控制項使用影像做為 Bullet,並使用指定字型大小的文字物件做為 Child。由於 Bullet 小於字型大小指定的字母,因此 Bullet 物件會在文字旁置中對齊本身。

<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>

下列範例顯示如何定義 BulletDecorator 控制項,這個控制項使用影像做為 Bullet,並使用非文字項目做為 Child。在這個範例中,Bullet 物件會在非文字項目旁置中對齊本身。

<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>

下列範例顯示 BulletDecorator 控制項的三種 Bullet 選項。

<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>

請參閱

參考

BulletDecorator