Studio for Xamarinのコンポーネントを組み合わせて利用することで、コンボボックスのドロップダウン部分にカレンダーを表示することができます。ドロップダウンで表示したカレンダーから任意の日付を選択し、その日付をそのコンボボックスの値として取得可能です。




利用するStudio for Xamarinのコンポーネントは、InputとCalendarです。

InputのDropDown コントロールを構成する要素は、ヘッダー部(Header)とドロップダウン部(DropDown)です。


ヘッダー部で値の表示と入力が行われ、ドロップダウン部に選択肢が表示されます。
この例では、ヘッダー部にInputのMaskedEntry コントロールを利用して日付表示、入力に対応させ、ドロップダウン部分にCalendar コントロールを表示させています。


以下のXAMLのコード例に置き換えると
C1DropDown の部分でドロップダウン全体を定義し、
C1DropDown.Headerに C1MaskedEntry 、
C1DropDown.DropDown に C1Calendar
を設定しています。

サンプルコード
XAML（Xamarin.Forms）

<c1:C1DropDown x:Name="dropdown" 
　　　　HorizontalOptions="FillAndExpand" 
　　　　VerticalOptions="Start" 
　　　　BackgroundColor="Transparent" >
　　
　　　　<c1:C1DropDown.Header>
　　　　　　<c1:C1MaskedEntry x:Name="mask" 
　　　　　　Mask="0000/00/00" />
　　　　</c1:C1DropDown.Header>
　　
　　　　<c1:C1DropDown.DropDown>
　　　　　　<calendar:C1Calendar x:Name="calendar" 
　　　　　　　　HorizontalOptions="FillAndExpand" 
　　　　　　　　BackgroundColor="Transparent" 
　　　　　　　　WidthRequest="270" 
　　　　　　　　HeightRequest="270" >
　　　　　　</calendar:C1Calendar>
　　　　</c1:C1DropDown.DropDown>

</c1:C1DropDown>

また、XAMLのコードビハインドには、カレンダーで日付を選択した時のイベント処理が記述されています。

C#（Xamarin.Forms）

using System;
using System.Collections.Generic;

using Xamarin.Forms;
using C1.Xamarin.Forms.Calendar;

namespace C1Xamarin_QuickStart.C1_Input
{
　　public partial class C1InputDropdown : ContentPage
　　{
　　　　public C1InputDropdown()
　　　　{
　　　　　　InitializeComponent();

　　　　　　// カレンダーの選択日付が変更された場合の処理
　　　　　　this.calendar.SelectionChanged += (object sender, CalendarSelectionChangedEventArgs e) =>
　　　　　　{
　　　　　　　　// 選択された日付をコンボボックスのヘッダー部に設定
　　　　　　　　this.mask.Value = calendar.SelectedDate.ToString();
　　　　　　　　// ドロップダウンを閉じる
　　　　　　　　this.dropdown.IsDropDownOpen = false;
　　　　　　};

　　　　}
　　}
}

Studio for Xamarin　＞ 製品ヘルプ　＞ Input：DropDown を使用したカスタム日付ピッカーの作成