3

背景がグラデーションの長方形を作成できます。パスを指定してその上に画像を挿入するにはどうすればよいですか？

<Rectangle StrokeThickness="2" Height="77" Canvas.Left="184" Canvas.Top="477" Width="119">
    <Rectangle.Fill>
        <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
            <GradientStop Color="Black" Offset="0" />
            <GradientStop Color="White" Offset="0.5" />
            <GradientStop Color="Black" Offset="1" />
        </LinearGradientBrush>
    </Rectangle.Fill>
</Rectangle>

私が欲しいもの：

背景の上の画像

4

2 に答える 2

3

はBorder1つのコンテンツを保持するので、それがすべてである場合は、次のように問題なく機能します。

<Border>
  <Border.Background>
    <LinearGradientBrush StartPoint="0,0.5"
                         EndPoint="1,0.5">
      <GradientStop Color="Black"
                    Offset="0" />
      <GradientStop Color="White"
                    Offset="0.5" />
      <GradientStop Color="Black"
                    Offset="1" />
    </LinearGradientBrush>
  </Border.Background>
  <Image HorizontalAlignment="Center"
         VerticalAlignment="Center" />
</Border>

より多くの形状/パス/画像をレイヤー化する必要がある場合は、Grid複数の子をサポートするオブジェクトを使用できます。

<Grid>
  <!--Object 1-->
  <Ellipse StrokeThickness="2"
           Height="77"
           Width="119"
           HorizontalAlignment="Center"
           VerticalAlignment="Center">
    <Ellipse.Fill>
      <LinearGradientBrush StartPoint="0,0.5"
                           EndPoint="1,0.5">
        <GradientStop Color="Black"
                      Offset="0" />
        <GradientStop Color="White"
                      Offset="0.5" />
        <GradientStop Color="Black"
                      Offset="1" />
      </LinearGradientBrush>
    </Ellipse.Fill>
  </Ellipse>
  <!--Object 2-->
  <Image HorizontalAlignment="Center"
         VerticalAlignment="Center" />
</Grid>

WPFはXAMLの最初からコントロールの描画を開始するため、XAMLリストで定義されている最後のコントロールが一番上に描画されることを覚えておいてください。

于 2012-11-29T18:51:18.240 に答える
1

Rectangleは直接コンテンツをサポートしていないため、長方形に対して必要な場所に画像を配置し、Canvas.ZIndexプロパティを高くして、長方形の上にレンダリングすることができます。

元：

<Rectangle StrokeThickness="2"
           Height="77"
           Canvas.Left="184"
           Canvas.Top="477"
           Width="119"
           Canvas.ZIndex="1">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0,0.5"
                         EndPoint="1,0.5">
      <GradientStop Color="Black"
                    Offset="0" />
      <GradientStop Color="White"
                    Offset="0.5" />
      <GradientStop Color="Black"
                    Offset="1" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>
<Image Height="50"
       Canvas.Left="184"
       Canvas.Top="477"
       Width="50"
       Canvas.ZIndex="2" />

編集

画像を長方形の中央に配置することは、常に別の問題です。コードの背後に、（イベントを介して）長方形を移動したときに変化する、計算された長方形の中心座標を表すプロパティを含めることができます。次に、画像の場所をそのプロパティにバインドできます。

于 2012-11-29T17:41:31.303 に答える