مشاركة عبر

نظرة عامة على فرشات WPF

  • مقالة

كل شيء مرئي على الشاشة الخاصة هي مرئية لأن تم تلوينها بواسطة فرشاة. على سبيل المثال، يتم استخدام فرشاة لوصف خلفية زر و مقدمة نص و تعبئة شكل. يقدم هذا الموضوع مفاهيم الطلاء بفرش Windows Presentation Foundation (WPF) ويوفر أمثلة. تمكنك الفرش من رسم كائنات واجهة المستخدم (UI) من أي شيء بسيط ، الألوان الخالصة إلى المجموعات المعقدة من النقوش و الصور.

الرسم بواسطة فرشاة

Brush "يرسم" منطقة بالإخراج الخاص به. الفرش المختلفة ذات أنواع مختلفة من الإخراج. بعض الفرش ترسم منطقة بألوان خالصة, آخرين بتدرج أو نقش أو صورة أو رسم. يبين الرسم التوضيحي التالي أمثلة على كل من الأنواع المختلفة Brush.

أمثلة فرش

أنواع الفرشاة

تمكنك معظم الكائنات المرئية بتحديد كيفية التلوين. يسرد الجدول التالي بعض الكائنات و الخصائص الشائعة التي يمكنك استخدامها Brush.

الفئة

خصائص الفرش

Border

BorderBrush, Background

Control

Background, Foreground

Panel

Background

Pen

Brush

Shape

Fill, Stroke

TextBlock

Background

تصف المقاطع التالية مختلف Brush أنواع وتوفر مثال لكل.

الرسم بلون متصل

SolidColorBrush سيرسم منطقة بلون متصل Color. توجد مجموعة متنوعة من الطرق لتحديد Color من SolidColorBrush: على سبيل المثال، يمكنك تعيين قنوات ألفا و أحمر و أزرق و أخضر الخاصة به أو استخدام أحد الألوان المعرفة مسبقاً الموفرة من قبل فئة Colors.

يستخدم المثال التالي SolidColorBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام SolidColorBrush

مستطيل مرسوم باستخدام SolidColorBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create a SolidColorBrush and use it to
            ' paint the rectangle.
            Dim myBrush As New SolidColorBrush(Colors.Red)
            exampleRectangle.Fill = myBrush

Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;

// Create a SolidColorBrush and use it to
// paint the rectangle.
SolidColorBrush myBrush = new SolidColorBrush(Colors.Red);
exampleRectangle.Fill = myBrush;

<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <SolidColorBrush Color="Red" />
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة SolidColorBrush، راجع نظرة عامة على الطلاء بالألوان الصلدة و تدرجاتها.

الرسم بتدرج خطي

LinearGradientBrushيرسم مساحة بتدرج خطي التدرج الخطي يمزج اثنين أو أكثر من الألوان بخط أو محور التدرج. يمكنك استخدام GradientStop الكائنات لتحديد الألوان في التدرج و المواضع الخاصة بهم.

يستخدم المثال التالي LinearGradientBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام LinearGradientBrush

مستطيل مرسوم باستخدام LinearGradientBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create a LinearGradientBrush and use it to
            ' paint the rectangle.
            Dim myBrush As New LinearGradientBrush()
            myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
            myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
            myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))

            exampleRectangle.Fill = myBrush

Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;

// Create a LinearGradientBrush and use it to
// paint the rectangle.
LinearGradientBrush myBrush = new LinearGradientBrush();
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));

exampleRectangle.Fill = myBrush;

<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <LinearGradientBrush>
      <GradientStop Color="Yellow" Offset="0.0" />
      <GradientStop Color="Orange" Offset="0.5" />
      <GradientStop Color="Red" Offset="1.0" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة LinearGradientBrush، راجع نظرة عامة على الطلاء بالألوان الصلدة و تدرجاتها.

الرسم بتدرج شعاعي

RadialGradientBrushالرسم على منطقة بتدرج شعاعي التدرج الشعاعي يمزج لونين أو أكثر عبر دائرة. كما بالفئة LinearGradientBrush ، يمكنك استخدام كائنات GradientStop لتحديد الألوان في التدرج و المواضع الخاصة بهم.

يستخدم المثال التالي RadialGradientBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام RadialGradientBrush

مستطيل مرسوم باستخدام RadialGradientBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create a RadialGradientBrush and use it to
            ' paint the rectangle.
            Dim myBrush As New RadialGradientBrush()
            myBrush.GradientOrigin = New Point(0.75, 0.25)
            myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
            myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
            myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))

            exampleRectangle.Fill = myBrush

Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;

