C#/Xamarin Maui

[.NET MAUI] Image Auto Scrolling 하기

kjun.kr 2023. 2. 19. 23:39
728x90
728x170

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

Contribute to kei-soft/Maui.OverFlowerTest development by creating an account on GitHub.

github.com


728x90
그리드형