Guide pratique pour conserver les proportions d’une image utilisée en tant qu’arrière-plan

Cet exemple montre comment utiliser la Stretch propriété d’un ImageBrush afin de conserver les proportions de l’image.

Par défaut, lorsque vous utilisez ImageBrush pour peindre une zone, son contenu s’étend pour remplir complètement la zone de sortie. Lorsque la zone de sortie et l’image ont des proportions différentes, l’image est déformée par cet étirement.

Pour qu'un ImageBrush conserve les proportions de son image, définissez la propriété Stretch sur Uniform ou UniformToFill.

Exemple :

L’exemple suivant utilise deux ImageBrush objets pour peindre deux rectangles. Chaque rectangle est de 300 par 150 pixels et contient chacun une image de 300 par 300 pixels. La propriété Stretch du premier pinceau est définie sur Uniform, et la propriété Stretch du deuxième pinceau est définie sur 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";
        }
    }
}

L’illustration suivante montre la sortie du premier pinceau, qui a un Stretch paramètre de Uniform.

L'illustration suivante montre la sortie du deuxième pinceau, qui a un réglage Stretch de UniformToFill.

Notez que la Stretch propriété se comporte de façon identique pour les autres TileBrush objets, c’est-à-dire pour DrawingBrush et VisualBrush. Pour plus d’informations sur ImageBrush et les autres objets TileBrush, consultez Peinture avec des images, des dessins et des visuels.

Notez également que, bien que la propriété semble spécifier la façon dont le contenu Stretch s’étend pour s’adapter à sa zone de sortie, il spécifie effectivement comment le contenu TileBrush s’étend pour remplir sa vignette de base. Pour plus d’informations, consultez TileBrush.

Cet exemple de code fait partie d’un exemple plus large fourni pour la ImageBrush classe. Pour l'échantillon complet, consultez ImageBrush Sample.

Voir aussi

• TileBrush
• peinture avec des images, des dessins et des visuels