あるSEのつぶやき・改

ITやシステム開発などの技術に関する話題を、取り上げたりしています。

Xamarin.FormsのCarouselPageで2ページ目を最初に開く方法

Xamarin.Forms の CarouselPage を2ページ使って、左ページにメニュー、右ページにコンテンツを表示しようと考えてみました。

そうすると、CarouselPage の2ページ目を最初に開く必要があるのですが、意外と簡単にできたのでメモとして残しておきます。

まず、MainPage.xaml を CarouselPage に対応させます。

<?xml version="1.0" encoding="utf-8" ?>
<CarouselPage x:Name="carousel"  xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:Carousel"
             x:Class="Carousel.MainPage">

    <!--1ページ目-->
    <ContentPage>
        <ContentPage.Padding>
            <OnPlatform x:TypeArguments="Thickness">
                <On Platform="iOS" Value="0, 20, 0, 0"></On>
            </OnPlatform>
        </ContentPage.Padding>
        <StackLayout>
            <Label Text="Welcome to Xamarin.Forms!" 
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand" />
        </StackLayout>
    </ContentPage>

    <!--2ページ目-->
    <ContentPage>
        <ContentPage.Padding>
            <OnPlatform x:TypeArguments="Thickness">
                <On Platform="iOS" Value="0, 20, 0, 0"></On>
            </OnPlatform>
        </ContentPage.Padding>
        <StackLayout>
            <Label Text="Welcome to CarouselPage!!" 
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand" />
        </StackLayout>
    </ContentPage>

</CarouselPage>

そして、MainPage.xaml.cs を CarouselPage に対応させ、2ページ目を初期表示するようにします。

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

namespace Carousel
{
    public partial class MainPage : CarouselPage
    {
        public MainPage()
        {
            InitializeComponent();

            //2ページ目を表示
            this.CurrentPage = this.Children[1];
            
        }
    }
}

これだけで、CarouselPage の2ページ目を最初に開くことができるようになります。