Xamarin.Forms
CarouselView - 시험판
수색…
비고
CarouselView는 모든 종류의 View를 포함 할 수있는 Xamarin 컨트롤입니다. 이 시험판 컨트롤은 Xamarin Forms 프로젝트에서만 사용할 수 있습니다.
James Montemagno가 제공 한 Xamarin 블로그의 예제에서 CarouselView는 이미지를 표시하는 데 사용됩니다.
현재 CarouselView는 Xamarin.Forms에 통합되어 있지 않습니다. 이것을 프로젝트에서 사용하려면 NuGet-Package를 추가해야합니다 (위의 예 참조).
CarouselView 가져 오기
CarouselView를 가져 오는 가장 쉬운 방법은 Xamarin / Visual 스튜디오에서 NuGet-Packages Manager를 사용하는 것입니다.
시험판 패키지를 사용하려면 왼쪽 모서리에있는 '시험판 패키지 표시'확인란을 선택해야합니다.
각 하위 프로젝트 (.iOS / .droid ./ WinPhone)는이 패키지를 가져와야합니다.
CarouselView를 XAML 페이지로 가져 오기
기본 사항
ContentPage의 제목에 다음 줄을 삽입하십시오.
xmlns:cv="clr-namespace:Xamarin.Forms;assembly=Xamarin.Forms.CarouselView"
<ContentPage.Content> 태그 사이에 CarouselView :
<cv:CarouselView x:Name="DemoCarouselView">
</cv:CarouselView>
x : Name은 CarouselView에 C # 코드 숨김 파일에서 사용할 수있는 이름을 제공합니다. 이것은 CarouselView를 뷰에 통합하기 위해해야 할 기본 사항입니다. 주어진 예제는 CarouselView가 비어 있기 때문에 아무 것도 표시하지 않습니다.
바인드 가능 원본 만들기
ItemSource의 예로, ObservableCollection 문자열을 사용합니다.
public ObservableCollection<TechGiant> TechGiants { get; set; }
TechGiant는 Technology Giants의 이름을 호스트하는 클래스입니다.
public class TechGiant
{
public string Name { get; set; }
public TechGiant(string Name)
{
this.Name = Name;
}
}
페이지의 InitializeComponent 뒤에 ObservableCollection을 만들고 채 웁니다.
TechGiants = new ObservableCollection<TechGiant>();
TechGiants.Add(new TechGiant("Xamarin"));
TechGiants.Add(new TechGiant("Microsoft"));
TechGiants.Add(new TechGiant("Apple"));
TechGiants.Add(new TechGiant("Google"));
마지막으로 TechGiants를 DemoCarouselView의 ItemSource로 설정합니다.
DemoCarouselView.ItemsSource = TechGiants;
DataTemplates
XAML 파일에서 CarouselView에 DataTemplate을 지정합니다.
<cv:CarouselView.ItemTemplate>
</cv:CarouselView.ItemTemplate>
DataTemplate을 정의하십시오. 이 경우, 이것은 itemsource 및 녹색 배경에 바인딩 된 텍스트가있는 Label이됩니다.
<DataTemplate>
<Label Text="{Binding Name}" BackgroundColor="Green"/>
</DataTemplate>
그게 다야! 프로그램을 실행하고 결과를 확인하십시오!