バージョン

XamDataGrid のローカル データ ソースへのバインディング

このトピックでは、XamDataGrid コントロールのローカル データソース バインディングの概念を分かりやすく説明します。

このトピックの内容

このトピックには、以下のセクションがあります。

前提条件

本トピックの理解を深めるために、以下のトピックを参照することをお勧めします。

トピック 目的

このトピックでは、XamDataGrid コントロールをビューに追加してサンプルデータを生成するための基本的な手順を紹介します。

ローカル データ

この例では、各オブジェクトが Number、Name、Days、および Quarter を含むいくつかのプロパティを公開する、Month オブジェクトのシンプルなコレクションを含むローカル データソースの実装を示します。このクラスは、Month オブジェクトと XamDataGrid を生成するために使用する静的メソッドを 1 つ公開します。

C# の場合:

using System.Collections.Generic;

namespace Infragistics.Data
{
    public class MonthsList : List<Month>
    {
        public MonthsList()
        {
            var list = Month.GenerateList();
            this.AddRange(list);
        }
    }
    public class Month
    {
        public Month()
        {
        }
        public string Name { get; set; }
        public int Number { get; set; }
        public int Days { get; set; }
        public string Quarter { get; set; }

        public static List<Month> GenerateList()
        {
            string[] names = {
                "January", "February", "March", "April",
                "May", "June", "July", "August", "September",
                "October", "November", "December"
            };
            int[] days = {
                31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
            };
            var items = new List<Month>();
            for (int i = 0; i < 12; i++)
            {
                Month monthItem = new Month();
                monthItem.Name = names[i];
                monthItem.Days = days[i];
                monthItem.Number = i + 1;
                monthItem.Quarter = "Q" + ((i / 3) + 1);
                items.Add(monthItem);
            }
            return items;
        }
    }
}

データのバインド

  1. プロジェクト内に新しいクラス ファイルを作成し、ファイル名前を Month にします。次にこの新しいクラス ファイルに上記の Month クラスの実装を貼り付け、そのコンテンツを置き換えます。

  1. プロジェクト メイン ビューの XamDataGrid コントロールのインスタンスを作成し、ItemsSource プロパティを使用して、次のサンプル コードに示すようにサンプル データを生成します。

XAML の場合:

xmlns:grids="clr-namespace:Infragistics.XamarinForms.Controls.Grids;assembly=Infragistics.XF.DataGrid"
xmlns:local="clr-namespace:Infragistics.Data;assembly=YourAppName"
...
<grids:XamDataGrid x:Name="DataGrid" AutoGenerateColumns="False" >
    <grids:XamDataGrid.ItemsSource>
        <local:MonthsList />
    </grids:XamDataGrid.ItemsSource>
</grids:XamDataGrid>

C# の場合:

using Infragistics.XamarinForms.Controls.Grids;
using Infragistics.Data;
...
var DataGrid = new XamDataGrid();
DataGrid.AutoGenerateColumns = false;
DataGrid.ItemsSource = Month.GenerateList();
  1. 文字列プロパティのための TextColumn の 2 つのインスタンス、そしてデータ項目の数値プロパティのための NumericColumn の 2 つのインスタンスを作成します。

XAML の場合:

<grids:XamDataGrid.Columns>
    <grids:TextColumn PropertyPath="Quarter" />
    <grids:TextColumn PropertyPath="Name" />
    <grids:NumericColumn PropertyPath="Number" />
    <grids:NumericColumn PropertyPath="Days" />
</grids:XamDataGrid.Columns>

C# の場合:

var column1 = new TextColumn();
column1.PropertyPath = "Quarter";
var column2 = new TextColumn();
column2.PropertyPath = "Name";

var column3 = new NumericColumn();
column3.PropertyPath = "Number";
var column4 = new NumericColumn();
column3.PropertyPath = "Days";

DataGrid.Columns.Add(column1);
DataGrid.Columns.Add(column2);
DataGrid.Columns.Add(column3);
DataGrid.Columns.Add(column4);
  1. アプリケーションを保存、実行して結果を確認します。

アプリケーションには、4 つの Column (Name、Number、Days 、および Quarter) を含む XamDataGrid コントロールが表示され、各列が Month オブジェクトを表す 12 列が生成されます。

Getting started with Databinding 1.png

関連トピック

以下の表は、このトピックに関連するトピックを示します。

トピック 目的

このトピックでは、XamDataGrid コントロールでサポートされる列タイプの情報を提供します。

このトピックでは、XamDataGrid コントロールで列を使用する際のコード例を提供します。

このトピックでは、リモートデータを XamDataGrid コントロールへバインドするコード例を提供します。