[C#/MAUI/.NET6] CarouselView 엘리먼트 : RefreshView 객체를 사용해 갱신하기

TestProject.zip

0.26MB

▶ PhotoModel.cs

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
}

 

728x90

 

▶ MainPage.xaml

<?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">
    <Grid
        Margin="10"
        RowDefinitions="*,2*,Auto,*">
        <RefreshView x:Name="refreshView" Grid.Row="1">
            <CarouselView x:Name="carouselView"
                VerticalOptions="Center"
                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>
        </RefreshView>
    </Grid>
</ContentPage>

 

300x250

 

▶ MainPage.xaml.cs

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.refreshView.Refreshing += refreshView_Refreshing;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 갱신 뷰 갱신시 처리하기 - refreshView_Refreshing(sender, e)

    /// <summary>
    /// 갱신 뷰 갱신시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void refreshView_Refreshing(object sender, EventArgs e)
    {
        // 갱신 작업을 한다.

        this.refreshView.IsRefreshing = false;
    }

    #endregion
}