[C#/WINUI3/.NET8] ItemsWrapGrid 엘리먼트 : ListView 엘리먼트 항목 표시하기

■ ItemsWrapGrid 엘리먼트를 사용해 ListView 엘리먼트에서 항트을 표시하는 방법을 보여준다.

※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다.
※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를 None으로 추가했다.

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8"?>
<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <ListView
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Height="100"
        ScrollViewer.HorizontalScrollMode="Enabled"
        ScrollViewer.HorizontalScrollBarVisibility="Auto"
        ScrollViewer.VerticalScrollMode="Disabled"
        ScrollViewer.VerticalScrollBarVisibility="Hidden">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid />
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <x:String>Apricot</x:String>
        <x:String>Banana</x:String>
        <x:String>Cherry</x:String>
        <x:String>Orange</x:String>
        <x:String>Strawberry</x:String>
    </ListView>
</Page>

<?xml version="1.0" encoding="utf-8"?>

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

<ListView

HorizontalAlignment="Center"

VerticalAlignment="Center"

Height="100"

ScrollViewer.HorizontalScrollMode="Enabled"

ScrollViewer.HorizontalScrollBarVisibility="Auto"

ScrollViewer.VerticalScrollMode="Disabled"

ScrollViewer.VerticalScrollBarVisibility="Hidden">

<ListView.ItemsPanel>

</ItemsPanelTemplate>

</ListView.ItemsPanel>

<x:String>Apricot</x:String>

<x:String>Banana</x:String>

<x:String>Cherry</x:String>

<x:String>Orange</x:String>

<x:String>Strawberry</x:String>

</ListView>

</Page>

TestProject.zip