次の方法で共有

方法: 背景として使用されるイメージの縦横比を維持する

  • [アーティクル]

この例では、イメージの縦横比を維持するために、ImageBrush の Stretch プロパティを使用する方法を示します。

既定では、ImageBrush を使用して領域を塗りつぶすと、その内容が拡大されて出力領域全体を完全に満たします。 出力領域と画像の縦横比が異なる場合、このストレッチによって画像が歪みます。

ImageBrush イメージの縦横比を維持するには、Stretch プロパティを Uniform または UniformToFillに設定します。

例

次の例では、2 つの ImageBrush オブジェクトを使用して 2 つの四角形を描画します。 各四角形は 300 x 150 ピクセルで、それぞれ 300 x 300 ピクセルの画像が含まれています。 最初のブラシの Stretch プロパティは Uniformに設定され、2 番目のブラシの Stretch プロパティは UniformToFillに設定されます。

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Imaging;
using System.Windows.Media;
using System.Windows.Shapes;

namespace Microsoft.Samples.Graphics.UsingImageBrush
{
    /// <summary>
    /// Demonstrates different ImageBrush Stretch settings.
    /// </summary>
    public class StretchModes : Page
    {
        public StretchModes()
        {

            // Create an ImageBrush with its Stretch
            // property set to Uniform. The image it
            // contains will be expanded as much as possible
            // to fill the output area while still
            // preserving its aspect ratio.
            ImageBrush uniformBrush = new ImageBrush();
            uniformBrush.ImageSource =
                new BitmapImage(new Uri("sampleImages\\square.jpg", UriKind.Relative));
            uniformBrush.Stretch = Stretch.Uniform;

            // Freeze the brush (make it unmodifiable) for performance benefits.
            uniformBrush.Freeze();

            // Create a rectangle and paint it with the ImageBrush.
            Rectangle rectangle1 = new Rectangle();
            rectangle1.Width = 300;
            rectangle1.Height = 150;
            rectangle1.Stroke = Brushes.MediumBlue;
            rectangle1.StrokeThickness = 1.0;
            rectangle1.Fill = uniformBrush;

            // Create an ImageBrush with its Stretch
            // property set to UniformToFill. The image it
            // contains will be expanded to completely fill
            // the rectangle, but its aspect ratio is preserved.
            ImageBrush uniformToFillBrush = new ImageBrush();
            uniformToFillBrush.ImageSource =
                new BitmapImage(new Uri("sampleImages\\square.jpg", UriKind.Relative));
            uniformToFillBrush.Stretch = Stretch.UniformToFill;

            // Freeze the brush (make it unmodifiable) for performance benefits.
            uniformToFillBrush.Freeze();

            // Create a rectangle and paint it with the ImageBrush.
            Rectangle rectangle2 = new Rectangle();
            rectangle2.Width = 300;
            rectangle2.Height = 150;
            rectangle2.Stroke = Brushes.MediumBlue;
            rectangle2.StrokeThickness = 1.0;
            rectangle2.Margin = new Thickness(0, 10, 0, 0);
            rectangle2.Fill = uniformToFillBrush;

            StackPanel mainPanel = new StackPanel();
            mainPanel.Children.Add(rectangle1);
            mainPanel.Children.Add(rectangle2);

            Content = mainPanel;
            Background = Brushes.White;
            Margin = new Thickness(20);
            Title = "ImageBrush Stretch Modes";
        }
    }
}

次の図は、Uniformの Stretch 設定を持つ最初のブラシの出力を示しています。

Uniform 拡大を使用した ImageBrush を使用した

次の図は、UniformToFillの Stretch 設定を持つ 2 番目のブラシの出力を示しています。

UniformToFill ストレッチgraphicsmm_ImageBrushUniformToFillStretch を使用した ImageBrush の

Stretch プロパティは、他の TileBrush オブジェクト(DrawingBrush と VisualBrush)で同じように動作します。 ImageBrush およびその他の TileBrush オブジェクトの詳細については、「イメージ、描画、およびビジュアルを使用した描画」を参照してください。

また、Stretch プロパティは、TileBrush コンテンツが出力領域に合わせてどのように拡大されるかを指定するように見えますが、実際には、TileBrush コンテンツが基本タイルを埋めるように引き伸ばす方法を指定します。 詳細については、TileBrushを参照してください。

このコード例は、ImageBrush クラスに提供されるより大きな例の一部です。 完全なサンプルについては、ImageBrush サンプルを参照してください。

関連項目