InputPanel for UWP
InputPanel と ObservableCollection の連結
データ連結 > InputPanel と ObservableCollection の連結

InputPanel では、通常のコレクションと同様に機能する ObservableCollection を使用してコレクション連結を実装できます。InputPanel を ObservableCollection に連結するには、ObservableCollection<T> クラスを使用して、連結ソースとなるコレクションを取得します。次に、ItemsSource プロパティがこのコレクションを受け取って InputPanel コントロールに連結します。

ObservableCollection<T> クラスを使用してデータ連結を行うには、次の手順を実行します。

  1. アプリケーションの設定
  2. InputPanel 用データソースの作成
  3. ObservableCollection への InputPanel の連結

アプリケーションの設定

  1. UWP アプリケーションを作成します。
  2. アプリケーションに InputPanel コントロールを追加し、「InPanel」 という名前を付けます。
先頭に戻る

InputPanel 用データソースの作成

  1. 新しいクラス Employee をアプリケーションに追加します。
  2. このクラスにデータジェネレータとフィールドを追加します。 
    '' ** フィールド
Private cid As Integer
Private eid As Integer
Private empoccupation As EOccupation
Private firstname As String, lastname As String
Private empfather As String
Private activeemp As Boolean
Private hiredate As DateTime
Private empweight As Double

' ** データジェネレータ
Shared rnd As New Random()
Shared firstNames As String() = "Mao|Ben|Charlie|Fred|Jack|Karl|Larry|Mark".Split("|"c)
Shared lastNames As String() = "Zedong|Cole|Danson|Myers|Paulson|Richards".Split("|"c)
Shared countries As String() = "中国|インド|アメリカ|ブラジル|ロシア|日本".Split("|"c)

    // ** フィールド
int id, cid;
string first, last;
string father;
EOccupation occupation;
bool active;
DateTime hired;
double weight;

// ** データジェネレータ
static Random rnd = new Random();
static string[] firstNames = "Mao|Ben|Charlie|Fred|Jack|Karl|Larry|Mark".Split('|');
static string[] lastNames = "Zedong|Cole|Danson|Myers|Paulson|Richards".Split('|');
static string[] countries = "中国|インド|アメリカ|ブラジル|ロシア|日本".Split('|');
  3. 次のコードを使用してクラスにプロパティを追加します。 
    Public Property ID() As Integer
    Get
        Return eid
    End Get
    Set
        If Value <> eid Then
            eid = Value
        End If
    End Set
End Property
Public ReadOnly Property Country() As String
    Get
        Return countries(cid)
    End Get
End Property

Public Property 国ID() As Integer
    Get
        Return cid
    End Get
    Set
        If Value <> cid AndAlso Value > -1 AndAlso Value < countries.Length Then
            cid = Value
        End If
    End Set
End Property

Public Property 職業() As EOccupation
    Get
        Return empoccupation
    End Get
    Set
        If Value <> empoccupation Then
            empoccupation = Value
        End If
    End Set
End Property

Public Property アクティブ() As Boolean
    Get
        Return activeemp
    End Get
    Set
        If Value <> activeemp Then
            activeemp = Value
        End If
    End Set
End Property

Public Property 名() As String
    Get
        Return firstname
    End Get
    Set
        If Value <> firstname Then
            firstname = Value
        End If
    End Set
End Property

Public Property 姓() As String
    Get
        Return lastname
    End Get
    Set
        If Value <> lastname Then
            lastname = Value
        End If
    End Set
End Property

Public Property 採用() As DateTime
    Get
        Return hiredate
    End Get
    Set
        If Value <> hiredate Then
            hiredate = Value
        End If
    End Set
End Property

Public Property 重量() As Double
    Get
        Return empweight
    End Get
    Set
        If Value <> empweight Then
            empweight = Value
        End If
    End Set
End Property

' 読み取り専用のもの
Public ReadOnly Property 父親名() As String
    Get
        Return empfather
    End Get
End Property

' ** ユーティリティ
Private Shared Function GetString(arr As String()) As String
    Return arr(rnd.[Next](arr.Length))
End Function

' ** 静的値プロバイダ
Public Shared Function GetCountries() As String()
    Return countries
End Function
Public Shared Function GetFirstNames() As String()
    Return firstNames
End Function
Public Shared Function GetLastNames() As String()
    Return lastNames
