Как мне создать страницу Xamarin, которая может содержать другие страницы?

Question

Я хотел бы написать Xamarin Page класс, который имитирует Pivot контроль, который используется TabbedPage на Windows Phone, но который недоступен на рабочем столе Windows. Поэтому я бы хотел, чтобы на нем было несколько детей Pages, только один из которых будет виден одновременно, а также собственный элемент управления, который позволит пользователю переключаться между дочерними элементами. Как бы я пошел по этому поводу?

Answer 1

Ты смотришь CarouselView именно так. Оно использует FlipView на платформах WinRT и UWP.

Вы можете найти больше информации в блоге Xamarin и Xamarinhelp.com. У них также есть предварительная версия пакета nuget.

Answer 2

Я нашел этот пост в блоге о том, как размещать страницы в представлениях. Исходя из этого, я сделал следующий класс представления:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;

namespace SGB
{
    public class PageView : View
    {
        public PageView()
        {
        }

        public static readonly BindableProperty ContentProperty = BindableProperty.Create<PageView,Page> (s => s.Content, null);

        public Page Content {
            get
            {
                return (Page)GetValue (ContentProperty); 
            }
            set
            { 
                SetValue (ContentProperty, value);
                LayoutContent();
            }
        }

        protected override void OnSizeAllocated(double width, double height)
        {
            base.OnSizeAllocated(width, height);
            LayoutContent();
        }

        private void LayoutContent()
        {
            if (Content != null)
            {
                Content.Layout(new Rectangle(0, 0, Width, Height));
            }
        }
    }
}

и этот класс рендерера:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

using Xamarin.Forms;
using Xamarin.Forms.Platform.WinRT;

using Page = Xamarin.Forms.Page;

using SGB;

[assembly: ExportRenderer(typeof(PageView), typeof(SGB.Windows.PageViewRenderer))]
namespace SGB.Windows
{
    public class PageViewRenderer : ViewRenderer<PageView, FrameworkElement>
    {
        private Page currentPage;
        private FrameworkElement FrameworkElement;

        public PageViewRenderer()
            : base()
        {
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if ((e.PropertyName == "Content") || (e.PropertyName == "Renderer"))
            {
                SetPage(((PageView)Element).Content);
            }
        }

        private void SetPage(Page page)
        {
            if (page == currentPage)
            {
                return;
            }

            if (currentPage != null)
            {
                ((IPageController)page).SendDisappearing();

                currentPage.Parent = null;
            }

            currentPage = page;

            if (page != null)
            {
                var renderer = page.GetOrCreateRenderer();
                FrameworkElement = renderer.ContainerElement;
                SetNativeControl(FrameworkElement);

                page.Parent = FindPage();

                ((IPageController)page).SendAppearing();
            }
        }

        private Page FindPage()
        {
            for (Element element = Element; element != null; element = element.Parent)
            {
                if (element is Page)
                {
                    return (Page)element;
                }
            }

            return null;
        }
    }
}

Теперь у меня есть это, я могу создать ContentPage содержащий PageViewи у меня есть то, что я хочу.

Answer 3

Я думаю, вам придется написать это самостоятельно. Используйте CarouselView, добавьте его в Grid или AbsoluteLayout или RelativeLayout (я имею в виду, поместите его в фоновый режим, чтобы вы могли добавить карусель заголовков поверх него. Или вы можете этого не делать, в этом случае вы просто использовать вертикальный макет стека). Вам также необходимо добавить пользовательский элемент управления для навигации и синхронизировать изменения между каруселью заголовков страниц и каруселью реальных страниц.