// Create a RadialGradientBrush and use it to
// paint the rectangle.
RadialGradientBrush myBrush = new RadialGradientBrush();
myBrush.GradientOrigin = new Point(0.75, 0.25);
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));

exampleRectangle.Fill = myBrush;

<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <RadialGradientBrush GradientOrigin="0.75,0.25">
      <GradientStop Color="Yellow" Offset="0.0" />
      <GradientStop Color="Orange" Offset="0.5" />
      <GradientStop Color="Red" Offset="1.0" />
    </RadialGradientBrush>
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة RadialGradientBrush، راجع نظرة عامة على الطلاء بالألوان الصلدة و تدرجاتها.

رسم باستخدام صورة

ImageBrush سيرسم منطقة ب ImageSource.

يستخدم المثال التالي ImageBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام صورة

مستطيل مرسوم باستخدام ImageBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create an ImageBrush and use it to
            ' paint the rectangle.
            Dim myBrush As New ImageBrush()
            myBrush.ImageSource = New BitmapImage(New Uri("sampleImages\pinkcherries.jpg", UriKind.Relative))

            exampleRectangle.Fill = myBrush

Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;

// Create an ImageBrush and use it to
// paint the rectangle.
ImageBrush myBrush = new ImageBrush();
myBrush.ImageSource = 
    new BitmapImage(new Uri(@"sampleImages\pinkcherries.jpg", UriKind.Relative));

exampleRectangle.Fill = myBrush;

<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <ImageBrush ImageSource="sampleImages\pinkcherries.jpg"  />
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة ImageBrush، راجع رسم صور و رسومات و صور.

الرسم بواسطة رسم

DrawingBrush سيرسم منطقة ب Drawing. Drawing يمكن أن يحتوي على أشكال و صور و نص و وسائط.

يستخدم المثال التالي DrawingBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام DrawingBrush

مستطيل مرسوم باستخدام DrawingBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create a DrawingBrush and use it to
            ' paint the rectangle.
            Dim myBrush As New DrawingBrush()

            Dim backgroundSquare As New GeometryDrawing(Brushes.White, Nothing, New RectangleGeometry(New Rect(0, 0, 100, 100)))

            Dim aGeometryGroup As New GeometryGroup()
            aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
            aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))

            Dim checkerBrush As New LinearGradientBrush()
            checkerBrush.GradientStops.Add(New GradientStop(Colors.Black, 0.0))
            checkerBrush.GradientStops.Add(New GradientStop(Colors.Gray, 1.0))

            Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)

            Dim checkersDrawingGroup As New DrawingGroup()
            checkersDrawingGroup.Children.Add(backgroundSquare)
            checkersDrawingGroup.Children.Add(checkers)

            myBrush.Drawing = checkersDrawingGroup
            myBrush.Viewport = New Rect(0, 0, 0.25, 0.25)
            myBrush.TileMode = TileMode.Tile

            exampleRectangle.Fill = myBrush

Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;

// Create a DrawingBrush and use it to
// paint the rectangle.
DrawingBrush myBrush = new DrawingBrush();

GeometryDrawing backgroundSquare =
    new GeometryDrawing(
        Brushes.White,
        null,
        new RectangleGeometry(new Rect(0, 0, 100, 100)));

GeometryGroup aGeometryGroup = new GeometryGroup();
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));

LinearGradientBrush checkerBrush = new LinearGradientBrush();
checkerBrush.GradientStops.Add(new GradientStop(Colors.Black, 0.0));
checkerBrush.GradientStops.Add(new GradientStop(Colors.Gray, 1.0));

GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);

DrawingGroup checkersDrawingGroup = new DrawingGroup();
checkersDrawingGroup.Children.Add(backgroundSquare);
checkersDrawingGroup.Children.Add(checkers);

myBrush.Drawing = checkersDrawingGroup;
myBrush.Viewport = new Rect(0, 0, 0.25, 0.25);
myBrush.TileMode = TileMode.Tile;

exampleRectangle.Fill = myBrush;