End Function

    public int ID
{
    get { return id; }
    set
    {
        if (value != id)
        {
            id = value;
        }
    }
}
public string 名前
{
    get { return string.Format("{0} {1}", 名, 姓); }
}

public string 国
{
    get { return countries[cid]; }
}


public int 国ID
{
    get { return cid; }
    set
    {
        if (value != cid && value > -1 && value < countries.Length)
        {
            cid = value;
        }
    }
}


public EOccupation 職業
{
    get
    {
        return occupation;
    }
    set
    {
        if (value != occupation)
        {
            occupation = value;
        }
    }
}



public bool アクティブ
{
    get { return active; }
    set
    {
        if (value != active)
        {
            active = value;
        }
    }
}


public string 名
{
    get { return first; }
    set
    {
        if (value != first)
        {
            first = value;
        }
    }
}


public string 姓
{
    get { return last; }
    set
    {
        if (value != last)
        {
            last = value;
        }
    }
}


public DateTime 採用
{
    get { return hired; }
    set
    {
        if (value != hired)
        {
            hired = value;
        }
    }
}


public double 重量
{
    get { return weight; }
    set
    {
        if (value != weight)
        {
            weight = value;
        }
    }
}

// 読み取り専用のもの
public string 父親名
{
    get { return father; }
}

// ** ユーティリティ
static string GetString(string[] arr)
{
    return arr[rnd.Next(arr.Length)];
}

// ** 静的値プロバイダ
public static string[] GetCountries() { return countries; }
public static string[] GetFirstNames() { return firstNames; }
public static string[] GetLastNames() { return lastNames; }
  4. Employee クラスのコンストラクタを作成し、次のコードを追加します。 
    Private values As Array = [Enum].GetValues(GetType(EOccupation))
Public Sub New(eid As Integer)
    ID = eid
    名 = GetString(firstNames)
    姓 = GetString(lastNames)
    国ID = rnd.[Next]() Mod countries.Length
    職業 = DirectCast(values.GetValue(rnd.[Next] _
                 (values.Length - 1)), EOccupation)
    アクティブ = rnd.NextDouble() >= 0.5
    採用 = DateTime.Today.AddDays(-rnd.[Next](1, 365))
    重量 = 50 + rnd.NextDouble() * 50
    empfather = String.Format("{0} {1}", GetString(firstNames), Last)
End Sub

    Array values = Enum.GetValues(typeof(EOccupation));
public Employee(int id)
{
    ID = id;
    名 = GetString(firstNames);
    姓 = GetString(lastNames);
    国ID = rnd.Next() % countries.Length;
    職業 = (EOccupation)(values.GetValue(rnd.Next
                 (values.Length - 1)));
    アクティブ = rnd.NextDouble() >= .5;
    採用 = DateTime.Today.AddDays(-rnd.Next(1, 365));
    重量 = 50 + rnd.NextDouble() * 50;
    father = string.Format("{0} {1}", GetString(firstNames), 姓);
}
  5. 次のコードを使用して、ObservableCollection<T> クラスのメソッド GetEmployeeList を作成します。 
    ' ** 静的リストプロバイダ
Public Shared Function GetEmployeeList(count As Integer) _
    As ObservableCollection(Of Employee)
    Dim list = New ObservableCollection(Of Employee)()
    For i As Integer = 0 To count - 1
        Dim emp As New Employee(i)
        list.Add(emp)
    Next
    Return list
End Function

    // ** 静的リストプロバイダ
public static ObservableCollection<Employee> GetEmployeeList(int count)
{
    var list = new ObservableCollection<Employee>();
    for (int i = 0; i < count; i++)
    {
        Employee emp = new Employee(i);
        list.Add(emp);
    }
    return list;
}
先頭に戻る

ObservableCollection への InputPanel の連結

  1. 次のコードを追加して、ItemsSource プロパティを使用して InputPanel コントロールをデータと連結します。 
    InPanel.ItemsSource = Employee.GetEmployeeList(50)

    InPanel.ItemsSource = Employee.GetEmployeeList(50);
  2. ［F5］キーを押してアプリケーションを実行します。
先頭に戻る
関連トピック
データ連結
InputPanel と CollectionView の連結

 

 

Copyright © MESCIUS, Inc. All rights reserved.