.NET MAUI Image Auto Scrolling 하기

.NET MAUI Image Auto Scrolling 하기

 

가로로 긴 이미지를 가로로 자동 스크롤 하는 방법입니다.

 

1. OverFlower Nuget 패키지를 설치합니다.

2. 스크롤할 이미지 구하고 프로젝트에 추가하기

3. 화면에서 OverFlower 컨트롤 사용해서 이미지 처리

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="Maui.OverFloswerTest.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:over="clr-namespace:OverFlower;assembly=OverFlower">

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25"
            VerticalOptions="Center">
            <Label
                FontSize="32"
                HorizontalOptions="Center"
                Text="OverFlower Test"
                VerticalOptions="Center" />
            <Grid HeightRequest="400" WidthRequest="400">
                <over:OverFlower
                    x:Name="DemoOverFlower"
                    ImageHeight="500"
                    ImageSource="testimage.jpg"
                    ImageWidth="500"
                    Reverse="False"
                    ScrollDirection="Left"
                    ScrollDuration="4000" />
            </Grid>

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

4. 결과

* Reverse, SxrollDuration, ScrollDirection 등을 이용하여 이미지 흐르는 방향과 속도등을 조절할 수 있습니다.

[Source]

https://github.com/kei-soft/Maui.OverFlowerTest

GitHub - kei-soft/Maui.OverFlowerTest