このセクションでは、ポータブルアプリケーションまたは共有アプリケーションに ComboBox コントロールを追加し、ユーザーのために候補としてドロップダウンに項目のリストを表示する方法を説明します。

ComboBox コントロールを表示するには、次の手順を実行します。

• 手順 1：ドロップダウンに表示する項目リストの追加
• 手順 2：XAML ページへの ComboBox コントロールの追加
• 手順 3：プロジェクトの実行

次の図は、ユーザーがキー入力するときに入力候補を表示する ComboBox を示します。

手順 1：ドロップダウンに表示する項目リストの追加

ドロップダウンリストに表示する項目のリストを追加するには、次の手順を実行します。

1. 新しいポータブルまたは共有 Xamarin.Forms アプリケーションを作成します（詳細については「新しい Xamarin.Forms アプリの作成」を参照）。
2. 新しいクラス（たとえば States.cs）をアプリケーションに追加します。
3. 次のコードを追加して、項目のコレクションを初期化します（ここでは、米国の主な州のリスト）。

   C#

   コードのコピー

   public class States { public string Name { get; set; } public States(string name) { this.Name = name; } public static List<States> GetStates() { List<States> data = new List<States>(); data.Add(new States("アラバマ")); data.Add(new States("アラスカ")); data.Add(new States("アリゾナ")); data.Add(new States("アーカンソー")); data.Add(new States("カリフォルニア")); data.Add(new States("コロラド")); data.Add(new States("コネティカット")); data.Add(new States("デラウェア")); data.Add(new States("コロンビア特別区")); data.Add(new States("フロリダ")); data.Add(new States("ジョージア")); data.Add(new States("グアム")); data.Add(new States("ハワイ")); data.Add(new States("アイダホ")); data.Add(new States("イリノイ")); data.Add(new States("インディアナ")); data.Add(new States("アイオワ")); data.Add(new States("カンザス")); return data; } }

手順 2：XAML ページへの ComboBox コントロールの追加

1. アプリケーションに新しい Content Page（たとえば Page1.xaml）を追加します。
2. <ContentPage> タグを編集して、必要な 参照を追加します。

   XAML	コードのコピー
   xmlns:c1="clr-namespace:C1.Xamarin.Forms.Input;assembly=C1.Xamarin.Forms.Input"

3. 編集可能な ComboBox コントロールを初期化し、<ContentPage></ContentPage> タグ内の <StackLayout></StackLayout> タグ間に以下のマークアップを追加して、Name、DisplayMemberPath などの基本的なプロパティを設定します。

   XAML	コードのコピー
   <StackLayout> <Label Text="テキストを入力するまたはドロップダウンをタップして選択する" FontSize="25"/> <c1:C1ComboBox x:Name="cbxEdit" IsEditable="True" HorizontalOptions="FillAndExpand" DropDownBackgroundColor="Gray" DisplayMemberPath="Name" VerticalOptions="Start" /> </StackLayout>

4. ソリューションエクスプローラーで Page1.xaml ノードを展開し、Page1.xaml.cs を開きます。コンストラクタに以下のコードを追加して、C1ComboBox クラスの ItemsSource プロパティを設定します。

   C#	コードのコピー
   var array = States.GetStates(); this.cbxEdit.ItemsSource = array;

手順 3：プロジェクトの実行

1. ソリューションエクスプローラーで、App.cs ファイルをダブルクリックして開きます。
2. Content Page を返すには、コンストラクタ App() で MainPage を Page1 に設定します。以下のコードに例を示します。

   C#	コードのコピー
   public App() { // アプリケーションのルートページ MainPage = new Page1(); }

3. iOS および UWP アプリを実行するには、いくつかの追加手順が必要です。
   • iOS アプリ：
     1. ソリューションエクスプローラーで、YourAppName.iOS プロジェクト内の AppDelegate.cs をダブルクリックして開きます。
     2. FinishedLaunching() メソッドに次のコードを追加します。

        C#	コードのコピー
        C1.Xamarin.Forms.Input.Platform.iOS.C1InputRenderer.Init();

   • UWP アプリ：
     1. ソリューションエクスプローラーで、YourAppName.UWP プロジェクトにMainPage.xaml ノードを展開します。
     2. MainPage.xaml.cs をダブルクリックして開き、クラスコンストラクタに次のコードを追加します。

        C#	コードのコピー
        C1.Xamarin.Forms.Input.Platform.UWP.C1InputRenderer.Init();

     3. Release モードで UWP アプリケーションをコンパイルする場合は、アプリケーションに正しいアセンブリを含めるために、App.xaml.cs の OnLaunched メソッドに次のコードを明示的に追加する必要があります。

        C#	コードのコピー
        var assembliesToInclude = new List<Assembly>(); assembliesToInclude.Add(typeof(C1.Xamarin.Forms.Input.Platform.UWP.C1InputRenderer) .GetTypeInfo().Assembly); assembliesToInclude.Add(typeof(C1.UWP.Input.C1InputRenderer).GetTypeInfo().Assembly); Xamarin.Forms.Forms.Init(e, assembliesToInclude);

4. ［F5］を押してプロジェクトを実行します。