<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <DrawingBrush Viewport="0,0,0.25,0.25" TileMode="Tile">
      <DrawingBrush.Drawing>
        <DrawingGroup>
          <GeometryDrawing Brush="White">
            <GeometryDrawing.Geometry>
              <RectangleGeometry Rect="0,0,100,100" />
            </GeometryDrawing.Geometry>
          </GeometryDrawing>

          <GeometryDrawing>
            <GeometryDrawing.Geometry>
              <GeometryGroup>
                <RectangleGeometry Rect="0,0,50,50" />
                <RectangleGeometry Rect="50,50,50,50" />
              </GeometryGroup>
            </GeometryDrawing.Geometry>
            <GeometryDrawing.Brush>
              <LinearGradientBrush>
                <GradientStop Offset="0.0" Color="Black" />
                <GradientStop Offset="1.0" Color="Gray" />
              </LinearGradientBrush>
            </GeometryDrawing.Brush>
          </GeometryDrawing>
        </DrawingGroup>
      </DrawingBrush.Drawing>
    </DrawingBrush>
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة DrawingBrush، راجع رسم صور و رسومات و صور.

الرسم بواسطة مرئي

VisualBrush سيرسم منطقة بكائنVisual. أمثلة لكائنات مرئية تتضمن Button ، Page ، و MediaElement. VisualBrush أيضاً يمكنك من توجيه المحتوى من جزء من التطبيق الخاص بك إلى منطقة آخرى; وهو مفيد جداً لإنشاء تأثيرات انعكاس و الأجزاء المكبرة من الشاشة.

يستخدم المثال التالي VisualBrushلرسم Fill من Rectangle. يبين الرسم التوضيحي التالي المستطيل الملون.

مستطيل مرسوم باستخدام VisualBrush

مستطيل مرسوم باستخدام VisualBrush

            Dim exampleRectangle As New Rectangle()
            exampleRectangle.Width = 75
            exampleRectangle.Height = 75

            ' Create a VisualBrush and use it
            ' to paint the rectangle.
            Dim myBrush As New VisualBrush()

            '
            ' Create the brush's contents.
            '
            Dim aPanel As New StackPanel()

            ' Create a DrawingBrush and use it to
            ' paint the panel.
            Dim myDrawingBrushBrush As New DrawingBrush()
            Dim aGeometryGroup As New GeometryGroup()
            aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
            aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))
            Dim checkerBrush As New RadialGradientBrush()
            checkerBrush.GradientStops.Add(New GradientStop(Colors.MediumBlue, 0.0))
            checkerBrush.GradientStops.Add(New GradientStop(Colors.White, 1.0))
            Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)
            myDrawingBrushBrush.Drawing = checkers
            aPanel.Background = myDrawingBrushBrush

            ' Create some text.
            Dim someText As New TextBlock()
            someText.Text = "Hello, World"
            Dim fSizeConverter As New FontSizeConverter()
            someText.FontSize = CDbl(fSizeConverter.ConvertFromString("10pt"))
            someText.Margin = New Thickness(10)

            aPanel.Children.Add(someText)

            myBrush.Visual = aPanel
            exampleRectangle.Fill = myBrush


            Rectangle exampleRectangle = new Rectangle();
            exampleRectangle.Width = 75;
            exampleRectangle.Height = 75;

            // Create a VisualBrush and use it
            // to paint the rectangle.
            VisualBrush myBrush = new VisualBrush();

            //
            // Create the brush's contents.
            //
            StackPanel aPanel = new StackPanel();

            // Create a DrawingBrush and use it to
            // paint the panel.
            DrawingBrush myDrawingBrushBrush = new DrawingBrush();
            GeometryGroup aGeometryGroup = new GeometryGroup();
            aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
            aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));
            RadialGradientBrush checkerBrush = new RadialGradientBrush();
            checkerBrush.GradientStops.Add(new GradientStop(Colors.MediumBlue, 0.0));
            checkerBrush.GradientStops.Add(new GradientStop(Colors.White, 1.0));
            GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);
            myDrawingBrushBrush.Drawing = checkers;
            aPanel.Background = myDrawingBrushBrush;

            // Create some text.
            TextBlock someText = new TextBlock();
            someText.Text = "Hello, World";
            FontSizeConverter fSizeConverter = new FontSizeConverter();
            someText.FontSize = (double)fSizeConverter.ConvertFromString("10pt");
            someText.Margin = new Thickness(10);

            aPanel.Children.Add(someText);

            myBrush.Visual = aPanel;
            exampleRectangle.Fill = myBrush;


