GraphicsView

Browse sample. Örneğe göz atın

.NET Çok Platformlu Uygulama Kullanıcı Arabirimi (.NET MAUI), GraphicsView ad alanından türler Microsoft.Maui.Graphics kullanılarak 2B grafiklerin çizilebildiği bir grafik tuvalidir. hakkında Microsoft.Maui.Graphicsdaha fazla bilgi için bkz . Grafikler.

GraphicsView , türündeki DrawableIDrawable, çizilecek içeriği belirten özelliğini tanımlar. Bu özellik bir BindablePropertytarafından desteklenir, bu da veri bağlamanın hedefi olabileceği ve stillendirilebileceği anlamına gelir.

GraphicsView aşağıdaki olayları tanımlar:

  • StartHoverInteractionile, TouchEventArgsişaretçinin isabet sınama alanına GraphicsViewgirmesiyle tetiklenen ile.
  • MoveHoverInteractionile, işaretçi TouchEventArgshareket ettiğinde işaretçinin isabet sınama alanı GraphicsViewiçinde kaldığı sırada tetiklenen ile.
  • EndHoverInteraction, işaretçinin isabet sınama alanından GraphicsViewayrıldığında tetiklenen .
  • StartInteraction, ile tuşuna TouchEventArgsGraphicsView basıldığında yükseltilir.
  • DragInteraction, ile sürüklendiğinde TouchEventArgsGraphicsView oluşturulur.
  • EndInteraction, ile, TouchEventArgsolayı tetikleyen StartInteraction basın serbest bırakıldığında oluşturulur.
  • CancelInteraction, temas eden basın kişi kaybettiğinde GraphicsView ortaya çıkar.

GraphicsView Oluşturma

denetiminde GraphicsView çizilecek içeriği belirten bir IDrawable nesne tanımlamalıdır. Bu, öğesinden IDrawabletüretilen bir nesne oluşturularak ve yöntemini uygulayarak Draw gerçekleştirilebilir:

namespace MyMauiApp
{
    public class GraphicsDrawable : IDrawable
    {
        public void Draw(ICanvas canvas, RectF dirtyRect)
        {
            // Drawing code goes here
        }      
    }
}

yönteminin Draw ve RectF bağımsız değişkenleri vardırICanvas. ICanvas Bağımsız değişken, üzerine grafik nesneler çizdiğiniz çizim tuvalidir. RectF bağımsız değişkeni, çizim tuvalinin boyutu ve konumu hakkında veriler içeren bir struct bağımsız değişkendir. üzerinde ICanvasçizim yapma hakkında daha fazla bilgi için bkz . Grafik nesneleri çizme.

XAML'de IDrawable nesne bir kaynak olarak bildirilebilir ve ardından anahtarını özelliğin Drawable değeri olarak belirterek tarafından GraphicsView kullanılabilir:

<ContentPage xmlns=http://schemas.microsoft.com/dotnet/2021/maui
             xmlns:x=http://schemas.microsoft.com/winfx/2009/xaml
             xmlns:drawable="clr-namespace:MyMauiApp"
             x:Class="MyMauiApp.MainPage">
    <ContentPage.Resources>
        <drawable:GraphicsDrawable x:Key="drawable" />
    </ContentPage.Resources>
    <VerticalStackLayout>
        <GraphicsView Drawable="{StaticResource drawable}"
                      HeightRequest="300"
                      WidthRequest="400" />
    </VerticalStackLayout>
</ContentPage>

Grafik nesneleri konumlandırma ve boyutlandırma

Sayfadaki öğesinin ICanvas konumu ve boyutu, yöntemindeki Draw bağımsız değişkenin RectF özellikleri incelenerek belirlenebilir.

RectF Yapısı aşağıdaki özellikleri tanımlar:

  • Bottom, türündeki floattuvalin alt kenarının y koordinatını temsil eder.
  • Center, türündeki PointFtuvalin merkezinin koordinatlarını belirtir.
  • Height, türündeki floattuvalin yüksekliğini tanımlar.
  • IsEmpty, türündeki booltuvalin boyutu ve konumu sıfır olup olmadığını gösterir.
  • Left, türündeki floattuvalin sol kenarının x koordinatını temsil eder.
  • Location, türündeki PointFtuvalin sol üst köşesinin koordinatlarını tanımlar.
  • Right, türündeki floattuvalin sağ kenarının x koordinatını temsil eder.
  • Size, türündeki SizeFtuvalin genişliğini ve yüksekliğini tanımlar.
  • Top, türündeki floattuvalin üst kenarının y koordinatını temsil eder.
  • Width, türündeki floattuvalin genişliğini tanımlar.
  • X, türündeki floattuvalin sol üst köşesinin x koordinatını tanımlar.
  • Y, türündeki floattuvalin sol üst köşesinin y koordinatını tanımlar.

Bu özellikler üzerinde grafik nesneleri konumlandırmak ve boyutlandırmak ICanvasiçin kullanılabilir. Örneğin, grafik nesneler ve değerleri bir çizim yönteminde bağımsız değişken olarak kullanılarak Center.XCenter.Y öğesinin Canvas merkezine yerleştirilebilir. üzerinde ICanvasçizim yapma hakkında bilgi için bkz . Grafik nesneleri çizme.

Tuvali geçersiz kılma

GraphicsView tuvale kendisini yeniden çizmesi gerektiğini bildiren bir Invalidate yönteme sahiptir. Bu yöntem bir GraphicsView örnekte çağrılmalıdır:

graphicsView.Invalidate();

.NET MAUI, kullanıcı arabirimi tarafından gerektiğinde öğesini otomatik olarak geçersizleştirir GraphicsView . Örneğin, öğe ilk kez gösterildiğinde, görünüme geldiğinde veya bir öğeyi üzerinden taşıyarak ortaya çıktığında yeniden çizilir. Aramanız Invalidate gereken tek zaman öğesinin kendisini yeniden çizmeye zorlamak GraphicsView istemenizdir. Örneğin, içeriğini hala görünür durumdayken değiştirmiş olmanız gerekir.