Xamarin.Forms Fırçalar: Radyal gradyanlar

RadialGradientBrush sınıfı sınıfından GradientBrush türetilir ve bir alanı radyal gradyanla boyar ve bir daire üzerinde iki veya daha fazla rengi karıştırır. GradientStop nesneleri, gradyandaki renkleri ve konumlarını belirtmek için kullanılır. Nesneler hakkında GradientStop daha fazla bilgi için bkz Xamarin.Forms . Fırçalar: Gradyanlar.

RadialGradientBrush sınıfı aşağıdaki özellikleri tanımlar:

• Center, türündedir Pointve radyal gradyan için dairenin orta noktasını temsil eder. Bu özelliğin varsayılan değeri (0,5,0,5).
• Radius, türündedir doubleve radyal gradyan için dairenin yarıçapını temsil eder. Bu özelliğin varsayılan değeri 0,5'tir.

Bu özellikler nesneler tarafından BindableProperty desteklenir; bu da veri bağlamalarının hedefleri olabileceği ve stillendirilebileceği anlamına gelir.

sınıfı, RadialGradientBrush fırçaya herhangi GradientStop bir IsEmpty nesne atanıp atanmadığını gösteren bir bool de yöntemine sahiptir.

Not

Radyal gradyanlar CSS işleviyle radial-gradient() de oluşturulabilir.

RadialGradientBrush Oluşturma

Radyal gradyan fırçanın gradyan durakları, daire tarafından tanımlanan gradyan ekseni boyunca konumlandırılır. Gradyan ekseni dairenin merkezinden çevresine yayılımı gösterir. Dairenin konumu ve boyutu fırçanın Center ve Radius özellikleri kullanılarak değiştirilebilir. Daire gradyanın bitiş noktasını tanımlar. Bu nedenle, 1,0'daki gradyan durağı, dairenin çevresinin rengini tanımlar. 0,0'daki gradyan durağı, dairenin ortasındaki rengi tanımlar.

Radyal gradyan oluşturmak için bir RadialGradientBrush nesne oluşturun ve nesnesini Center ve Radius özelliklerini ayarlayın. Ardından, gradyandaki renkleri ve konumlarını belirten iki veya daha fazla GradientStop nesneyi RadialGradientBrush.GradientStops koleksiyona ekleyin.

Aşağıdaki XAML örneği, olarak ayarlanmış Background bir Frameöğesini gösterirRadialGradientBrush:

<Frame BorderColor="LightGray"
       HasShadow="True"
       CornerRadius="12"
       HeightRequest="120"
       WidthRequest="120">
    <Frame.Background>
        <!-- Center defaults to (0.5,0.5)
             Radius defaults to (0.5) -->
        <RadialGradientBrush>
            <GradientStop Color="Red"
                          Offset="0.1" />
            <GradientStop Color="DarkBlue"
                          Offset="1.0" />
        </RadialGradientBrush>
    </Frame.Background>
</Frame>

Bu örnekte, öğesinin Frame arka planı kırmızıdan koyu maviye ilişkilendirilmiş bir RadialGradientBrush ile boyanmış. Radyal gradyanın merkezi, ortasında konumlandırılır Frame:

Aşağıdaki XAML örneği radyal gradyanın merkezini sol üst köşesine Frametaşır:

<!-- Radius defaults to (0.5) -->
<RadialGradientBrush Center="0.0,0.0">
    <GradientStop Color="Red"
                  Offset="0.1" />
    <GradientStop Color="DarkBlue"
                  Offset="1.0" />
</RadialGradientBrush>

Bu örnekte, öğesinin Frame arka planı kırmızıdan koyu maviye ilişkilendirilmiş bir RadialGradientBrush ile boyanmış. Radyal gradyanın merkezi, sol üst Framekısmında konumlandırılır:

Aşağıdaki XAML örneği radyal gradyanın merkezini öğesinin sağ alt köşesine Frametaşır:

<!-- Radius defaults to (0.5) -->
<RadialGradientBrush Center="1.0,1.0">
    <GradientStop Color="Red"
                  Offset="0.1" />
    <GradientStop Color="DarkBlue"
                  Offset="1.0" />
</RadialGradientBrush>            

Bu örnekte, öğesinin Frame arka planı kırmızıdan koyu maviye ilişkilendirilmiş bir RadialGradientBrush ile boyanmış. Radyal gradyanın merkezi öğesinin sağ Framealt kısmına yerleştirilir:

İlgili bağlantılar

• Xamarin.Forms Fırçalar: Gradyanlar