다음을 통해 공유


ListView 데이터 원본

A Xamarin.FormsListView 는 데이터 목록을 표시하는 데 사용됩니다. 이 문서에서는 데이터로 채우는 ListView 방법과 선택한 항목에 데이터를 바인딩하는 방법을 설명합니다.

ItemsSource

A ListView 는 구현하는 모든 컬렉션을 허용할 수 있는 속성을 사용하여 ItemsSource 데이터로 채워집니다 IEnumerable. 가장 간단한 채우기 방법은 ListView 문자열 배열을 사용하는 것입니다.

<ListView>
      <ListView.ItemsSource>
          <x:Array Type="{x:Type x:String}">
            <x:String>mono</x:String>
            <x:String>monodroid</x:String>
            <x:String>monotouch</x:String>
            <x:String>monorail</x:String>
            <x:String>monodevelop</x:String>
            <x:String>monotone</x:String>
            <x:String>monopoly</x:String>
            <x:String>monomodal</x:String>
            <x:String>mononucleosis</x:String>
          </x:Array>
      </ListView.ItemsSource>
</ListView>

해당하는 C# 코드는 다음과 같습니다.

var listView = new ListView();
listView.ItemsSource = new string[]
{
  "mono",
  "monodroid",
  "monotouch",
  "monorail",
  "monodevelop",
  "monotone",
  "monopoly",
  "monomodal",
  "mononucleosis"
};

문자열 목록을 표시하는 ListView

이 방법은 문자열 목록으로 채웁 ListView 니다. 기본적으로 ListView 각 행에 TextCell 대한 결과를 호출 ToString 하고 표시합니다. 데이터가 표시되는 방식을 사용자 지정하려면 셀 모양을 참조 하세요.

배열로 전송되었으므로 ItemsSource 기본 목록 또는 배열이 변경되면 콘텐츠가 업데이트되지 않습니다. 기본 목록에서 항목이 추가, 제거 및 변경될 때 ListView가 자동으로 업데이트되도록 하려면 다음을 사용해야 ObservableCollection합니다. ObservableCollection는 다음과 같이 정의 System.Collections.ObjectModel 되며 변경 내용을 알릴 ListView 수 있다는 점을 제외하면 다음과 같습니다List.

ObservableCollection<Employee> employees = new ObservableCollection<Employee>();
listView.ItemsSource = employees;

//Mr. Mono will be added to the ListView because it uses an ObservableCollection
employees.Add(new Employee(){ DisplayName="Mr. Mono"});

데이터 바인딩

데이터 바인딩은 사용자 인터페이스 개체의 속성을 viewmodel의 클래스와 같은 일부 CLR 개체의 속성에 바인딩하는 "glue"입니다. 데이터 바인딩은 지루한 상용구 코드를 많이 대체하여 사용자 인터페이스 개발을 간소화하기 때문에 유용합니다.

데이터 바인딩은 바인딩된 값이 변경됨에 따라 개체를 동기화 상태로 유지하여 작동합니다. 컨트롤의 값이 변경 될 때마다 이벤트 처리기를 작성 하는 대신 바인딩을 설정 하 고 viewmodel에서 바인딩을 사용 하도록 설정 합니다.

데이터 바인딩에 대한 자세한 내용은 XAML 기본 문서 시리즈의 4 Xamarin.Forms 부인 데이터 바인딩 기본 사항을 참조하세요.

셀 바인딩

셀의 속성(및 셀의 자식)은 에 있는 개체의 속성에 ItemsSource바인딩할 수 있습니다. 예를 들어 ListView 직원 목록을 표시하는 데 사용할 수 있습니다.

직원 클래스:

public class Employee
{
    public string DisplayName {get; set;}
}

ObservableCollection<Employee> 만들어지고, 로 설정 ListView ItemsSource되고, 목록이 데이터로 채워집니다.

ObservableCollection<Employee> employees = new ObservableCollection<Employee>();
public ObservableCollection<Employee> Employees { get { return employees; }}

public EmployeeListPage()
{
    EmployeeView.ItemsSource = employees;

    // ObservableCollection allows items to be added after ItemsSource
    // is set and the UI will react to changes
    employees.Add(new Employee{ DisplayName="Rob Finnerty"});
    employees.Add(new Employee{ DisplayName="Bill Wrestler"});
    employees.Add(new Employee{ DisplayName="Dr. Geri-Beth Hooper"});
    employees.Add(new Employee{ DisplayName="Dr. Keith Joyce-Purdy"});
    employees.Add(new Employee{ DisplayName="Sheri Spruce"});
    employees.Add(new Employee{ DisplayName="Burt Indybrick"});
}

Warning

A ListView 는 내부 ObservableCollection변경 내용에 따라 업데이트되지만 다른 ListView ObservableCollection 인스턴스가 원래 ObservableCollection 참조(예: employees = otherObservableCollection;)에 할당된 경우 업데이트되지 않습니다.

다음 코드 조각은 직원 목록에 바인딩된 것을 보여 ListView 줍니다.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:constants="clr-namespace:XamarinFormsSample;assembly=XamarinFormsXamlSample"
             x:Class="XamarinFormsXamlSample.Views.EmployeeListPage"
             Title="Employee List">
  <ListView x:Name="EmployeeView"
            ItemsSource="{Binding Employees}">
    <ListView.ItemTemplate>
      <DataTemplate>
        <TextCell Text="{Binding DisplayName}" />
      </DataTemplate>
    </ListView.ItemTemplate>
  </ListView>
</ContentPage>

이 XAML 예제에서는 ContentPage ListView. ListView의 데이터 원본은 ItemsSource 특성를 통해 설정됩니다. ItemsSource에서 각 행의 레이아웃은 ListView.ItemTemplate 요소 내에 정의됩니다. 그러면 다음 스크린샷이 표시됩니다.

데이터 바인딩을 사용하는 ListView

Warning

ObservableCollection 가 스레드로부터 안전하지 않습니다. 수정하면 ObservableCollection 수정을 수행한 동일한 스레드에서 UI 업데이트가 발생합니다. 스레드가 기본 UI 스레드가 아니면 예외가 발생합니다.

SelectedItem 바인딩

이벤트 처리기를 사용하여 변경 내용에 응답하는 대신 선택한 항목 ListView에 바인딩하는 경우가 많습니다. XAML에서 이 작업을 수행하려면 속성을 바인딩합니다 SelectedItem .

<ListView x:Name="listView"
          SelectedItem="{Binding Source={x:Reference SomeLabel},
          Path=Text}">
 …
</ListView>

's가 문자열 SomeLabel 목록이라고 가정listView하면 해당 Text 속성이 .에 바인딩SelectedItem됩니다.ItemsSource