Bir ContentPage’i Özelleştirme

ContentPage, tek bir görünüm görüntüleyen ve ekranın büyük bölümünü kaplayan görsel bir öğedir. Bu makalede, geliştiricilerin kendi platforma özgü özelleştirmeleriyle varsayılan yerel işlemeyi geçersiz kılmasını sağlayan ContentPage sayfası için özel işleyicinin nasıl oluşturulacağı gösterilmektedir.

Her Xamarin.Forms denetimin, yerel bir denetimin örneğini oluşturan her platform için eşlik eden işleyicisi vardır. bir ContentPage uygulama tarafından Xamarin.Forms işlendiğinde, iOS'ta PageRenderer sınıfın örneği oluşturulur ve bu da yerel UIViewController bir denetimin örneğini oluşturur. Android platformunda PageRenderer sınıfı bir ViewGroup denetim örneği oluşturur. Evrensel Windows Platformu (UWP) sınıfı PageRenderer bir FrameworkElement denetim örneği oluşturur. Eşlenmeyi denetleen Xamarin.Forms işleyici ve yerel denetim sınıfları hakkında daha fazla bilgi için bkz . oluşturucu Temel Sınıfları ve Yerel Denetimler.

Aşağıdaki diyagramda, bunu uygulayan ve buna karşılık gelen yerel denetimler arasındaki ContentPage ilişki gösterilmektedir:

İşleme işlemi, her platformda bir için özel işleyici oluşturarak platforma özgü özelleştirmeler uygulamak için ContentPage kullanılabilir. Bunu yapma işlemi aşağıdaki gibidir:

1. Sayfa oluşturunXamarin.Forms.
2. sayfasından kullanınXamarin.Forms.
3. Her platformda sayfa için özel işleyici oluşturun .

Her öğe artık canlı kamera akışı ve fotoğraf yakalama olanağı sağlayan bir uygulama uygulamak CameraPage için sırayla tartışılacaktır.

Sayfa Oluşturma Xamarin.Forms

Aşağıdaki XAML kod örneğinde gösterildiği gibi, değiştirilmemiş ContentPage bir proje paylaşılan Xamarin.Forms projeye eklenebilir:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="CustomRenderer.CameraPage">
    <ContentPage.Content>
    </ContentPage.Content>
</ContentPage>

Benzer şekilde, aşağıdaki kod örneğinde gösterildiği gibi için arka planda kod dosyası ContentPage da değiştirilmeden kalmalıdır:

public partial class CameraPage : ContentPage
{
    public CameraPage ()
    {
        // A custom renderer is used to display the camera UI
        InitializeComponent ();
    }
}

Aşağıdaki kod örneği, sayfanın C# dilinde nasıl oluşturulabileceğini gösterir:

public class CameraPageCS : ContentPage
{
    public CameraPageCS ()
    {
    }
}

Her platformda CameraPage canlı kamera akışını görüntülemek için bir örneği kullanılacaktır. Denetimin özelleştirmesi özel işleyicide gerçekleştirilir, bu nedenle sınıfında ek uygulama gerekmez CameraPage .

Sayfayı Xamarin.Forms Kullanma

Boş CameraPage , uygulama tarafından Xamarin.Forms görüntülenmelidir. Bu durum, aşağıdaki kod örneğinde gösterildiği gibi örnekteki bir düğmeye MainPage dokunulduğunda oluşur ve bu düğme yöntemi yürütür OnTakePhotoButtonClicked :

async void OnTakePhotoButtonClicked (object sender, EventArgs e)
{
    await Navigation.PushAsync (new CameraPage ());
}

Bu kod yalnızca özel işleyicilerin CameraPageher platformda sayfanın görünümünü özelleştireceği öğesine gider.

Her Platformda Sayfa oluşturucu oluşturma

Özel işleyici sınıfını oluşturma işlemi aşağıdaki gibidir:

1. sınıfının bir alt sınıfını PageRenderer oluşturun.
2. Yerel sayfayı OnElementChanged işleyen yöntemini geçersiz kılın ve sayfayı özelleştirmek için mantık yazın. yöntemi, OnElementChanged karşılık gelen Xamarin.Forms denetim oluşturulduğunda çağrılır.
3. Sayfayı işlemek için kullanılacağını belirtmek için sayfa işleyici sınıfına Xamarin.Forms bir ExportRenderer öznitelik ekleyin. Bu öznitelik, özel işleyiciyi ile Xamarin.Formskaydetmek için kullanılır.

Not

Her platform projesinde bir sayfa oluşturucu sağlamak isteğe bağlıdır. Sayfa işleyici kaydedilmemişse, sayfa için varsayılan işleyici kullanılır.

Aşağıdaki diyagramda, örnek uygulamadaki her projenin sorumlulukları ve aralarındaki ilişki gösterilmektedir:

Örnek CameraPage , platforma özgü CameraPageRenderer sınıflar tarafından işlenir ve bunların tümü bu platform için sınıfından PageRenderer türetilir. Bu, aşağıdaki ekran görüntülerinde gösterildiği gibi her CameraPage örneğin canlı kamera akışıyla işlenmesine neden olur:

PageRenderer sınıfı, ilgili yerel denetimi işlemek için sayfa oluşturulduğunda çağrılan Xamarin.Forms yöntemini kullanıma sunarOnElementChanged. Bu yöntem ve NewElement özelliklerini içeren OldElement bir ElementChangedEventArgs parametre alır. Bu özellikler, işleyicinin eklendiği öğeyi ve Xamarin.Forms sırasıyla işleyicinin eklendiği öğeyi temsil Xamarin.Forms edilir. Örnek uygulamada OldElement özelliği olur null ve NewElement özelliği örneğe bir başvuru CameraPage içerir.

sınıfındaki OnElementChanged CameraPageRenderer yönteminin geçersiz kılınmış bir sürümü, yerel sayfa özelleştirmesini gerçekleştirebileceğiniz yerdir. İşlenmekte olan Xamarin.Forms sayfa örneğine bir başvuru özelliği aracılığıyla Element elde edilebilir.

Her özel işleyici sınıfı, işleyiciyi ile kaydeden bir ExportRenderer öznitelikle Xamarin.Formsdekore edilmiştir. özniteliği, işlenen sayfanın tür adı ve özel işleyicinin Xamarin.Forms tür adı olmak üzere iki parametre alır. assembly özniteliğinin ön eki, özniteliğin tüm derleme için geçerli olduğunu belirtir.

Aşağıdaki bölümlerde her platform için özel işleyicinin CameraPageRenderer uygulanması açıklanmıştır.

iOS'ta Sayfa oluşturucu oluşturma

Aşağıdaki kod örneği, iOS platformu için sayfa oluşturucuyu gösterir:

[assembly:ExportRenderer (typeof(CameraPage), typeof(CameraPageRenderer))]
namespace CustomRenderer.iOS
{
    public class CameraPageRenderer : PageRenderer
    {
        ...

        protected override void OnElementChanged (VisualElementChangedEventArgs e)
        {
            base.OnElementChanged (e);

            if (e.OldElement != null || Element == null) {
                return;
            }

            try {
                SetupUserInterface ();
                SetupEventHandlers ();
                SetupLiveCameraStream ();
                AuthorizeCameraUse ();
            } catch (Exception ex) {
                System.Diagnostics.Debug.WriteLine (@"            ERROR: ", ex.Message);
            }
        }
        ...
    }
}

Temel sınıfın OnElementChanged yöntemine yapılan çağrı, bir iOS UIViewController denetiminin örneğini oluşturur. Canlı kamera akışı yalnızca işleyicinin mevcut Xamarin.Forms bir öğeye zaten bağlı olmadığı ve özel işleyici tarafından işlenen bir sayfa örneğinin mevcut olması koşuluyla işlenir.

Daha sonra sayfa, kameradan canlı akışı ve fotoğraf yakalama özelliğini sağlamak için API'leri kullanan AVCapture bir dizi yöntemle özelleştirilir.

Android'de Sayfa oluşturucu oluşturma

Aşağıdaki kod örneği, Android platformu için sayfa oluşturucuyu gösterir:

