■ CarouselView 엘리먼트의 Scrolled 이벤트를 사용하는 방법을 보여준다.
▶ PhotoModel.cs
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
namespace TestProject; /// <summary> /// 사진 모델 /// </summary> public class PhotoModel { //////////////////////////////////////////////////////////////////////////////////////////////////// Property ////////////////////////////////////////////////////////////////////////////////////////// Public #region ID - ID /// <summary> /// ID /// </summary> public string ID { get; set; } #endregion #region 제목 - Title /// <summary> /// 제목 /// </summary> public string Title { get; set; } #endregion #region 이미지 소스 - ImageSource /// <summary> /// 이미지 소스 /// </summary> public ImageSource ImageSource { get; set; } #endregion } |
▶ MainPage.xaml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
<?xml version="1.0" encoding="utf-8" ?> <ContentPage x:Class="TestProject.MainPage" xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:TestProject"> <Grid Margin="10" RowDefinitions="*,2*,*"> <CarouselView x:Name="carouselView" Grid.Row="1" BackgroundColor="Cornsilk"> <CarouselView.ItemTemplate> <DataTemplate> <Grid> <Frame HorizontalOptions="Center" HeightRequest="300" CornerRadius="5" BorderColor="DarkGray" HasShadow="True"> <StackLayout Spacing="10"> <Label HorizontalOptions="Center" FontSize="16" Text="{Binding ID}" /> <Label HorizontalOptions="Center" FontSize="18" FontAttributes="Bold" Text="{Binding Title}" /> <Image HorizontalOptions="Center" WidthRequest="200" HeightRequest="200" Aspect="Fill" Source="{Binding ImageSource}" /> </StackLayout> </Frame> </Grid> </DataTemplate> </CarouselView.ItemTemplate> </CarouselView> </Grid> </ContentPage> |
▶ MainPage.xaml.cs
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
using System.Diagnostics; namespace TestProject; /// <summary> /// 메인 페이지 /// </summary> public partial class MainPage : ContentPage { //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor ////////////////////////////////////////////////////////////////////////////////////////// Public #region 생성자 - MainPage() /// <summary> /// 생성자 /// </summary> public MainPage() { InitializeComponent(); List<PhotoModel> list = new List<PhotoModel>(); list.Add(new PhotoModel { ID = "0001", Title = "풍경1", ImageSource = ImageSource.FromFile("sample1.jpg") }); list.Add(new PhotoModel { ID = "0002", Title = "풍경2", ImageSource = ImageSource.FromFile("sample2.jpg") }); list.Add(new PhotoModel { ID = "0003", Title = "풍경3", ImageSource = ImageSource.FromFile("sample3.jpg") }); list.Add(new PhotoModel { ID = "0004", Title = "풍경4", ImageSource = ImageSource.FromFile("sample4.jpg") }); this.carouselView.ItemsSource = list; this.carouselView.Scrolled += carouselView_Scrolled; } #endregion //////////////////////////////////////////////////////////////////////////////////////////////////// Method ////////////////////////////////////////////////////////////////////////////////////////// Private #region 캐러셀 뷰 스크롤시 처리하기 - carouselView_Scrolled(sender, e) /// <summary> /// 캐러셀 뷰 스크롤시 처리하기 /// </summary> /// <param name="sender">이벤트 발생자</param> /// <param name="e">이벤트 인자</param> private void carouselView_Scrolled(object sender, ItemsViewScrolledEventArgs e) { Debug.WriteLine("HorizontalDelta : " + e.HorizontalDelta ); Debug.WriteLine("VerticalDelta : " + e.VerticalDelta ); Debug.WriteLine("HorizontalOffset : " + e.HorizontalOffset ); Debug.WriteLine("VerticalOffset : " + e.VerticalOffset ); Debug.WriteLine("FirstVisibleItemIndex : " + e.FirstVisibleItemIndex); Debug.WriteLine("CenterItemIndex : " + e.CenterItemIndex ); Debug.WriteLine("LastVisibleItemIndex : " + e.LastVisibleItemIndex ); } #endregion } |