<Rectangle Width="75" Height="75">
  <Rectangle.Fill>
    <VisualBrush TileMode="Tile">
      <VisualBrush.Visual>
        <StackPanel>
          <StackPanel.Background>
            <DrawingBrush>
              <DrawingBrush.Drawing>
                <GeometryDrawing>
                  <GeometryDrawing.Brush>
                    <RadialGradientBrush>
                      <GradientStop Color="MediumBlue" Offset="0.0" />
                      <GradientStop Color="White" Offset="1.0" />
                    </RadialGradientBrush>
                  </GeometryDrawing.Brush>
                  <GeometryDrawing.Geometry>
                    <GeometryGroup>
                      <RectangleGeometry Rect="0,0,50,50" />
                      <RectangleGeometry Rect="50,50,50,50" />
                    </GeometryGroup>
                  </GeometryDrawing.Geometry>
                </GeometryDrawing>
              </DrawingBrush.Drawing>
            </DrawingBrush>
          </StackPanel.Background>
          <TextBlock FontSize="10pt" Margin="10">Hello, World!</TextBlock>
        </StackPanel>
      </VisualBrush.Visual>
    </VisualBrush>
  </Rectangle.Fill>
</Rectangle>

لمزيد من المعلومات حول الفئة VisualBrush، راجع رسم صور و رسومات و صور.

الرسم باستخدام الفرش المعرفة مسبقاً و النظامية

تسهيلاً Windows Presentation Foundation (WPF) يوفر مجموعة من الفرش المعرفة مسبقاً و النظامية التي يمكنك استخدامها لرسم الكائنات.

ميزات الفرش الشائعة

Brush توفر كائناتOpacity خاصية يمكن استخدامها لجعل الفرشاة شفافة أو شفافة جزئياً. Opacity قيمة 0 تجعل الفرشاة شفافة تماماً ، أثناء Opacity قيمة 1 تجعل الفرشاة كامدة بالكامل . يستخدم المثال التالي Opacity لجعل SolidColorBrush كامد 25 بالمائة.

<Rectangle Width="100" Height="100">
  <Rectangle.Fill>
    <SolidColorBrush Color="Blue" Opacity="0.25" />
  </Rectangle.Fill>
</Rectangle>

Rectangle myRectangle = new Rectangle();
myRectangle.Width = 100;
myRectangle.Height = 100;
SolidColorBrush partiallyTransparentSolidColorBrush
    = new SolidColorBrush(Colors.Blue);
partiallyTransparentSolidColorBrush.Opacity = 0.25;
myRectangle.Fill = partiallyTransparentSolidColorBrush;

إذا كانت الفرشاة تحتوي على الألوان الشفافة جزئياً, معدل الشفافية لللون يتم دمجه خلال الضرب مع قيمة معدل الشفافية للفرشاة. على سبيل المثال، إذا كانت قيمة معدل الشفافية للفرشاة 0.5 و اللون المستخدم في الفرشاة أيضاً لديها قيمة معدل الشفافية ب 0.5, لون الإخراج له قيمة معدل الشفافية ب 0.25.

ملاحظةملاحظة

إنه من الأفضل تغيير قيمة معدل شفافية فرشاة عن تغيير معدل شفافية عنصر بأكمله باستخدام خاصية UIElement.Opacity.

يمكنك استدارة و تغيير حجم و انحراف و ترجمة محتوى فرشاة باستخدام Transform أو RelativeTransform خصائص. لمزيد من المعلومات، راجع نظرة عامة حول تحويل الفرشاة.

لأنها Animatable الكائنات، Brush يمكن تحريك الكائنات. لمزيد من المعلومات، راجع نظرة عامة حول الحركة.

ميزات القابل للتجميد

بسبب أنه يرث من Freezable فئة Brush توفر الفئة العديد من الميزات الخاصة: Brush الكائنات يمكن أن يتم تعريفها كـالموارد ، مشاركتها بين عدة كائنات و المستنسخة. بالإضافة إلى ذلك، كافة Brush أنواع باستثناء VisualBrush يمكن جعلها للقراءة فقط لتحسين الأداء و إعادة إنشاء مؤشر أمان الترابط.

للحصول على مزيد من المعلومات حول الميزات المختلفة المتوفرة من قبل Freezable الكائنات، راجع نظرة عامة حول الكائنات المجمدة.

للحصول على مزيد من المعلومات حول VisualBrush لا يمكن تجميد كائنات , راجع VisualBrush نوع الصفحة.

راجع أيضًا:

المرجع

Brush

Brushes

المبادئ

نظرة عامة على الطلاء بالألوان الصلدة و تدرجاتها

رسم صور و رسومات و صور

نظرة عامة حول الكائنات المجمدة

أمثلية الأداء: توصيات أخرى

موارد أخرى

نموذج للفرش

نموذج ImageBrush

نموذج VisualBrush

مواضيع How-to المتعلقة بالفرش