[assembly: ExportRenderer(typeof(CameraPage), typeof(CameraPageRenderer))]
namespace CustomRenderer.Droid
{
    public class CameraPageRenderer : PageRenderer, TextureView.ISurfaceTextureListener
    {
        ...
        public CameraPageRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Page> e)
        {
            base.OnElementChanged(e);

            if (e.OldElement != null || Element == null)
            {
                return;
            }

            try
            {
                SetupUserInterface();
                SetupEventHandlers();
                AddView(view);
            }
            catch (Exception ex)
            {
                System.Diagnostics.Debug.WriteLine(@"            ERROR: ", ex.Message);
            }
        }
        ...
    }
}

Temel sınıfın OnElementChanged yöntemine yapılan çağrı, bir görünüm grubu olan bir Android ViewGroup denetiminin örneğini oluşturur. Canlı kamera akışı yalnızca işleyicinin mevcut Xamarin.Forms bir öğeye zaten bağlı olmadığı ve özel işleyici tarafından işlenen bir sayfa örneğinin mevcut olması koşuluyla işlenir.

Ardından, canlı kamera akışı kullanıcı arabirimini ViewGroupekleme yöntemi çağrılmadan önceAddView, kameradan canlı akışı ve fotoğraf yakalama özelliğini sağlamak için API'yi kullanan Camera bir dizi yöntem çağrılarak sayfa özelleştirilir. Android'de, görünümde ölçü ve düzen işlemleri gerçekleştirmek için yöntemini geçersiz kılmanın OnLayout da gerekli olduğunu unutmayın.

UWP'de Sayfa oluşturucu oluşturma

Aşağıdaki kod örneği, UWP için sayfa oluşturucuyu gösterir:

[assembly: ExportRenderer(typeof(CameraPage), typeof(CameraPageRenderer))]
namespace CustomRenderer.UWP
{
    public class CameraPageRenderer : PageRenderer
    {
        ...
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Page> e)
        {
            base.OnElementChanged(e);

            if (e.OldElement != null || Element == null)
            {
                return;
            }

            try
            {
                ...
                SetupUserInterface();
                SetupBasedOnStateAsync();

                this.Children.Add(page);
            }
            ...
        }

        protected override Size ArrangeOverride(Size finalSize)
        {
            page.Arrange(new Windows.Foundation.Rect(0, 0, finalSize.Width, finalSize.Height));
            return finalSize;
        }
        ...
    }
}

Temel sınıfın OnElementChanged yöntemine yapılan çağrı, sayfanın işlendiği bir FrameworkElement denetimin örneğini oluşturur. Canlı kamera akışı yalnızca işleyicinin mevcut Xamarin.Forms bir öğeye zaten bağlı olmadığı ve özel işleyici tarafından işlenen bir sayfa örneğinin mevcut olması koşuluyla işlenir. Ardından, kameradan canlı akış sağlamak için API'yi kullanan MediaCapture bir dizi yöntem çağrılarak ve özelleştirilmiş sayfa görüntü için koleksiyona eklenmeden Children önce fotoğraf çekebilme özelliği çağrılarak sayfa özelleştirilir.

UWP'de türetilen PageRenderer bir özel işleyici uygulanırken, ArrangeOverride temel işleyici bunlarla ne yapacağını bilmediğinden, sayfa denetimlerini düzenlemek için yöntemi de uygulanmalıdır. Aksi takdirde, boş bir sayfa sonuç verir. Bu nedenle, bu örnekte ArrangeOverride yöntemi örnekte yöntemini Page çağırırArrange.

Not

UWP uygulamasında kameraya erişim sağlayan nesneleri durdurmak ve atmak önemlidir. Bunun yapılmaması, cihazın kamerasına erişmeye çalışan diğer uygulamaları etkileyebilir. Daha fazla bilgi için bkz . Kamera önizlemesini görüntüleme.

Özet

Bu makalede, geliştiricilerin kendi platforma özgü özelleştirmeleriyle varsayılan yerel işlemeyi ContentPage geçersiz kılmasını sağlayan, sayfa için özel işleyicinin nasıl oluşturulacağı gösterilmiştir. A ContentPage , tek bir görünümü görüntüleyen ve ekranın büyük bölümünü kaplayan görsel bir öğedir.