Udostępnij za pośrednictwem


Instrukcje: zachowywanie współczynnika proporcji obrazu używanego jako tło

W tym przykładzie pokazano, w jaki sposób używać właściwości Stretch z ImageBrush w celu zachowania proporcji obrazu.

Domyślnie, gdy używasz ImageBrush do malowania obszaru, jego zawartość rozciąga się, aby całkowicie wypełnić obszar wyjściowy. Gdy obszar danych wyjściowych i obraz mają różne współczynniki proporcji, obraz jest zniekształcony przez to rozciąganie.

Aby ImageBrush zachować proporcje obrazu, ustaw właściwość Stretch na wartość Uniform lub UniformToFill.

Przykład

W poniższym przykładzie użyto dwóch obiektów ImageBrush do malowania dwóch prostokątów. Każdy prostokąt ma rozmiar 300 o 150 pikseli, a każdy z nich zawiera obraz o rozmiarze 300 o 300 pikseli. Właściwość Stretch pierwszego pędzla jest ustawiona na Uniform, a właściwość Stretch drugiego pędzla jest ustawiona na wartość 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";
        }
    }
}

Na poniższej ilustracji przedstawiono wyniki pierwszego pędzla, który ma ustawienie Stretch o wartości Uniform.

ImageBrush z jednolitym rozciągnięciem

Na następnej ilustracji przedstawiono dane wyjściowe drugiego pędzla z ustawieniem StretchUniformToFill.

Pędzel obrazu (ImageBrush) z opcją rozciągania UniformToFill

Należy pamiętać, że właściwość Stretch zachowuje się identycznie dla innych obiektów TileBrush, czyli dla DrawingBrush i VisualBrush. Aby uzyskać więcej informacji na temat ImageBrush i innych obiektów TileBrush, zobacz Malowanie przy użyciu obrazów, rysunków i wizualizacji.

Należy również pamiętać, że chociaż właściwość Stretch wydaje się określać sposób, w jaki zawartość TileBrush rozciąga się, aby dopasować się do swojego obszaru wyjściowego, w rzeczywistości określa sposób, w jaki zawartość TileBrush rozciąga się, aby wypełnić kafelek bazowy. Aby uzyskać więcej informacji, zobacz TileBrush.

Ten przykład kodu jest częścią większego przykładu udostępnionego dla klasy ImageBrush. Aby zapoznać się z kompletnym przykładem, zobacz ImageBrush Sample.

Zobacz także