MICROSOFT Archives - 19 중 18 번째 페이지

[C#/WINUI3/.NET6] Window 클래스 : 윈도우 제목/크기/위치 설정하기

■ Window 클래스에서 윈도우 제목/크기/위치를 설정하는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

</Window>

▶ MainWindow.xaml.cs


using System;

using Windows.Graphics;

using Microsoft.UI;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            AppWindow appWindow = GetAppWindow(this);

            appWindow.Title = "TestProject"; // 윈도우 제목

            appWindow.Resize(new SizeInt32 { Width = 800, Height = 600 }); // 윈도우 크기

            appWindow.Move(new PointInt32(100, 200)); // 윈도우 위치
        }

        #endregion

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

        #region 앱 윈도우 구하기 - GetAppWindow(window)

        /// <summary>
        /// 앱 윈도우 구하기
        /// </summary>
        /// <param name="window">윈도우</param>
        /// <returns>앱 윈도우</returns>
        private AppWindow GetAppWindow(Window window)
        {
            IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(window);

            WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

            AppWindow appWindow = AppWindow.GetFromWindowId(windowID);

            return appWindow;
        }

        #endregion
    }
}

using System;

using Windows.Graphics;

using Microsoft.UI;

using Microsoft.UI.Windowing;

using Microsoft.UI.Xaml;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

AppWindow appWindow = GetAppWindow(this);

appWindow.Title = "TestProject"; // 윈도우 제목

appWindow.Resize(new SizeInt32 { Width = 800, Height = 600 }); // 윈도우 크기

appWindow.Move(new PointInt32(100, 200)); // 윈도우 위치

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 앱 윈도우 구하기 - GetAppWindow(window)

/// <summary>

/// 앱 윈도우 구하기

/// </summary>

/// <param name="window">윈도우</param>

/// <returns>앱 윈도우</returns>

private AppWindow GetAppWindow(Window window)

{

IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(window);

WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

AppWindow appWindow = AppWindow.GetFromWindowId(windowID);

return appWindow;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] RefreshContainer 클래스 : 커스텀 아이콘 사용하기

■ RefreshContainer 클래스에서 커스텀 아이콘을 사용하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ WindowHelper.cs


using System;
using System.Collections.Generic;
using System.Threading.Tasks;

using Microsoft.UI;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Media;

using Windows.Storage;
using WinRT.Interop;

namespace TestProject
{
    /// <summary>
    /// 윈도우 헬퍼
    /// </summary>
    public class WindowHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 활성 윈도우 리스트
        /// </summary>
        private static List<Window> _activeWindowList = new List<Window>();

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 활성 윈도우 리스트 - ActiveWindowList

        /// <summary>
        /// 활성 윈도우 리스트
        /// </summary>
        public static List<Window> ActiveWindowList
        {
            get
            {
                return _activeWindowList;
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 윈도우 생성하기 - CreateWindow()

        /// <summary>
        /// 윈도우 생성하기
        /// </summary>
        /// <returns>윈도우</returns>
        public static Window CreateWindow()
        {
            Window window = new Window
            {
                SystemBackdrop = new MicaBackdrop()
            };

            TrackWindow(window);

            return window;
        }

        #endregion
        #region 윈도우 추적하기 - TrackWindow(window)

        /// <summary>
        /// 윈도우 추적하기
        /// </summary>
        /// <param name="window">윈도우</param>
        static public void TrackWindow(Window window)
        {
            window.Closed += (sender, e) =>
            {
                _activeWindowList.Remove(window);
            };

            _activeWindowList.Add(window);
        }

        #endregion
        #region 앱 윈도우 구하기 - GetAppWindow(window)

        /// <summary>
        /// 앱 윈도우 구하기
        /// </summary>
        /// <param name="window">윈도우</param>
        /// <returns>앱 윈도우</returns>
        public static AppWindow GetAppWindow(Window window)
        {
            IntPtr windowHandle = WindowNative.GetWindowHandle(window);

            WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

            return AppWindow.GetFromWindowId(windowID);
        }

        #endregion
        #region 윈도우 구하기 - GetWindow(element)

        /// <summary>
        /// 윈도우 구하기
        /// </summary>
        /// <param name="element">UI 엘리먼트</param>
        /// <returns>윈도우</returns>
        public static Window GetWindow(UIElement element)
        {
            if(element.XamlRoot != null)
            {
                foreach(Window window in _activeWindowList)
                {
                    if(element.XamlRoot == window.Content.XamlRoot)
                    {
                        return window;
                    }
                }
            }

            return null;
        }

        #endregion
        #region 래스터화 스케일 구하기 - GetRasterizationScale(element)

        /// <summary>
        /// 래스터화 스케일 구하기
        /// </summary>
        /// <param name="element">UI 엘리먼트</param>
        /// <returns>래스터화 스케일</returns>
        public static double GetRasterizationScale(UIElement element)
        {
            if(element.XamlRoot != null)
            {
                foreach(Window window in _activeWindowList)
                {
                    if(element.XamlRoot == window.Content.XamlRoot)
                    {
                        return element.XamlRoot.RasterizationScale;
                    }
                }
            }

            return 0.0;
        }

        #endregion
        #region 앱 로컬 폴더 구하기 - GetAppLocalFolder()

        /// <summary>
        /// 앱 로컬 폴더 구하기
        /// </summary>
        /// <returns>앱 로컬 폴더</returns>
        public static StorageFolder GetAppLocalFolder()
        {
            StorageFolder storageFolder;

            if(!NativeHelper.IsAppPackaged)
            {
                storageFolder = Task.Run(async () => await StorageFolder.GetFolderFromPathAsync(AppContext.BaseDirectory)).Result;
            }
            else
            {
                storageFolder = ApplicationData.Current.LocalFolder;
            }

            return storageFolder;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

using System;

using System.Collections.Generic;

using System.Threading.Tasks;

using Microsoft.UI;

using Microsoft.UI.Windowing;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Media;

using Windows.Storage;

using WinRT.Interop;

namespace TestProject

{

/// <summary>

/// 윈도우 헬퍼

/// </summary>

public class WindowHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 활성 윈도우 리스트

/// </summary>

private static List<Window> _activeWindowList = new List<Window>();

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 활성 윈도우 리스트 - ActiveWindowList

/// <summary>

/// 활성 윈도우 리스트

/// </summary>

public static List<Window> ActiveWindowList

{

get

{

return _activeWindowList;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 윈도우 생성하기 - CreateWindow()

/// <summary>

/// 윈도우 생성하기

/// </summary>

/// <returns>윈도우</returns>

public static Window CreateWindow()

{

Window window = new Window

{

SystemBackdrop = new MicaBackdrop()

};

TrackWindow(window);

return window;

}

#endregion

#region 윈도우 추적하기 - TrackWindow(window)

/// <summary>

/// 윈도우 추적하기

/// </summary>

/// <param name="window">윈도우</param>

static public void TrackWindow(Window window)

{

window.Closed += (sender, e) =>

{

_activeWindowList.Remove(window);

};

_activeWindowList.Add(window);

}

#endregion

#region 앱 윈도우 구하기 - GetAppWindow(window)

/// <summary>

/// 앱 윈도우 구하기

/// </summary>

/// <param name="window">윈도우</param>

/// <returns>앱 윈도우</returns>

public static AppWindow GetAppWindow(Window window)

{

IntPtr windowHandle = WindowNative.GetWindowHandle(window);

WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

return AppWindow.GetFromWindowId(windowID);

}

#endregion

#region 윈도우 구하기 - GetWindow(element)

/// <summary>

/// 윈도우 구하기

/// </summary>

/// <param name="element">UI 엘리먼트</param>

/// <returns>윈도우</returns>

public static Window GetWindow(UIElement element)

{

if(element.XamlRoot != null)

{

foreach(Window window in _activeWindowList)

{

if(element.XamlRoot == window.Content.XamlRoot)

{

return window;

}

return null;

}

#endregion

#region 래스터화 스케일 구하기 - GetRasterizationScale(element)

/// <summary>

/// 래스터화 스케일 구하기

/// </summary>

/// <param name="element">UI 엘리먼트</param>

/// <returns>래스터화 스케일</returns>

public static double GetRasterizationScale(UIElement element)

{

if(element.XamlRoot != null)

{

foreach(Window window in _activeWindowList)

{

if(element.XamlRoot == window.Content.XamlRoot)

{

return element.XamlRoot.RasterizationScale;

}

return 0.0;

}

#endregion

#region 앱 로컬 폴더 구하기 - GetAppLocalFolder()

/// <summary>

/// 앱 로컬 폴더 구하기

/// </summary>

/// <returns>앱 로컬 폴더</returns>

public static StorageFolder GetAppLocalFolder()

{

StorageFolder storageFolder;

if(!NativeHelper.IsAppPackaged)

{

storageFolder = Task.Run(async () => await StorageFolder.GetFolderFromPathAsync(AppContext.BaseDirectory)).Result;

}

else

{

storageFolder = ApplicationData.Current.LocalFolder;

}

return storageFolder;

}

#endregion

}

▶ ThemeHelper.cs


using System;
using System.Reflection;

using Windows.Storage;

using Microsoft.UI.Xaml;

namespace TestProject
{
    /// <summary>
    /// 테마 헬퍼
    /// </summary>
    public static class ThemeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 선택 앱 테마 키
        /// </summary>
        private const string SelectedAppThemeKey = "SelectedAppTheme";

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 실제 테마 - ActualTheme

        /// <summary>
        /// 실제 테마
        /// </summary>
        public static ElementTheme ActualTheme
        {
            get
            {
                foreach(Window window in WindowHelper.ActiveWindowList)
                {
                    if(window.Content is FrameworkElement rootElement)
                    {
                        if(rootElement.RequestedTheme != ElementTheme.Default)
                        {
                            return rootElement.RequestedTheme;
                        }
                    }
                }

                return GetEnum<ElementTheme>(App.Current.RequestedTheme.ToString());
            }
        }

        #endregion
        #region 루트 테마 - RootTheme

        /// <summary>
        /// 루트 테마
        /// </summary>
        public static ElementTheme RootTheme
        {
            get
            {
                foreach(Window window in WindowHelper.ActiveWindowList)
                {
                    if(window.Content is FrameworkElement rootElement)
                    {
                        return rootElement.RequestedTheme;
                    }
                }

                return ElementTheme.Default;
            }
            set
            {
                foreach(Window window in WindowHelper.ActiveWindowList)
                {
                    if(window.Content is FrameworkElement rootElement)
                    {
                        rootElement.RequestedTheme = value;
                    }
                }

                if(NativeHelper.IsAppPackaged)
                {
                    ApplicationData.Current.LocalSettings.Values[SelectedAppThemeKey] = value.ToString();
                }
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 초기화기 - Initialize()

        /// <summary>
        /// 초기화기
        /// </summary>
        public static void Initialize()
        {
            if(NativeHelper.IsAppPackaged)
            {
                string savedTheme = ApplicationData.Current.LocalSettings.Values[SelectedAppThemeKey]?.ToString();

                if(savedTheme != null)
                {
                    RootTheme = GetEnum<ElementTheme>(savedTheme);
                }
            }
        }

        #endregion
        #region 다크 테마 여부 구하기 - IsDarkTheme()

        /// <summary>
        /// 다크 테마 여부 구하기
        /// </summary>
        /// <returns>다크 테마 여부</returns>
        public static bool IsDarkTheme()
        {
            if(RootTheme == ElementTheme.Default)
            {
                return Application.Current.RequestedTheme == ApplicationTheme.Dark;
            }

            return RootTheme == ElementTheme.Dark;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Private

        #region 열거형 구하기 - GetEnum<TEnum>(text)

        /// <summary>
        /// 열거형 구하기
        /// </summary>
        /// <typeparam name="TEnum">열거형 타입</typeparam>
        /// <param name="text">텍스트</param>
        /// <returns>열거형</returns>
        private static TEnum GetEnum<TEnum>(string text) where TEnum : struct
        {
            if(!typeof(TEnum).GetTypeInfo().IsEnum)
            {
                throw new InvalidOperationException("Generic parameter 'TEnum' must be an enum.");
            }

            return (TEnum)Enum.Parse(typeof(TEnum), text);
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

using System;

using System.Reflection;

using Windows.Storage;

using Microsoft.UI.Xaml;

namespace TestProject

{

/// <summary>

/// 테마 헬퍼

/// </summary>

public static class ThemeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 선택 앱 테마 키

/// </summary>

private const string SelectedAppThemeKey = "SelectedAppTheme";

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 실제 테마 - ActualTheme

/// <summary>

/// 실제 테마

/// </summary>

public static ElementTheme ActualTheme

{

get

{

foreach(Window window in WindowHelper.ActiveWindowList)

{

if(window.Content is FrameworkElement rootElement)

{

if(rootElement.RequestedTheme != ElementTheme.Default)

{

return rootElement.RequestedTheme;

}

return GetEnum<ElementTheme>(App.Current.RequestedTheme.ToString());

}

#endregion

#region 루트 테마 - RootTheme

/// <summary>

/// 루트 테마

/// </summary>

public static ElementTheme RootTheme

{

get

{

foreach(Window window in WindowHelper.ActiveWindowList)

{

if(window.Content is FrameworkElement rootElement)

{

return rootElement.RequestedTheme;

}

return ElementTheme.Default;

}

set

{

foreach(Window window in WindowHelper.ActiveWindowList)

{

if(window.Content is FrameworkElement rootElement)

{

rootElement.RequestedTheme = value;

}

if(NativeHelper.IsAppPackaged)

{

ApplicationData.Current.LocalSettings.Values[SelectedAppThemeKey] = value.ToString();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 초기화기 - Initialize()

/// <summary>

/// 초기화기

/// </summary>

public static void Initialize()

{

if(NativeHelper.IsAppPackaged)

{

string savedTheme = ApplicationData.Current.LocalSettings.Values[SelectedAppThemeKey]?.ToString();

if(savedTheme != null)

{

RootTheme = GetEnum<ElementTheme>(savedTheme);

}

#endregion

#region 다크 테마 여부 구하기 - IsDarkTheme()

/// <summary>

/// 다크 테마 여부 구하기

/// </summary>

/// <returns>다크 테마 여부</returns>

public static bool IsDarkTheme()

{

if(RootTheme == ElementTheme.Default)

{

return Application.Current.RequestedTheme == ApplicationTheme.Dark;

}

return RootTheme == ElementTheme.Dark;

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Private

#region 열거형 구하기 - GetEnum<TEnum>(text)

/// <summary>

/// 열거형 구하기

/// </summary>

/// <typeparam name="TEnum">열거형 타입</typeparam>

/// <param name="text">텍스트</param>

/// <returns>열거형</returns>

private static TEnum GetEnum<TEnum>(string text) where TEnum : struct

{

if(!typeof(TEnum).GetTypeInfo().IsEnum)

{

throw new InvalidOperationException("Generic parameter 'TEnum' must be an enum.");

}

return (TEnum)Enum.Parse(typeof(TEnum), text);

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TestProject">
    <Grid Name="grid"
        Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*"    />
        </Grid.RowDefinitions>
    </Grid>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

Title="TestProject">

<Grid Name="grid"

Margin="10">

<Grid.RowDefinitions>

</Grid.RowDefinitions>

</Grid>

</Window>

▶ MainWindow.xaml.cs

[C#/WINUI3/.NET6] Window 클래스 : AppWindow 객체 구하기

■ Window 클래스를 사용해 AppWindow 객체 구하기 ▶ 예제 코드 (C#)


using System;

using Microsoft.UI;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;

using WinRT.Interop;

#region 앱 윈도우 구하기 - GetAppWindow(window)

/// <summary>
/// 앱 윈도우 구하기
/// </summary>
/// <param name="window">윈도우</param>
/// <returns>앱 윈도우</returns>
public AppWindow GetAppWindow(Window window)
{
    IntPtr windowHandle = WindowNative.GetWindowHandle(window);

    WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

    return AppWindow.GetFromWindowId(windowID);
}

#endregion

using System;

using Microsoft.UI;

using Microsoft.UI.Windowing;

using Microsoft.UI.Xaml;

using WinRT.Interop;

#region 앱 윈도우 구하기 - GetAppWindow(window)

/// <summary>

/// 앱 윈도우 구하기

/// </summary>

/// <param name="window">윈도우</param>

/// <returns>앱 윈도우</returns>

public AppWindow GetAppWindow(Window window)

{

IntPtr windowHandle = WindowNative.GetWindowHandle(window);

WindowId windowID = Win32Interop.GetWindowIdFromWindow(windowHandle);

return AppWindow.GetFromWindowId(windowID);

}

#endregion

[C#/WINUI3/.NET6] RefreshContainer 클래스 : RefreshRequested 이벤트 사용하기

■ RefreshContainer 클래스의 RefreshRequested 이벤트를 사용하는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TestProject">
    <Grid Name="grid"
        Margin="10">
        <RefreshContainer Name="refreshContainer"
            VerticalAlignment="Center"
            HorizontalAlignment="Center">
            <ListView Name="listView"
                BorderThickness="1"
                BorderBrush="{ThemeResource TextControlBorderBrush}" />
        </RefreshContainer>
    </Grid>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

Title="TestProject">

<Grid Name="grid"

Margin="10">

<RefreshContainer Name="refreshContainer"

VerticalAlignment="Center"

HorizontalAlignment="Center">

<ListView Name="listView"

BorderThickness="1"

BorderBrush="{ThemeResource TextControlBorderBrush}" />

</RefreshContainer>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Collections.ObjectModel;

using Microsoft.UI.Dispatching;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

using Windows.Foundation;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 소스 컬렉션
        /// </summary>
        private ObservableCollection<string> sourceCollection = new ObservableCollection<string>();

        /// <summary>
        /// 디스패처 타이머
        /// </summary>
        private DispatcherTimer timer = new DispatcherTimer();

        /// <summary>
        /// 추가 카운트
        /// </summary>
        private int addCount = 0;

        /// <summary>
        /// 리프레쉬 완료 연기
        /// </summary>
        private Deferral refreshCompletionDeferral = null;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.timer.Interval = new TimeSpan(0, 0, 0, 0, 500);

            this.timer.Tick += timer_Tick;

            string sourceList = "AcrylicBrush ColorPicker NavigationView ParallaxView PersonPicture PullToRefreshPage RatingsControl RevealBrush TreeView";

            foreach(string source in sourceList.Split(' '))
            {
                this.sourceCollection.Add(source);
            }

            this.listView.ItemsSource = this.sourceCollection;

            this.refreshContainer.RefreshRequested += refreshContainer_RefreshRequested;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 타이머 틱 처리하기 - timer_Tick(sender, e)

        /// <summary>
        /// 타이머 틱 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void timer_Tick(object sender, object e)
        {
            DispatcherQueue queue = this.refreshContainer.DispatcherQueue;

            if(queue.HasThreadAccess)
            {
                ProcessTimerTick();
            }
            else
            {
                queue.TryEnqueue
                (
                    DispatcherQueuePriority.Normal,
                    () =>
                    {
                        ProcessTimerTick();
                    }
                );
            }
        }

        #endregion
        #region 리프레쉬 컨테이너 리프레쉬 요청시 처리하기 - refreshContainer_RefreshRequested(sender, e)

        /// <summary>
        /// 리프레쉬 컨테이너 리프레쉬 요청시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void refreshContainer_RefreshRequested(RefreshContainer sender, RefreshRequestedEventArgs e)
        {
            this.refreshCompletionDeferral = e.GetDeferral();

            this.timer.Start();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 타이머 틱 처리하기 - ProcessTimerTick()

        /// <summary>
        /// 타이머 틱 처리하기
        /// </summary>
        private void ProcessTimerTick()
        {
            this.sourceCollection.Insert(0, "NewControl " + this.addCount++);

            this.timer.Stop();

            if(this.refreshCompletionDeferral != null)
            {
                this.refreshCompletionDeferral.Complete();

                this.refreshCompletionDeferral.Dispose();

                this.refreshCompletionDeferral = null;
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

using System;

using System.Collections.ObjectModel;

using Microsoft.UI.Dispatching;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

using Windows.Foundation;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 소스 컬렉션

/// </summary>

private ObservableCollection<string> sourceCollection = new ObservableCollection<string>();

/// <summary>

/// 디스패처 타이머

/// </summary>

private DispatcherTimer timer = new DispatcherTimer();

/// <summary>

/// 추가 카운트

/// </summary>

private int addCount = 0;

/// <summary>

/// 리프레쉬 완료 연기

/// </summary>

private Deferral refreshCompletionDeferral = null;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.timer.Interval = new TimeSpan(0, 0, 0, 0, 500);

this.timer.Tick += timer_Tick;

string sourceList = "AcrylicBrush ColorPicker NavigationView ParallaxView PersonPicture PullToRefreshPage RatingsControl RevealBrush TreeView";

foreach(string source in sourceList.Split(' '))

{

this.sourceCollection.Add(source);

}

this.listView.ItemsSource = this.sourceCollection;

this.refreshContainer.RefreshRequested += refreshContainer_RefreshRequested;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 타이머 틱 처리하기 - timer_Tick(sender, e)

/// <summary>

/// 타이머 틱 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void timer_Tick(object sender, object e)

{

DispatcherQueue queue = this.refreshContainer.DispatcherQueue;

if(queue.HasThreadAccess)

{

ProcessTimerTick();

}

else

{

queue.TryEnqueue

(

DispatcherQueuePriority.Normal,

() =>

{

ProcessTimerTick();

}

);

}

#endregion

#region 리프레쉬 컨테이너 리프레쉬 요청시 처리하기 - refreshContainer_RefreshRequested(sender, e)

/// <summary>

/// 리프레쉬 컨테이너 리프레쉬 요청시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void refreshContainer_RefreshRequested(RefreshContainer sender, RefreshRequestedEventArgs e)

{

this.refreshCompletionDeferral = e.GetDeferral();

this.timer.Start();

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 타이머 틱 처리하기 - ProcessTimerTick()

/// <summary>

/// 타이머 틱 처리하기

/// </summary>

private void ProcessTimerTick()

{

this.sourceCollection.Insert(0, "NewControl " + this.addCount++);

this.timer.Stop();

if(this.refreshCompletionDeferral != null)

{

this.refreshCompletionDeferral.Complete();

this.refreshCompletionDeferral.Dispose();

this.refreshCompletionDeferral = null;

}

#endregion

}

※ 터치 스크린이 없어서 테스트를 할 수 없었다.

[C#/WINUI3/.NET6] ListView 엘리먼트 : ItemTemplate 속성을 사용해 이미지 표시하기

■ ListView 엘리먼트의 ItemTemplate 속성을 사용해 이미지를 표시하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",

@"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

@"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Grid Margin="10">
        <Grid.Resources>
            <Style x:Key="BaseTextBlockStyle" TargetType="TextBlock">
                <Setter Property="LineStackingStrategy" Value="MaxHeight"          />
                <Setter Property="TextTrimming"         Value="CharacterEllipsis"  />
                <Setter Property="TextWrapping"         Value="Wrap"               />
                <Setter Property="TextLineBounds"       Value="Full"               />
                <Setter Property="FontFamily"           Value="XamlAutoFontFamily" />
                <Setter Property="FontSize"             Value="14"                 />
                <Setter Property="FontWeight"           Value="SemiBold"           />
            </Style>
        </Grid.Resources>
        <ListView Name="listView"
            BorderThickness="1"
            BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"
            CanDrag="True"
            CanDragItems="True"
            CanReorderItems="True"
            AllowDrop="True">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:CustomDataObject">
                    <Grid Margin="0 10 0 10">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" MinWidth="150" />
                            <ColumnDefinition Width="*"                   />
                        </Grid.ColumnDefinitions>
                        <Image Grid.Column="0"
                            MaxHeight="100"
                            Stretch="Fill"
                            Source="{x:Bind ImageLocation}" />
                        <StackPanel Grid.Column="1"
                            Margin="10 0 0 0">
                            <TextBlock
                                Style="{ThemeResource BaseTextBlockStyle}"
                                HorizontalAlignment="Left"
                                Margin="0 0 0 5"
                                LineHeight="20"
                                FontSize="14"
                                FontWeight="SemiBold"
                                Text="{x:Bind Title}" />
                            <TextBlock Name="descriptionTextBlock"
                                Style="{ThemeResource BodyTextBlockStyle}"
                                Margin="0 0 0 10"
                                Width="350"
                                MaxHeight="60"
                                TextTrimming="CharacterEllipsis"
                                TextWrapping="Wrap"
                                FontFamily="Segoe UI"
                                FontWeight="Normal"
                                Text="{x:Bind Description}"
                                IsTextTrimmedChanged="descriptionTextBlock_IsTextTrimmedChanged" />
                            <StackPanel Orientation="Horizontal">
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Margin="0"
                                    Text="{x:Bind Views}" />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Text=" Views " />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Text=" &#x22C5; " />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Margin="5 0 0 0"
                                    Text="{x:Bind Likes}" />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Text=" Likes" />
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Grid.Resources>

</Style>

</Grid.Resources>

<ListView Name="listView"

BorderThickness="1"

BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"

CanDrag="True"

CanDragItems="True"

CanReorderItems="True"

AllowDrop="True">

<ListView.ItemTemplate>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Image Grid.Column="0"

MaxHeight="100"

Stretch="Fill"

Source="{x:Bind ImageLocation}" />

<StackPanel Grid.Column="1"

Margin="10 0 0 0">

<TextBlock

Style="{ThemeResource BaseTextBlockStyle}"

HorizontalAlignment="Left"

Margin="0 0 0 5"

LineHeight="20"

FontSize="14"

FontWeight="SemiBold"

Text="{x:Bind Title}" />

<TextBlock Name="descriptionTextBlock"

Style="{ThemeResource BodyTextBlockStyle}"

Margin="0 0 0 10"

Width="350"

MaxHeight="60"

TextTrimming="CharacterEllipsis"

TextWrapping="Wrap"

FontFamily="Segoe UI"

FontWeight="Normal"

Text="{x:Bind Description}"

IsTextTrimmedChanged="descriptionTextBlock_IsTextTrimmedChanged" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Margin="0"

Text="{x:Bind Views}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text=" Views " />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text=" ⋅ " />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Margin="5 0 0 0"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text=" Likes" />

</StackPanel>

</Grid>

</DataTemplate>

</ListView.ItemTemplate>

</ListView>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 메시지 번호
        /// </summary>
        private int messageNumber;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.listView.ItemsSource = CustomDataObject.GetCustomDataObjectList();
        }

        #endregion

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

        #region 설명 텍스트 블럭 텍스트 트리밍 트리밍 변경시 처리하기 - descriptionTextBlock_IsTextTrimmedChanged(sender, e)

        /// <summary>
        /// 설명 텍스트 블럭 텍스트 트리밍 트리밍 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void descriptionTextBlock_IsTextTrimmedChanged(TextBlock sender, IsTextTrimmedChangedEventArgs e)
        {
            TextBlock textBlock = sender as TextBlock;

            string text = textBlock.IsTextTrimmed ? textBlock.Text : string.Empty;

            ToolTipService.SetToolTip(textBlock, text);
        }

        #endregion
    }
}

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 메시지 번호

/// </summary>

private int messageNumber;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.listView.ItemsSource = CustomDataObject.GetCustomDataObjectList();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 설명 텍스트 블럭 텍스트 트리밍 트리밍 변경시 처리하기 - descriptionTextBlock_IsTextTrimmedChanged(sender, e)

/// <summary>

/// 설명 텍스트 블럭 텍스트 트리밍 트리밍 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void descriptionTextBlock_IsTextTrimmedChanged(TextBlock sender, IsTextTrimmedChangedEventArgs e)

{

TextBlock textBlock = sender as TextBlock;

string text = textBlock.IsTextTrimmed ? textBlock.Text : string.Empty;

ToolTipService.SetToolTip(textBlock, text);

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ToolTipService 클래스 : SetToolTip 정적 메소드를 사용해 툴팁 설정하기

■ ToolTipService 클래스의 SetToolTip 정적 메소드를 사용해 툴팁을 설정하는 방법을 보여준다. ▶ 예제 코드 (C#)


using Microsoft.UI.Xaml.Controls;

TextBlock textBlock;

...

string text = "툴팁 문자열입니다.";

ToolTipService.SetToolTip(textBlock, text);

using Microsoft.UI.Xaml.Controls;

TextBlock textBlock;

...

string text = "툴팁 문자열입니다.";

ToolTipService.SetToolTip(textBlock, text);

[C#/WINUI3/.NET6] ListView 엘리먼트 : 최근 항목을 맨 아래 추가하기

■ ListView 엘리먼트에서 최근 항목을 맨 아래 추가하는 방법을 보여준다. ▶ Message.cs


using System;

using Microsoft.UI.Xaml;

namespace TestProject
{
    /// <summary>
    /// 메시지
    /// </summary>
    public class Message
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 메시지 텍스트 - MessageText

        /// <summary>
        /// 메시지 텍스트
        /// </summary>
        public string MessageText { get; private set; }

        #endregion
        #region 메시지 시간 - MessageTime

        /// <summary>
        /// 메시지 시간
        /// </summary>
        public DateTime MessageTime { get; private set; }

        #endregion
        #region 메시지 정렬 - MessageAlignment

        /// <summary>
        /// 메시지 정렬
        /// </summary>
        public HorizontalAlignment MessageAlignment { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - Message(messageText, messageTime, messageAlignment)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="messageText">메시지 텍스트</param>
        /// <param name="messageTime">메시지 시간</param>
        /// <param name="messageAlignment">메시지 정렬</param>
        public Message(string messageText, DateTime messageTime, HorizontalAlignment messageAlignment)
        {
            MessageText      = messageText;
            MessageTime      = messageTime;
            MessageAlignment = messageAlignment;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return $"{MessageTime} {MessageText}";
        }

        #endregion
    }
}

using System;

using Microsoft.UI.Xaml;

namespace TestProject

{

/// <summary>

/// 메시지

/// </summary>

public class Message

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 메시지 텍스트 - MessageText

/// <summary>

/// 메시지 텍스트

/// </summary>

public string MessageText { get; private set; }

#endregion

#region 메시지 시간 - MessageTime

/// <summary>

/// 메시지 시간

/// </summary>

public DateTime MessageTime { get; private set; }

#endregion

#region 메시지 정렬 - MessageAlignment

/// <summary>

/// 메시지 정렬

/// </summary>

public HorizontalAlignment MessageAlignment { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - Message(messageText, messageTime, messageAlignment)

/// <summary>

/// 생성자

/// </summary>

/// <param name="messageText">메시지 텍스트</param>

/// <param name="messageTime">메시지 시간</param>

/// <param name="messageAlignment">메시지 정렬</param>

public Message(string messageText, DateTime messageTime, HorizontalAlignment messageAlignment)

{

MessageText = messageText;

MessageTime = messageTime;

MessageAlignment = messageAlignment;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return $"{MessageTime} {MessageText}";

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Grid Name="grid"
        Margin="10">
        <Grid.Resources>
            <DataTemplate x:Key="MessageDataTemplateKey" x:DataType="local:Message">
                <Grid
                    HorizontalAlignment="{x:Bind MessageAlignment}"
                    Margin="5"
                    Height="Auto">
                    <StackPanel
                        Width="350"
                        MinHeight="75"
                        Padding="10 0 0 10"
                        Background="{ThemeResource SystemColorHighlightColor}"
                        CornerRadius="{StaticResource ControlCornerRadius}">
                        <TextBlock
                            Padding="0 10 0 0"
                            Foreground="{ThemeResource SystemColorHighlightTextColor}"
                            FontSize="20"
                            Text="{x:Bind MessageText}" />
                        <TextBlock
                            Padding="0 0 0 10"
                            Foreground="{ThemeResource SystemColorHighlightTextColor}"
                            FontSize="15"
                            Text="{x:Bind MessageTime}" />
                    </StackPanel>
                </Grid>
            </DataTemplate>
        </Grid.Resources>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"   />
            <ColumnDefinition Width="10"  />
            <ColumnDefinition Width="150" />
        </Grid.ColumnDefinitions>
        <ListView Name="listView" Grid.Column="0"
            ItemTemplate="{StaticResource MessageDataTemplateKey}"
            BorderThickness="1"
            BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"
            SelectionMode="None">
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <ItemsStackPanel
                        VerticalAlignment="Bottom"
                        ItemsUpdatingScrollMode="KeepLastItemInView" />
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </ListView.ItemContainerStyle>
        </ListView>
        <StackPanel Grid.Column="2">
            <Button Name="sendMessageButton">
                Send Message
            </Button>
            <Button Name="receiveMessageButton">
                Receive Message
            </Button>
        </StackPanel>
    </Grid>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Grid Name="grid"

Margin="10">

<Grid.Resources>

<Grid

HorizontalAlignment="{x:Bind MessageAlignment}"

Margin="5"

Height="Auto">

<StackPanel

Width="350"

MinHeight="75"

Padding="10 0 0 10"

Background="{ThemeResource SystemColorHighlightColor}"

CornerRadius="{StaticResource ControlCornerRadius}">

<TextBlock

Padding="0 10 0 0"

Foreground="{ThemeResource SystemColorHighlightTextColor}"

FontSize="20"

Text="{x:Bind MessageText}" />

<TextBlock

Padding="0 0 0 10"

Foreground="{ThemeResource SystemColorHighlightTextColor}"

FontSize="15"

Text="{x:Bind MessageTime}" />

</StackPanel>

</Grid>

</DataTemplate>

</Grid.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<ListView Name="listView" Grid.Column="0"

ItemTemplate="{StaticResource MessageDataTemplateKey}"

BorderThickness="1"

BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"

SelectionMode="None">

<ListView.ItemsPanel>

<ItemsStackPanel

VerticalAlignment="Bottom"

ItemsUpdatingScrollMode="KeepLastItemInView" />

</ItemsPanelTemplate>

</ListView.ItemsPanel>

<ListView.ItemContainerStyle>

</Style>

</ListView.ItemContainerStyle>

</ListView>

Send Message

</Button>

Receive Message

</Button>

</StackPanel>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System;

using Microsoft.UI.Xaml;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 메시지 번호
        /// </summary>
        private int messageNumber;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            AddSendMessageItem();

            this.sendMessageButton.Click    += sendMessageButton_Click;
            this.receiveMessageButton.Click += receiveMessageButton_Click;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region Send Message 버튼 클릭시 처리하기 - sendMessageButton_Click(sender, e)

        /// <summary>
        /// Send Message 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void sendMessageButton_Click(object sender, RoutedEventArgs e)
        {
            AddSendMessageItem();
        }

        #endregion
        #region Receive Message 버튼 클릭시 처리하기 - receiveMessageButton_Click(sender, e)

        /// <summary>
        /// Receive Message 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void receiveMessageButton_Click(object sender, RoutedEventArgs e)
        {
            this.listView.Items.Add
            (
                new Message
                (
                    $"Message {++this.messageNumber}",
                    DateTime.Now,
                    HorizontalAlignment.Left
                )
            );
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region Send Message 항목 추가하기 - AddSendMessageItem()

        /// <summary>
        /// Send Message 항목 추가하기
        /// </summary>
        private void AddSendMessageItem()
        {
            this.listView.Items.Add
            (
                new Message
                (
                    $"Message {++this.messageNumber}",
                    DateTime.Now,
                    HorizontalAlignment.Right
                )
            );
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

using System;

using Microsoft.UI.Xaml;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 메시지 번호

/// </summary>

private int messageNumber;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

AddSendMessageItem();

this.sendMessageButton.Click += sendMessageButton_Click;

this.receiveMessageButton.Click += receiveMessageButton_Click;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region Send Message 버튼 클릭시 처리하기 - sendMessageButton_Click(sender, e)

/// <summary>

/// Send Message 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void sendMessageButton_Click(object sender, RoutedEventArgs e)

{

AddSendMessageItem();

}

#endregion

#region Receive Message 버튼 클릭시 처리하기 - receiveMessageButton_Click(sender, e)

/// <summary>

/// Receive Message 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void receiveMessageButton_Click(object sender, RoutedEventArgs e)

{

this.listView.Items.Add

(

new Message

(

$"Message {++this.messageNumber}",

DateTime.Now,

HorizontalAlignment.Left

)

);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region Send Message 항목 추가하기 - AddSendMessageItem()

/// <summary>

/// Send Message 항목 추가하기

/// </summary>

private void AddSendMessageItem()

{

this.listView.Items.Add

(

new Message

(

$"Message {++this.messageNumber}",

DateTime.Now,

HorizontalAlignment.Right

)

);

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ListView 클래스 : 필터 처리하기

■ ListView 클래스에서 필터 처리하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ FileLoader.cs


using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 파일 로더
    /// </summary>
    public class FileLoader
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 텍스트 로드하기 - LoadText(relativeFilePath)

        /// <summary>
        /// 텍스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>텍스트</returns>
        public static async Task<string> LoadText(string relativeFilePath)
        {
            StorageFile storageFile = null;

            if(!NativeHelper.IsAppPackaged)
            {
                string entryAssemblyFilePath     = Assembly.GetEntryAssembly().Location;
                string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);
                string filePath                  = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);
                string finalFilePath             = Path.GetFullPath(filePath);

                storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);
            }
            else
            {
                Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

                storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);
            }

            return await FileIO.ReadTextAsync(storageFile);
        }

        #endregion
        #region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

        /// <summary>
        /// 라인 리스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>라인 리스트</returns>
        public static async Task<IList<string>> LoadLineList(string relativeFilePath)
        {
            string text = await LoadText(relativeFilePath);

            return text.Split(Environment.NewLine).ToList();
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Reflection;

using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 파일 로더

/// </summary>

public class FileLoader

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 텍스트 로드하기 - LoadText(relativeFilePath)

/// <summary>

/// 텍스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>텍스트</returns>

public static async Task<string> LoadText(string relativeFilePath)

{

StorageFile storageFile = null;

if(!NativeHelper.IsAppPackaged)

{

string entryAssemblyFilePath = Assembly.GetEntryAssembly().Location;

string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);

string filePath = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);

string finalFilePath = Path.GetFullPath(filePath);

storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);

}

else

{

Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);

}

return await FileIO.ReadTextAsync(storageFile);

}

#endregion

#region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

/// <summary>

/// 라인 리스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>라인 리스트</returns>

public static async Task<IList<string>> LoadLineList(string relativeFilePath)

{

string text = await LoadText(relativeFilePath);

return text.Split(Environment.NewLine).ToList();

}

#endregion

}

▶ GroupInfoList.cs


using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 그룹 정보 리스트
    /// </summary>
    public class GroupInfoList : List<object>
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 키 - Key

        /// <summary>
        /// 키
        /// </summary>
        public object Key { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - GroupInfoList(itemEnumerable)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="itemEnumerable">항목 열거 가능형</param>
        public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns></returns>
        public override string ToString()
        {
            return $"Group {Key}";
        }

        #endregion
    }
}

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 그룹 정보 리스트

/// </summary>

public class GroupInfoList : List<object>

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 키 - Key

/// <summary>

/// 키

/// </summary>

public object Key { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - GroupInfoList(itemEnumerable)

/// <summary>

/// 생성자

/// </summary>

/// <param name="itemEnumerable">항목 열거 가능형</param>

public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns></returns>

public override string ToString()

{

return $"Group {Key}";

}

#endregion

}

▶ Contact.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Threading.Tasks;

namespace TestProject
{
    /// <summary>
    /// 연락처
    /// </summary>
    public class Contact
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 이름 - FirstName

        /// <summary>
        /// 이름
        /// </summary>
        public string FirstName { get; private set; }

        #endregion
        #region 성 - LastName

        /// <summary>
        /// 성
        /// </summary>
        public string LastName { get; private set; }

        #endregion
        #region 회사 - Company

        /// <summary>
        /// 회사
        /// </summary>
        public string Company { get; private set; }

        #endregion
        #region 성명 - Name

        /// <summary>
        /// 성명
        /// </summary>
        public string Name => $"{FirstName} {LastName}";

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - Contact(firstName, lastName, company)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="firstName">이름</param>
        /// <param name="lastName">성</param>
        /// <param name="company">회사</param>
        public Contact(string firstName, string lastName, string company)
        {
            FirstName = firstName;
            LastName  = lastName;
            Company   = company;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

        /// <summary>
        /// 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>연락처 컬렉션 태스크</returns>
        public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()
        {
            IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

            ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

            for(int i = 0; i < lineList.Count - 2; i += 3)
            {
                contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));
            }

            return contactCollection;
        }

        #endregion
        #region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

        /// <summary>
        /// 그룹 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>그룹 연락처 컬렉션 태스크</returns>
        public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()
        {
            var query = from item in await GetContactCollectionAsync()
                        group item by item.LastName.Substring(0, 1).ToUpper() into g
                        orderby g.Key
                        select new GroupInfoList(g) { Key = g.Key };

            return new ObservableCollection<GroupInfoList>(query);
        }

        #endregion
        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return Name;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Linq;

using System.Threading.Tasks;

namespace TestProject

{

/// <summary>

/// 연락처

/// </summary>

public class Contact

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 이름 - FirstName

/// <summary>

/// 이름

/// </summary>

public string FirstName { get; private set; }

#endregion

#region 성 - LastName

/// <summary>

/// 성

/// </summary>

public string LastName { get; private set; }

#endregion

#region 회사 - Company

/// <summary>

/// 회사

/// </summary>

public string Company { get; private set; }

#endregion

#region 성명 - Name

/// <summary>

/// 성명

/// </summary>

public string Name => $"{FirstName} {LastName}";

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - Contact(firstName, lastName, company)

/// <summary>

/// 생성자

/// </summary>

/// <param name="firstName">이름</param>

/// <param name="lastName">성</param>

/// <param name="company">회사</param>

public Contact(string firstName, string lastName, string company)

{

FirstName = firstName;

LastName = lastName;

Company = company;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

/// <summary>

/// 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>연락처 컬렉션 태스크</returns>

public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()

{

IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

for(int i = 0; i < lineList.Count - 2; i += 3)

{

contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));

}

return contactCollection;

}

#endregion

#region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

/// <summary>

/// 그룹 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>그룹 연락처 컬렉션 태스크</returns>

public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()

{

var query = from item in await GetContactCollectionAsync()

group item by item.LastName.Substring(0, 1).ToUpper() into g

orderby g.Key

select new GroupInfoList(g) { Key = g.Key };

return new ObservableCollection<GroupInfoList>(query);

}

#endregion

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return Name;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Grid Name="grid"
        Margin="10">
        <Grid.Resources>
            <Style x:Key="TextBlockStyleKey" TargetType="TextBlock">
                <Setter Property="LineStackingStrategy" Value="MaxHeight"          />
                <Setter Property="TextTrimming"         Value="CharacterEllipsis"  />
                <Setter Property="TextWrapping"         Value="Wrap"               />
                <Setter Property="TextLineBounds"       Value="Full"               />
                <Setter Property="FontFamily"           Value="XamlAutoFontFamily" />
                <Setter Property="FontSize"             Value="14"                 />
                <Setter Property="FontWeight"           Value="SemiBold"           />
            </Style>
            <DataTemplate x:Key="ListViewDataTemplateKey" x:DataType="local:Contact">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*"    />
                    </Grid.ColumnDefinitions>
                    <Ellipse x:Name="Ellipse" Grid.Row="0" Grid.RowSpan="2" Grid.Column="0"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Margin="5"
                        Width ="32"
                        Height="32"
                        Fill="{ThemeResource SystemControlBackgroundBaseMediumBrush}" />
                    <TextBlock Grid.Row="0" Grid.Column="1"
                        Style="{ThemeResource TextBlockStyleKey}"
                        Margin="10 5 0 0"
                        x:Phase="1"
                        Text="{x:Bind Name}" />
                    <TextBlock Grid.Row="1" Grid.Column="1"
                        Style="{ThemeResource BodyTextBlockStyle}"
                        Margin="10 0 0 5"
                        x:Phase="2"
                        Text="{x:Bind Company}" />
                </Grid>
            </DataTemplate>
        </Grid.Resources>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"   />
            <ColumnDefinition Width="10"  />
            <ColumnDefinition Width="200" />
        </Grid.ColumnDefinitions>
        <ListView x:Name="listView" Grid.Column="0"
            ItemTemplate="{StaticResource ListViewDataTemplateKey}"
            BorderThickness="1"
            BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"
            SelectionMode="Single"
            ShowsScrollingPlaceholders="True" />
        <StackPanel Grid.Column="2">
            <TextBlock Style="{ThemeResource TextBlockStyleKey}">Filter by...</TextBlock>
            <TextBox Name="firstNameFilterTextBox"
                HorizontalAlignment="Stretch"
                Margin="0 10 0 0"
                Header="First name" />
            <TextBox Name="lastNameFilterTextBox"
                HorizontalAlignment="Stretch"
                Margin="0 10 0 0"
                Header="Last name" />
            <TextBox Name="companyFilterTextBox"
                HorizontalAlignment="Stretch"
                Margin="0 10 0 0"
                Header="Company" />
        </StackPanel>
    </Grid>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Grid Name="grid"

Margin="10">

<Grid.Resources>

</Style>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Ellipse x:Name="Ellipse" Grid.Row="0" Grid.RowSpan="2" Grid.Column="0"

HorizontalAlignment="Center"

VerticalAlignment="Center"

Margin="5"

Width ="32"

Height="32"

Fill="{ThemeResource SystemControlBackgroundBaseMediumBrush}" />

<TextBlock Grid.Row="0" Grid.Column="1"

Style="{ThemeResource TextBlockStyleKey}"

Margin="10 5 0 0"

x:Phase="1"

Text="{x:Bind Name}" />

<TextBlock Grid.Row="1" Grid.Column="1"

Style="{ThemeResource BodyTextBlockStyle}"

Margin="10 0 0 5"

x:Phase="2"

Text="{x:Bind Company}" />

</Grid>

</DataTemplate>

</Grid.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<ListView x:Name="listView" Grid.Column="0"

ItemTemplate="{StaticResource ListViewDataTemplateKey}"

BorderThickness="1"

BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"

SelectionMode="Single"

ShowsScrollingPlaceholders="True" />

<TextBlock Style="{ThemeResource TextBlockStyleKey}">Filter by...</TextBlock>

<TextBox Name="firstNameFilterTextBox"

HorizontalAlignment="Stretch"

Margin="0 10 0 0"

Header="First name" />

<TextBox Name="lastNameFilterTextBox"

HorizontalAlignment="Stretch"

Margin="0 10 0 0"

Header="Last name" />

<TextBox Name="companyFilterTextBox"

HorizontalAlignment="Stretch"

Margin="0 10 0 0"

Header="Company" />

</StackPanel>

</Grid>

</Window>

[C#/WINUI3/.NET6] ListView 엘리먼트 : GroupStyle 속성을 사용해 그룹 헤더 표시하기

■ ListView 엘리먼트의 GroupStyle 속성을 사용해 그룹 헤더를 표시하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ FileLoader.cs


using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 파일 로더
    /// </summary>
    public class FileLoader
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 텍스트 로드하기 - LoadText(relativeFilePath)

        /// <summary>
        /// 텍스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>텍스트</returns>
        public static async Task<string> LoadText(string relativeFilePath)
        {
            StorageFile storageFile = null;

            if(!NativeHelper.IsAppPackaged)
            {
                string entryAssemblyFilePath     = Assembly.GetEntryAssembly().Location;
                string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);
                string filePath                  = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);
                string finalFilePath             = Path.GetFullPath(filePath);

                storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);
            }
            else
            {
                Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

                storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);
            }

            return await FileIO.ReadTextAsync(storageFile);
        }

        #endregion
        #region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

        /// <summary>
        /// 라인 리스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>라인 리스트</returns>
        public static async Task<IList<string>> LoadLineList(string relativeFilePath)
        {
            string text = await LoadText(relativeFilePath);

            return text.Split(Environment.NewLine).ToList();
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Reflection;

using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 파일 로더

/// </summary>

public class FileLoader

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 텍스트 로드하기 - LoadText(relativeFilePath)

/// <summary>

/// 텍스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>텍스트</returns>

public static async Task<string> LoadText(string relativeFilePath)

{

StorageFile storageFile = null;

if(!NativeHelper.IsAppPackaged)

{

string entryAssemblyFilePath = Assembly.GetEntryAssembly().Location;

string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);

string filePath = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);

string finalFilePath = Path.GetFullPath(filePath);

storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);

}

else

{

Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);

}

return await FileIO.ReadTextAsync(storageFile);

}

#endregion

#region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

/// <summary>

/// 라인 리스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>라인 리스트</returns>

public static async Task<IList<string>> LoadLineList(string relativeFilePath)

{

string text = await LoadText(relativeFilePath);

return text.Split(Environment.NewLine).ToList();

}

#endregion

}

▶ GroupInfoList.cs


using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 그룹 정보 리스트
    /// </summary>
    public class GroupInfoList : List<object>
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 키 - Key

        /// <summary>
        /// 키
        /// </summary>
        public object Key { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - GroupInfoList(itemEnumerable)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="itemEnumerable">항목 열거 가능형</param>
        public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns></returns>
        public override string ToString()
        {
            return $"Group {Key}";
        }

        #endregion
    }
}

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 그룹 정보 리스트

/// </summary>

public class GroupInfoList : List<object>

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 키 - Key

/// <summary>

/// 키

/// </summary>

public object Key { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - GroupInfoList(itemEnumerable)

/// <summary>

/// 생성자

/// </summary>

/// <param name="itemEnumerable">항목 열거 가능형</param>

public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns></returns>

public override string ToString()

{

return $"Group {Key}";

}

#endregion

}

▶ Contact.cs

[C#/WINUI3/.NET6] ListView 클래스 : DragItemsStarting/DragEnter/DragOver/Drop 이벤트를 사용해 드래그 드롭 처리하기

■ ListView 클래스의 DragItemsStarting/DragEnter/DragOver/Drop 이벤트를 사용해 드래그 드롭을 처리하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ FileLoader.cs


using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 파일 로더
    /// </summary>
    public class FileLoader
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 텍스트 로드하기 - LoadText(relativeFilePath)

        /// <summary>
        /// 텍스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>텍스트</returns>
        public static async Task<string> LoadText(string relativeFilePath)
        {
            StorageFile storageFile = null;

            if(!NativeHelper.IsAppPackaged)
            {
                string entryAssemblyFilePath     = Assembly.GetEntryAssembly().Location;
                string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);
                string filePath                  = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);
                string finalFilePath             = Path.GetFullPath(filePath);

                storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);
            }
            else
            {
                Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

                storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);
            }

            return await FileIO.ReadTextAsync(storageFile);
        }

        #endregion
        #region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

        /// <summary>
        /// 라인 리스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>라인 리스트</returns>
        public static async Task<IList<string>> LoadLineList(string relativeFilePath)
        {
            string text = await LoadText(relativeFilePath);

            return text.Split(Environment.NewLine).ToList();
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Reflection;

using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 파일 로더

/// </summary>

public class FileLoader

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 텍스트 로드하기 - LoadText(relativeFilePath)

/// <summary>

/// 텍스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>텍스트</returns>

public static async Task<string> LoadText(string relativeFilePath)

{

StorageFile storageFile = null;

if(!NativeHelper.IsAppPackaged)

{

string entryAssemblyFilePath = Assembly.GetEntryAssembly().Location;

string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);

string filePath = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);

string finalFilePath = Path.GetFullPath(filePath);

storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);

}

else

{

Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);

}

return await FileIO.ReadTextAsync(storageFile);

}

#endregion

#region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

/// <summary>

/// 라인 리스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>라인 리스트</returns>

public static async Task<IList<string>> LoadLineList(string relativeFilePath)

{

string text = await LoadText(relativeFilePath);

return text.Split(Environment.NewLine).ToList();

}

#endregion

}

▶ GroupInfoList.cs


using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 그룹 정보 리스트
    /// </summary>
    public class GroupInfoList : List<object>
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 키 - Key

        /// <summary>
        /// 키
        /// </summary>
        public object Key { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - GroupInfoList(itemEnumerable)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="itemEnumerable">항목 열거 가능형</param>
        public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns></returns>
        public override string ToString()
        {
            return $"Group {Key}";
        }

        #endregion
    }
}

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 그룹 정보 리스트

/// </summary>

public class GroupInfoList : List<object>

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 키 - Key

/// <summary>

/// 키

/// </summary>

public object Key { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - GroupInfoList(itemEnumerable)

/// <summary>

/// 생성자

/// </summary>

/// <param name="itemEnumerable">항목 열거 가능형</param>

public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns></returns>

public override string ToString()

{

return $"Group {Key}";

}

#endregion

}

▶ Contact.cs

[C#/WINUI3/.NET6] ListView 클래스 : SelectionMode 속성 사용하기

■ ListView 클래스의 SelectionMode 속성을 사용하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ FileLoader.cs


using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 파일 로더
    /// </summary>
    public class FileLoader
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 텍스트 로드하기 - LoadText(relativeFilePath)

        /// <summary>
        /// 텍스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>텍스트</returns>
        public static async Task<string> LoadText(string relativeFilePath)
        {
            StorageFile storageFile = null;

            if(!NativeHelper.IsAppPackaged)
            {
                string entryAssemblyFilePath     = Assembly.GetEntryAssembly().Location;
                string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);
                string filePath                  = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);
                string finalFilePath             = Path.GetFullPath(filePath);

                storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);
            }
            else
            {
                Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

                storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);
            }

            return await FileIO.ReadTextAsync(storageFile);
        }

        #endregion
        #region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

        /// <summary>
        /// 라인 리스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>라인 리스트</returns>
        public static async Task<IList<string>> LoadLineList(string relativeFilePath)
        {
            string text = await LoadText(relativeFilePath);

            return text.Split(Environment.NewLine).ToList();
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Reflection;

using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 파일 로더

/// </summary>

public class FileLoader

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 텍스트 로드하기 - LoadText(relativeFilePath)

/// <summary>

/// 텍스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>텍스트</returns>

public static async Task<string> LoadText(string relativeFilePath)

{

StorageFile storageFile = null;

if(!NativeHelper.IsAppPackaged)

{

string entryAssemblyFilePath = Assembly.GetEntryAssembly().Location;

string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);

string filePath = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);

string finalFilePath = Path.GetFullPath(filePath);

storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);

}

else

{

Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);

}

return await FileIO.ReadTextAsync(storageFile);

}

#endregion

#region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

/// <summary>

/// 라인 리스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>라인 리스트</returns>

public static async Task<IList<string>> LoadLineList(string relativeFilePath)

{

string text = await LoadText(relativeFilePath);

return text.Split(Environment.NewLine).ToList();

}

#endregion

}

▶ GroupInfoList.cs


using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 그룹 정보 리스트
    /// </summary>
    public class GroupInfoList : List<object>
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 키 - Key

        /// <summary>
        /// 키
        /// </summary>
        public object Key { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - GroupInfoList(itemEnumerable)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="itemEnumerable">항목 열거 가능형</param>
        public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns></returns>
        public override string ToString()
        {
            return $"Group {Key}";
        }

        #endregion
    }
}

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 그룹 정보 리스트

/// </summary>

public class GroupInfoList : List<object>

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 키 - Key

/// <summary>

/// 키

/// </summary>

public object Key { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - GroupInfoList(itemEnumerable)

/// <summary>

/// 생성자

/// </summary>

/// <param name="itemEnumerable">항목 열거 가능형</param>

public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns></returns>

public override string ToString()

{

return $"Group {Key}";

}

#endregion

}

▶ Contact.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Threading.Tasks;

namespace TestProject
{
    /// <summary>
    /// 연락처
    /// </summary>
    public class Contact
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 이름 - FirstName

        /// <summary>
        /// 이름
        /// </summary>
        public string FirstName { get; private set; }

        #endregion
        #region 성 - LastName

        /// <summary>
        /// 성
        /// </summary>
        public string LastName { get; private set; }

        #endregion
        #region 회사 - Company

        /// <summary>
        /// 회사
        /// </summary>
        public string Company { get; private set; }

        #endregion
        #region 성명 - Name

        /// <summary>
        /// 성명
        /// </summary>
        public string Name => $"{FirstName} {LastName}";

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - Contact(firstName, lastName, company)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="firstName">이름</param>
        /// <param name="lastName">성</param>
        /// <param name="company">회사</param>
        public Contact(string firstName, string lastName, string company)
        {
            FirstName = firstName;
            LastName  = lastName;
            Company   = company;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

        /// <summary>
        /// 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>연락처 컬렉션 태스크</returns>
        public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()
        {
            IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

            ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

            for(int i = 0; i < lineList.Count - 2; i += 3)
            {
                contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));
            }

            return contactCollection;
        }

        #endregion
        #region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

        /// <summary>
        /// 그룹 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>그룹 연락처 컬렉션 태스크</returns>
        public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()
        {
            var query = from item in await GetContactCollectionAsync()
                        group item by item.LastName.Substring(0, 1).ToUpper() into g
                        orderby g.Key
                        select new GroupInfoList(g) { Key = g.Key };

            return new ObservableCollection<GroupInfoList>(query);
        }

        #endregion
        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return Name;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Linq;

using System.Threading.Tasks;

namespace TestProject

{

/// <summary>

/// 연락처

/// </summary>

public class Contact

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 이름 - FirstName

/// <summary>

/// 이름

/// </summary>

public string FirstName { get; private set; }

#endregion

#region 성 - LastName

/// <summary>

/// 성

/// </summary>

public string LastName { get; private set; }

#endregion

#region 회사 - Company

/// <summary>

/// 회사

/// </summary>

public string Company { get; private set; }

#endregion

#region 성명 - Name

/// <summary>

/// 성명

/// </summary>

public string Name => $"{FirstName} {LastName}";

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - Contact(firstName, lastName, company)

/// <summary>

/// 생성자

/// </summary>

/// <param name="firstName">이름</param>

/// <param name="lastName">성</param>

/// <param name="company">회사</param>

public Contact(string firstName, string lastName, string company)

{

FirstName = firstName;

LastName = lastName;

Company = company;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

/// <summary>

/// 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>연락처 컬렉션 태스크</returns>

public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()

{

IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

for(int i = 0; i < lineList.Count - 2; i += 3)

{

contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));

}

return contactCollection;

}

#endregion

#region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

/// <summary>

/// 그룹 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>그룹 연락처 컬렉션 태스크</returns>

public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()

{

var query = from item in await GetContactCollectionAsync()

group item by item.LastName.Substring(0, 1).ToUpper() into g

orderby g.Key

select new GroupInfoList(g) { Key = g.Key };

return new ObservableCollection<GroupInfoList>(query);

}

#endregion

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return Name;

}

#endregion

}

▶ MainWindow.xaml

[C#/WINUI3/.NET6] ListView 클래스 : ItemsSource 속성 사용하기

■ ListView 클래스의 ItemsSource 속성을 사용하는 방법을 보여준다. ▶ NativeHelper.cs


using System.Runtime.InteropServices;

namespace TestProject
{
    /// <summary>
    /// 네이티브 헬퍼
    /// </summary>
    public class NativeHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Import
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

        /// <summary>
        /// 현재 패키지 ID 구하기
        /// </summary>
        /// <param name="bufferLength">버퍼 길이</param>
        /// <param name="buffer">버퍼</param>
        /// <returns>처리 결과</returns>
        [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
        [return : MarshalAs(UnmanagedType.U4)]
        private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// ERROR_SUCCESS
        /// </summary>
        public const int ERROR_SUCCESS = 0;

        /// <summary>
        /// ERROR_INSUFFICIENT_BUFFER
        /// </summary>
        public const int ERROR_INSUFFICIENT_BUFFER = 122;

        /// <summary>
        /// APPMODEL_ERROR_NO_PACKAGE
        /// </summary>
        public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 애플리케이션 패키지 여부 - IsAppPackaged

        /// <summary>
        /// 애플리케이션 패키지 여부
        /// </summary>
        public static bool IsAppPackaged
        {
            get
            {
                int  bufferSize = 0;
                uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
                bool isPackaged = true;

                if(lastError == APPMODEL_ERROR_NO_PACKAGE)
                {
                    isPackaged = false;
                }

                return isPackaged;
            }
        }

        #endregion
    }
}

using System.Runtime.InteropServices;

namespace TestProject

{

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

▶ FileLoader.cs


using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 파일 로더
    /// </summary>
    public class FileLoader
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 텍스트 로드하기 - LoadText(relativeFilePath)

        /// <summary>
        /// 텍스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>텍스트</returns>
        public static async Task<string> LoadText(string relativeFilePath)
        {
            StorageFile storageFile = null;

            if(!NativeHelper.IsAppPackaged)
            {
                string entryAssemblyFilePath     = Assembly.GetEntryAssembly().Location;
                string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);
                string filePath                  = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);
                string finalFilePath             = Path.GetFullPath(filePath);

                storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);
            }
            else
            {
                Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

                storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);
            }

            return await FileIO.ReadTextAsync(storageFile);
        }

        #endregion
        #region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

        /// <summary>
        /// 라인 리스트 로드하기
        /// </summary>
        /// <param name="relativeFilePath">상대적인 파일 경로</param>
        /// <returns>라인 리스트</returns>
        public static async Task<IList<string>> LoadLineList(string relativeFilePath)
        {
            string text = await LoadText(relativeFilePath);

            return text.Split(Environment.NewLine).ToList();
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Reflection;

using System.Threading.Tasks;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 파일 로더

/// </summary>

public class FileLoader

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 텍스트 로드하기 - LoadText(relativeFilePath)

/// <summary>

/// 텍스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>텍스트</returns>

public static async Task<string> LoadText(string relativeFilePath)

{

StorageFile storageFile = null;

if(!NativeHelper.IsAppPackaged)

{

string entryAssemblyFilePath = Assembly.GetEntryAssembly().Location;

string entryAssemblyDirectorPath = Path.GetDirectoryName(entryAssemblyFilePath);

string filePath = Path.Combine(entryAssemblyDirectorPath, relativeFilePath);

string finalFilePath = Path.GetFullPath(filePath);

storageFile = await StorageFile.GetFileFromPathAsync(finalFilePath);

}

else

{

Uri sourceURI = new Uri($"ms-appx:///{relativeFilePath}");

storageFile = await StorageFile.GetFileFromApplicationUriAsync(sourceURI);

}

return await FileIO.ReadTextAsync(storageFile);

}

#endregion

#region 라인 리스트 로드하기 - LoadLineList(relativeFilePath)

/// <summary>

/// 라인 리스트 로드하기

/// </summary>

/// <param name="relativeFilePath">상대적인 파일 경로</param>

/// <returns>라인 리스트</returns>

public static async Task<IList<string>> LoadLineList(string relativeFilePath)

{

string text = await LoadText(relativeFilePath);

return text.Split(Environment.NewLine).ToList();

}

#endregion

}

▶ GroupInfoList.cs


using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 그룹 정보 리스트
    /// </summary>
    public class GroupInfoList : List<object>
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 키 - Key

        /// <summary>
        /// 키
        /// </summary>
        public object Key { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - GroupInfoList(itemEnumerable)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="itemEnumerable">항목 열거 가능형</param>
        public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns></returns>
        public override string ToString()
        {
            return $"Group {Key}";
        }

        #endregion
    }
}

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 그룹 정보 리스트

/// </summary>

public class GroupInfoList : List<object>

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 키 - Key

/// <summary>

/// 키

/// </summary>

public object Key { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - GroupInfoList(itemEnumerable)

/// <summary>

/// 생성자

/// </summary>

/// <param name="itemEnumerable">항목 열거 가능형</param>

public GroupInfoList(IEnumerable<object> itemEnumerable) : base(itemEnumerable)

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns></returns>

public override string ToString()

{

return $"Group {Key}";

}

#endregion

}

▶ Contact.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Threading.Tasks;

namespace TestProject
{
    /// <summary>
    /// 연락처
    /// </summary>
    public class Contact
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 이름 - FirstName

        /// <summary>
        /// 이름
        /// </summary>
        public string FirstName { get; private set; }

        #endregion
        #region 성 - LastName

        /// <summary>
        /// 성
        /// </summary>
        public string LastName { get; private set; }

        #endregion
        #region 회사 - Company

        /// <summary>
        /// 회사
        /// </summary>
        public string Company { get; private set; }

        #endregion
        #region 성명 - Name

        /// <summary>
        /// 성명
        /// </summary>
        public string Name => $"{FirstName} {LastName}";

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - Contact(firstName, lastName, company)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="firstName">이름</param>
        /// <param name="lastName">성</param>
        /// <param name="company">회사</param>
        public Contact(string firstName, string lastName, string company)
        {
            FirstName = firstName;
            LastName  = lastName;
            Company   = company;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

        /// <summary>
        /// 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>연락처 컬렉션 태스크</returns>
        public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()
        {
            IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

            ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

            for(int i = 0; i < lineList.Count - 2; i += 3)
            {
                contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));
            }

            return contactCollection;
        }

        #endregion
        #region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

        /// <summary>
        /// 그룹 연락처 컬렉션 구하기 (비동기)
        /// </summary>
        /// <returns>그룹 연락처 컬렉션 태스크</returns>
        public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()
        {
            var query = from item in await GetContactCollectionAsync()
                        group item by item.LastName.Substring(0, 1).ToUpper() into g
                        orderby g.Key
                        select new GroupInfoList(g) { Key = g.Key };

            return new ObservableCollection<GroupInfoList>(query);
        }

        #endregion
        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return Name;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Linq;

using System.Threading.Tasks;

namespace TestProject

{

/// <summary>

/// 연락처

/// </summary>

public class Contact

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 이름 - FirstName

/// <summary>

/// 이름

/// </summary>

public string FirstName { get; private set; }

#endregion

#region 성 - LastName

/// <summary>

/// 성

/// </summary>

public string LastName { get; private set; }

#endregion

#region 회사 - Company

/// <summary>

/// 회사

/// </summary>

public string Company { get; private set; }

#endregion

#region 성명 - Name

/// <summary>

/// 성명

/// </summary>

public string Name => $"{FirstName} {LastName}";

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - Contact(firstName, lastName, company)

/// <summary>

/// 생성자

/// </summary>

/// <param name="firstName">이름</param>

/// <param name="lastName">성</param>

/// <param name="company">회사</param>

public Contact(string firstName, string lastName, string company)

{

FirstName = firstName;

LastName = lastName;

Company = company;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 연락처 컬렉션 구하기 (비동기) - GetContactCollectionAsync()

/// <summary>

/// 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>연락처 컬렉션 태스크</returns>

public async static Task<ObservableCollection<Contact>> GetContactCollectionAsync()

{

IList<string> lineList = await FileLoader.LoadLineList("DATA/Contacts.txt");

ObservableCollection<Contact> contactCollection = new ObservableCollection<Contact>();

for(int i = 0; i < lineList.Count - 2; i += 3)

{

contactCollection.Add(new Contact(lineList[i], lineList[i + 1], lineList[i + 2]));

}

return contactCollection;

}

#endregion

#region 그룹 연락처 컬렉션 구하기 (비동기) - GetGroupedContactCollectionAsync()

/// <summary>

/// 그룹 연락처 컬렉션 구하기 (비동기)

/// </summary>

/// <returns>그룹 연락처 컬렉션 태스크</returns>

public static async Task<ObservableCollection<GroupInfoList>> GetGroupedContactCollectionAsync()

{

var query = from item in await GetContactCollectionAsync()

group item by item.LastName.Substring(0, 1).ToUpper() into g

orderby g.Key

select new GroupInfoList(g) { Key = g.Key };

return new ObservableCollection<GroupInfoList>(query);

}

#endregion

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return Name;

}

#endregion

}

▶ MainWindow.xaml

[C#/WINUI3/.NET6] 애플리케이션 패키지 여부 구하기

■ 애플리케이션 패키지 여부를 구하는 방법을 보여준다. ▶ 애플리케이션 패키지 여부 구하기 예제 (C#)


bool isAppPackaged = NativeHelper.IsAppPackaged;

bool isAppPackaged = NativeHelper.IsAppPackaged;

▶ 애플리케이션 패키지 여부 구하기 (C#)


using System.Runtime.InteropServices;

/// <summary>
/// 네이티브 헬퍼
/// </summary>
public class NativeHelper
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Import
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Private

    #region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

    /// <summary>
    /// 현재 패키지 ID 구하기
    /// </summary>
    /// <param name="bufferLength">버퍼 길이</param>
    /// <param name="buffer">버퍼</param>
    /// <returns>처리 결과</returns>
    [DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]
    [return : MarshalAs(UnmanagedType.U4)]
    private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region Field

    /// <summary>
    /// ERROR_SUCCESS
    /// </summary>
    public const int ERROR_SUCCESS = 0;

    /// <summary>
    /// ERROR_INSUFFICIENT_BUFFER
    /// </summary>
    public const int ERROR_INSUFFICIENT_BUFFER = 122;

    /// <summary>
    /// APPMODEL_ERROR_NO_PACKAGE
    /// </summary>
    public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Property
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region 애플리케이션 패키지 여부 - IsAppPackaged

    /// <summary>
    /// 애플리케이션 패키지 여부
    /// </summary>
    public static bool IsAppPackaged
    {
        get
        {
            int  bufferSize = 0;
            uint lastError  = GetCurrentPackageId(ref bufferSize, out _);
            bool isPackaged = true;

            if(lastError == APPMODEL_ERROR_NO_PACKAGE)
            {
                isPackaged = false;
            }

            return isPackaged;
        }
    }

    #endregion
}

using System.Runtime.InteropServices;

/// <summary>

/// 네이티브 헬퍼

/// </summary>

public class NativeHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Import

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 패키지 ID 구하기 - GetCurrentPackageId(bufferLength, buffer)

/// <summary>

/// 현재 패키지 ID 구하기

/// </summary>

/// <param name="bufferLength">버퍼 길이</param>

/// <param name="buffer">버퍼</param>

/// <returns>처리 결과</returns>

[DllImport("api-ms-win-appmodel-runtime-l1-1-1", SetLastError = true)]

[return : MarshalAs(UnmanagedType.U4)]

private static extern uint GetCurrentPackageId(ref int bufferLength, out byte buffer);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// ERROR_SUCCESS

/// </summary>

public const int ERROR_SUCCESS = 0;

/// <summary>

/// ERROR_INSUFFICIENT_BUFFER

/// </summary>

public const int ERROR_INSUFFICIENT_BUFFER = 122;

/// <summary>

/// APPMODEL_ERROR_NO_PACKAGE

/// </summary>

public const int APPMODEL_ERROR_NO_PACKAGE = 15700;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 애플리케이션 패키지 여부 - IsAppPackaged

/// <summary>

/// 애플리케이션 패키지 여부

/// </summary>

public static bool IsAppPackaged

{

get

{

int bufferSize = 0;

uint lastError = GetCurrentPackageId(ref bufferSize, out _);

bool isPackaged = true;

if(lastError == APPMODEL_ERROR_NO_PACKAGE)

{

isPackaged = false;

}

return isPackaged;

}

#endregion

}

[C#/WINUI3/.NET6] 저장소 텍스트 파일 읽기

■ 저장소 텍스트 파일을 읽는 방법을 보여준다. ▶ 저장소 텍스트 파일 읽기 예제 (C#)


string text = await LoadTextFileAsync("Assets/Contacts.txt");

string text = await LoadTextFileAsync("Assets/Contacts.txt");

※ Assets/Contacts.txt 파일은 [빌드 작업] 항목이 [내용]으로

[C#/WINUI3/.NET6] ListBox 엘리먼트 : DisplayMemberPath/SelectedValuePath/ItemsSource 속성 사용하기

■ ListBox 엘리먼트의 DisplayMemberPath/SelectedValuePath/ItemsSource 속성을 사용하는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <ListBox Name="listBox"
            HorizontalAlignment="Center"
            Width="200"
            Height="200"
            HighContrastAdjustment="Auto"
            DisplayMemberPath="Item1"
            SelectedValuePath="Item2"
            ItemsSource="{x:Bind FontList}" />
        <TextBlock Name="Control2Output"
            HorizontalAlignment="Center"
            Margin="0 20 0 0"
            Text="You can set the font used for this text."
            FontFamily="{x:Bind (FontFamily)listBox.SelectedValue, Mode=OneWay}" />
    </StackPanel>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<StackPanel

HorizontalAlignment="Center"

VerticalAlignment="Center">

<ListBox Name="listBox"

HorizontalAlignment="Center"

Width="200"

Height="200"

HighContrastAdjustment="Auto"

DisplayMemberPath="Item1"

SelectedValuePath="Item2"

ItemsSource="{x:Bind FontList}" />

<TextBlock Name="Control2Output"

HorizontalAlignment="Center"

Margin="0 20 0 0"

Text="You can set the font used for this text."

FontFamily="{x:Bind (FontFamily)listBox.SelectedValue, Mode=OneWay}" />

</StackPanel>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Collections.Generic;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Media;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 폰트 리스트
        /// </summary>
        private List<Tuple<string, FontFamily>> fontList = new List<Tuple<string, FontFamily>>()
        {
            new Tuple<string, FontFamily>("Arial"          , new FontFamily("Arial"          )),
            new Tuple<string, FontFamily>("Comic Sans MS"  , new FontFamily("Comic Sans MS"  )),
            new Tuple<string, FontFamily>("Courier New"    , new FontFamily("Courier New"    )),
            new Tuple<string, FontFamily>("Segoe UI"       , new FontFamily("Segoe UI"       )),
            new Tuple<string, FontFamily>("Times New Roman", new FontFamily("Times New Roman"))
        };

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 폰트 리스트 - FontList

        /// <summary>
        /// 폰트 리스트
        /// </summary>
        public List<Tuple<string, FontFamily>> FontList
        {
            get
            {
                return this.fontList;
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.listBox.Loaded += listBox_Loaded;
        }

        #endregion

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

        #region 리스트 박스 로드시 처리하기 - listBox_Loaded(sender, e)

        /// <summary>
        /// 리스트 박스 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void listBox_Loaded(object sender, RoutedEventArgs e)
        {
            this.listBox.SelectedIndex = 2;
        }

        #endregion
    }
}

using System;

using System.Collections.Generic;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Media;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 폰트 리스트

/// </summary>

private List<Tuple<string, FontFamily>> fontList = new List<Tuple<string, FontFamily>>()

{

new Tuple<string, FontFamily>("Arial" , new FontFamily("Arial" )),

new Tuple<string, FontFamily>("Comic Sans MS" , new FontFamily("Comic Sans MS" )),

new Tuple<string, FontFamily>("Courier New" , new FontFamily("Courier New" )),

new Tuple<string, FontFamily>("Segoe UI" , new FontFamily("Segoe UI" )),

new Tuple<string, FontFamily>("Times New Roman", new FontFamily("Times New Roman"))

};

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 폰트 리스트 - FontList

/// <summary>

/// 폰트 리스트

/// </summary>

public List<Tuple<string, FontFamily>> FontList

{

get

{

return this.fontList;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.listBox.Loaded += listBox_Loaded;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 리스트 박스 로드시 처리하기 - listBox_Loaded(sender, e)

/// <summary>

/// 리스트 박스 로드시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void listBox_Loaded(object sender, RoutedEventArgs e)

{

this.listBox.SelectedIndex = 2;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ListBox 클래스 : SelectionChanged 이벤트 사용하기

■ ListBox 클래스의 SelectionChanged 이벤트를 사용하는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <ListBox Name="listBox"
            HorizontalAlignment="Center"
            Width="200"
            HighContrastAdjustment="Auto">
            <x:String>Blue</x:String>
            <x:String>Green</x:String>
            <x:String>Red</x:String>
            <x:String>Yellow</x:String>
        </ListBox>
        <Rectangle Name="textBlock"
            HorizontalAlignment="Center"
            Margin="0 10 0 0"
            Width="100"
            Height="100" />
    </StackPanel>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<StackPanel

HorizontalAlignment="Center"

VerticalAlignment="Center">

<ListBox Name="listBox"

HorizontalAlignment="Center"

Width="200"

HighContrastAdjustment="Auto">

<x:String>Blue</x:String>

<x:String>Green</x:String>

<x:String>Red</x:String>

<x:String>Yellow</x:String>

</ListBox>

<Rectangle Name="textBlock"

HorizontalAlignment="Center"

Margin="0 10 0 0"

Width="100"

Height="100" />

</StackPanel>

</Window>

▶ MainWindow.xaml.cs


using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.listBox.SelectionChanged += listBox_SelectionChanged;
        }

        #endregion

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

        #region 리스트 박스 선택 변경시 처리하기 - listBox_SelectionChanged(sender, e)

        /// <summary>
        /// 리스트 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void listBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            string colorName = e.AddedItems[0].ToString();

            switch(colorName)
            {
                case "Yellow" :

                    this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Yellow);

                    break;

                case "Green" :

                    this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Green);

                    break;

                case "Blue" :

                    this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Blue);

                    break;

                case "Red" :

                    this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Red);

                    break;
            }
        }

        #endregion
    }
}

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Media;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.listBox.SelectionChanged += listBox_SelectionChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 리스트 박스 선택 변경시 처리하기 - listBox_SelectionChanged(sender, e)

/// <summary>

/// 리스트 박스 선택 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void listBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

string colorName = e.AddedItems[0].ToString();

switch(colorName)

{

case "Yellow" :

this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Yellow);

break;

case "Green" :

this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Green);

break;

case "Blue" :

this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Blue);

break;

case "Red" :

this.textBlock.Fill = new SolidColorBrush(Microsoft.UI.Colors.Red);

break;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ItemsView 엘리먼트 : SelectionMode/IsItemInvokedEnabled 속성 사용하기

■ ItemsView 엘리먼트의 SelectionMode/IsItemInvokedEnabled 속성을 사용하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Border Name="border"
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black">
        <Border.Resources>
            <DataTemplate x:Key="UniformGridLayoutDataTemplateKey" x:DataType="local:CustomDataObject">
                <ItemContainer>
                    <Grid Width="150">
                        <Image
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Stretch="UniformToFill"
                            Source="{x:Bind ImageLocation}" />
                        <StackPanel
                            VerticalAlignment="Bottom"
                            Height="40"
                            Padding="5 1 5 1"
                            Orientation="Vertical"
                            Opacity="0.75"
                            Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}">
                            <TextBlock
                                Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                Text="{x:Bind Title}" />
                            <StackPanel Orientation="Horizontal">
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text="{x:Bind Likes}" />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text=" Likes" />
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </ItemContainer>
            </DataTemplate>
        </Border.Resources>
        <Grid Margin="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"    />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <Grid Grid.Column="0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"    />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <ItemsView Name="itemsView" Grid.Row="0"
                    ItemTemplate="{StaticResource UniformGridLayoutDataTemplateKey}"
                    HorizontalAlignment="Left"
                    Width="500"
                    Height="400"
                    SelectionMode="Multiple"
                    IsItemInvokedEnabled="False">
                    <ItemsView.Layout>
                        <UniformGridLayout
                            MinRowSpacing="5"
                            MinColumnSpacing="5"
                            MaximumRowsOrColumns="3" />
                    </ItemsView.Layout>
                </ItemsView>
                <StackPanel Grid.Row="1">
                    <TextBlock Name="invokerItemTextBlock" />
                    <TextBlock Name="countSelectedTextBlock"
                        Margin="0 5 0 0" />
                </StackPanel>
            </Grid>
            <Grid Grid.Column="1"
                MinWidth="200"
                RowDefinitions="Auto, Auto"
                ColumnDefinitions="Auto, *">
                <TextBlock Grid.Row="0" Grid.Column="0"
                    VerticalAlignment="Center"
                    Margin="0 0 10 0"
                    Text="SelectionMode" />
                <ComboBox Name="slectionModeComboBox" Grid.Row="0" Grid.Column="1"
                    HorizontalAlignment="Stretch">
                    <ComboBoxItem>None</ComboBoxItem>
                    <ComboBoxItem>Single</ComboBoxItem>
                    <ComboBoxItem>Multiple</ComboBoxItem>
                    <ComboBoxItem>Extended</ComboBoxItem>
                </ComboBox>
                <TextBlock Grid.Row="1" Grid.Column="0"
                    VerticalAlignment="Center"
                    Margin="0 0 10 0"
                    Text="IsItemInvokedEnabled" />
                <CheckBox Name="isItemInvokedEnabledCheckBox" Grid.Row="1" Grid.Column="1" />
            </Grid>
        </Grid>
    </Border>
</Window>

100

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Border Name="border"

Margin="10"

BorderThickness="1"

BorderBrush="Black">

<Border.Resources>

<Image

HorizontalAlignment="Center"

VerticalAlignment="Center"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

<StackPanel

VerticalAlignment="Bottom"

Height="40"

Padding="5 1 5 1"

Orientation="Vertical"

Opacity="0.75"

Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}">

<TextBlock

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Title}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text=" Likes" />

</StackPanel>

</Grid>

</ItemContainer>

</DataTemplate>

</Border.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<ItemsView Name="itemsView" Grid.Row="0"

ItemTemplate="{StaticResource UniformGridLayoutDataTemplateKey}"

HorizontalAlignment="Left"

Width="500"

Height="400"

SelectionMode="Multiple"

IsItemInvokedEnabled="False">

<ItemsView.Layout>

<UniformGridLayout

MinRowSpacing="5"

MinColumnSpacing="5"

MaximumRowsOrColumns="3" />

</ItemsView.Layout>

</ItemsView>

<TextBlock Name="countSelectedTextBlock"

Margin="0 5 0 0" />

</StackPanel>

</Grid>

<Grid Grid.Column="1"

MinWidth="200"

RowDefinitions="Auto, Auto"

ColumnDefinitions="Auto, *">

<TextBlock Grid.Row="0" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 0 10 0"

Text="SelectionMode" />

<ComboBox Name="slectionModeComboBox" Grid.Row="0" Grid.Column="1"

HorizontalAlignment="Stretch">

<ComboBoxItem>Single</ComboBoxItem>

<ComboBoxItem>Multiple</ComboBoxItem>

<ComboBoxItem>Extended</ComboBoxItem>

</ComboBox>

<TextBlock Grid.Row="1" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 0 10 0"

Text="IsItemInvokedEnabled" />

</Grid>

</Border>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(includeAllItems : true);

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            this.itemsView.ItemsSource = sourceCollection;

            this.itemsView.ItemInvoked                  += itemsView_ItemInvoked;
            this.itemsView.SelectionChanged             += itemsView_SelectionChanged;
            this.slectionModeComboBox.SelectionChanged  += slectionModeComboBox_SelectionChanged;
            this.isItemInvokedEnabledCheckBox.Checked   += isItemInvokedEnabledCheckBox_Checked;
            this.isItemInvokedEnabledCheckBox.Unchecked += isItemInvokedEnabledCheckBox_Checked;

            this.slectionModeComboBox.SelectedIndex = 2;
        }

        #endregion

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

        #region 아이템 뷰 항목 호출시 처리하기 - itemsView_ItemInvoked(sender, e)

        /// <summary>
        /// 아이템 뷰 항목 호출시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void itemsView_ItemInvoked(ItemsView sender, ItemsViewItemInvokedEventArgs e)
        {
            this.invokerItemTextBlock.Text = $"You invoked {(e.InvokedItem as CustomDataObject).Title}.";
        }

        #endregion
        #region 아이템 뷰 선택 변경시 처리하기 - itemsView_SelectionChanged(sender, e)

        /// <summary>
        /// 아이템 뷰 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void itemsView_SelectionChanged(ItemsView sender, ItemsViewSelectionChangedEventArgs e)
        {
            if(this.itemsView != null)
            {
                this.countSelectedTextBlock.Text = $"You have selected {this.itemsView.SelectedItems.Count} item(s).";
            }
        }

        #endregion
        #region 선택 모드 콤보 박스 선택 변경시 처리하기 - slectionModeComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 선택 모드 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void slectionModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.itemsView != null && sender is ComboBox comboBox)
            {
                this.itemsView.SelectionMode = (ItemsViewSelectionMode)comboBox.SelectedIndex;
            }
        }

        #endregion
        #region 항목 호출 가능 여부 체크 박스 체크시 처리하기 - isItemInvokedEnabledCheckBox_Checked(sender, e)

        /// <summary>
        /// 항목 호출 가능 여부 체크 박스 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void isItemInvokedEnabledCheckBox_Checked(object sender, RoutedEventArgs e)
        {
            this.invokerItemTextBlock.Text = string.Empty;

            if(this.itemsView != null && this.isItemInvokedEnabledCheckBox != null)
            {
                this.itemsView.IsItemInvokedEnabled = (bool)this.isItemInvokedEnabledCheckBox.IsChecked;
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

using System.Collections.Generic;

using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(includeAllItems : true);

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

this.itemsView.ItemsSource = sourceCollection;

this.itemsView.ItemInvoked += itemsView_ItemInvoked;

this.itemsView.SelectionChanged += itemsView_SelectionChanged;

this.slectionModeComboBox.SelectionChanged += slectionModeComboBox_SelectionChanged;

this.isItemInvokedEnabledCheckBox.Checked += isItemInvokedEnabledCheckBox_Checked;

this.isItemInvokedEnabledCheckBox.Unchecked += isItemInvokedEnabledCheckBox_Checked;

this.slectionModeComboBox.SelectedIndex = 2;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 아이템 뷰 항목 호출시 처리하기 - itemsView_ItemInvoked(sender, e)

/// <summary>

/// 아이템 뷰 항목 호출시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void itemsView_ItemInvoked(ItemsView sender, ItemsViewItemInvokedEventArgs e)

{

this.invokerItemTextBlock.Text = $"You invoked {(e.InvokedItem as CustomDataObject).Title}.";

}

#endregion

#region 아이템 뷰 선택 변경시 처리하기 - itemsView_SelectionChanged(sender, e)

/// <summary>

/// 아이템 뷰 선택 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void itemsView_SelectionChanged(ItemsView sender, ItemsViewSelectionChangedEventArgs e)

{

if(this.itemsView != null)

{

this.countSelectedTextBlock.Text = $"You have selected {this.itemsView.SelectedItems.Count} item(s).";

}

#endregion

#region 선택 모드 콤보 박스 선택 변경시 처리하기 - slectionModeComboBox_SelectionChanged(sender, e)

/// <summary>

/// 선택 모드 콤보 박스 선택 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void slectionModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.itemsView != null && sender is ComboBox comboBox)

{

this.itemsView.SelectionMode = (ItemsViewSelectionMode)comboBox.SelectedIndex;

}

#endregion

#region 항목 호출 가능 여부 체크 박스 체크시 처리하기 - isItemInvokedEnabledCheckBox_Checked(sender, e)

/// <summary>

/// 항목 호출 가능 여부 체크 박스 체크시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void isItemInvokedEnabledCheckBox_Checked(object sender, RoutedEventArgs e)

{

this.invokerItemTextBlock.Text = string.Empty;

if(this.itemsView != null && this.isItemInvokedEnabledCheckBox != null)

{

this.itemsView.IsItemInvokedEnabled = (bool)this.isItemInvokedEnabledCheckBox.IsChecked;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ItemsView 엘리먼트 : Layout/ItemTemplate 속성을 사용해 레이아웃 LinedFlowLayout/StackLayout/UniformGridLayout 객체 교체하기

■ ItemsView 엘리먼트의 Layout/ItemTemplate 속성을 사용해 레이아웃 LinedFlowLayout/StackLayout/UniformGridLayout 객체를 교체하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Border Name="border"
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black">
        <Border.Resources>
            <DataTemplate x:Key="LinedFlowLayoutDataTemplateKey" x:DataType="local:CustomDataObject">
                <ItemContainer>
                    <Grid>
                        <Image
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            MinWidth="70"
                            Stretch="UniformToFill"
                            Source="{x:Bind ImageLocation}" />
                        <StackPanel
                            VerticalAlignment="Bottom"
                            Height="40"
                            Padding="5 1 5 1"
                            Orientation="Vertical"
                            Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}"
                            Opacity="0.75">
                            <TextBlock
                                Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                Text="{x:Bind Title}" />
                            <StackPanel Orientation="Horizontal">
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text="{x:Bind Likes}" />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text=" Likes" />
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </ItemContainer>
            </DataTemplate>
            <DataTemplate x:Key="StackLayoutDataTemplateKey" x:DataType="local:CustomDataObject">
                <ItemContainer>
                    <RelativePanel
                        Width="480"
                        MinHeight="80"
                        MaxHeight="100">
                        <Image Name="image"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Margin="0 5 0 0"
                            Width="24"
                            Height="16"
                            RelativePanel.AlignLeftWithPanel="True"
                            RelativePanel.AlignTopWithPanel="True"
                            Stretch="UniformToFill"
                            Source="{x:Bind ImageLocation}" />
                        <TextBlock Name="titleTextBlock"
                            Style="{StaticResource BaseTextBlockStyle}"
                            Margin="10 0 0 0"
                            RelativePanel.RightOf="image"
                            RelativePanel.AlignTopWithPanel="True"
                            Text="{x:Bind Title}" />
                        <TextBlock
                            Style="{StaticResource CaptionTextBlockStyle}"
                            Margin="0 5 10 5"
                            RelativePanel.Below="titleTextBlock"
                            TextWrapping="Wrap"
                            TextTrimming="WordEllipsis"
                            Text="{x:Bind Description}" />
                    </RelativePanel>
                </ItemContainer>
            </DataTemplate>
            <DataTemplate x:Key="UniformGridLayoutDataTemplateKey" x:DataType="local:CustomDataObject">
                <ItemContainer>
                    <Grid Width="150">
                        <Image
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Stretch="UniformToFill"
                            Source="{x:Bind ImageLocation}" />
                        <StackPanel
                            VerticalAlignment="Bottom"
                            Height="40"
                            Padding="5 1 5 1"
                            Orientation="Vertical"
                            Opacity="0.75"
                            Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}">
                            <TextBlock
                                Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                Text="{x:Bind Title}" />
                            <StackPanel Orientation="Horizontal">
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text="{x:Bind Likes}" />
                                <TextBlock
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                    Text=" Likes" />
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </ItemContainer>
            </DataTemplate>
        </Border.Resources>
        <Grid Margin="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"    />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <StackPanel Grid.Column="0">
                <ItemsView Name="itemsView"
                    ItemTemplate="{StaticResource LinedFlowLayoutDataTemplateKey}"
                    HorizontalAlignment="Left"
                    Width="500"
                    Height="500">
                    <ItemsView.Layout>
                        <LinedFlowLayout
                            LineHeight="160"
                            LineSpacing="5"
                            MinItemSpacing="5"
                            ItemsStretch="Fill" />
                    </ItemsView.Layout>
                </ItemsView>
            </StackPanel>
            <StackPanel Grid.Column="1"
                Width="200">
                <StackPanel.Resources>
                    <Style x:Key="DefaultNumberBoxStyle" TargetType="NumberBox">
                        <Setter Property="SpinButtonPlacementMode"    Value="Inline"  />
                        <Setter Property="SmallChange"                Value="1"       />
                        <Setter Property="HorizontalAlignment"        Value="Stretch" />
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                        <Setter Property="MaxWidth"                   Value="250"     />
                    </Style>
                </StackPanel.Resources>
                <RadioButtons
                    Header="Layout"
                    FontWeight="SemiBold">
                    <RadioButton Name="linedFlowLayoutRadioButton"
                        GroupName="ItemsViewLayouts"
                        FontWeight="Normal"
                        Content="LinedFlowLayout"
                        IsChecked="True" />
                    <RadioButton Name="uniformGridLayoutRadioButton"
                        GroupName="ItemsViewLayouts"
                        FontWeight="Normal"
                        Content="UniformGridLayout" />
                    <RadioButton Name="stackLayoutRadioButton"
                        GroupName="ItemsViewLayouts"
                        FontWeight="Normal"
                        Content="StackLayout" />
                </RadioButtons>
                <StackPanel Name="linedFlowLayoutSettingStackPanel"
                    Margin="0 10 0 0"
                    MinHeight="300">
                    <TextBlock
                        FontWeight="SemiBold"
                        Text="LinedFlowLayout settings" />
                    <NumberBox Name="lineSpacingNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Margin="0 10 0 0"
                        Header="Space between lines"
                        Minimum="0"
                        Maximum="100"
                        Value="5" />
                    <NumberBox Name="minItemSpacingNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Margin="0 10 0 0"
                        Header="Minimum space between items on a line"
                        Minimum="0"
                        Maximum="100"
                        Value="5" />
                    <RadioButtons
                        Margin="0 10 0 0"
                        Header="Line height">
                        <RadioButton Name="smallLineHeightRadioButton"
                            GroupName="LinedFlowLayoutLineHeights"
                            Content="Small" />
                        <RadioButton Name="largeLineHeightRadioButton"
                            GroupName="LinedFlowLayoutLineHeights"
                            Content="Large"
                            IsChecked="True" />
                    </RadioButtons>
                </StackPanel>
                <StackPanel Name="stackLayoutSettingsStackPanel"
                    Margin="0 10 0 0"
                    MinHeight="300"
                    Visibility="Collapsed">
                    <TextBlock
                        FontWeight="SemiBold"
                        Text="StackLayout settings" />
                    <NumberBox Name="spacingNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Margin="0 10 0 0"
                        Header="Space between rows"
                        Minimum="0"
                        Maximum="100"
                        Value="5" />
                </StackPanel>
                <StackPanel Name="uniformGridLayoutSettingsStackPanel"
                    Margin="0 10 0 0"
                    MinHeight="300"
                    Visibility="Collapsed">
                    <TextBlock
                        FontWeight="SemiBold"
                        Text="UniformGridLayout settings" />
                    <NumberBox Name="minColumnSpacingNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Margin="0 10 0 0"
                        Header="Minimum space between columns"
                        Minimum="0"
                        Maximum="100"
                        Value="5" />
                    <NumberBox Name="minRowSpacingNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Margin="0 10 0 0"
                        Header="Minimum space between rows"
                        Minimum="0"
                        Maximum="100"
                        Value="5" />
                    <NumberBox Name="mximumRowsOrColumnsNumberBox"
                        Style="{ThemeResource DefaultNumberBoxStyle}"
                        Header="Maximum number of items per row before wrapping"
                        Minimum="1"
                        Maximum="8"
                        Value="3" />
                </StackPanel>
            </StackPanel>
        </Grid>
    </Border>
</Window>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Border Name="border"

Margin="10"

BorderThickness="1"

BorderBrush="Black">

<Border.Resources>

<Grid>

<Image

HorizontalAlignment="Center"

VerticalAlignment="Center"

MinWidth="70"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

<StackPanel

VerticalAlignment="Bottom"

Height="40"

Padding="5 1 5 1"

Orientation="Vertical"

Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}"

Opacity="0.75">

<TextBlock

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Title}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text=" Likes" />

</StackPanel>

</Grid>

</ItemContainer>

</DataTemplate>

<RelativePanel

Width="480"

MinHeight="80"

MaxHeight="100">

<Image Name="image"

HorizontalAlignment="Center"

VerticalAlignment="Center"

Margin="0 5 0 0"

Width="24"

Height="16"

RelativePanel.AlignLeftWithPanel="True"

RelativePanel.AlignTopWithPanel="True"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

<TextBlock Name="titleTextBlock"

Style="{StaticResource BaseTextBlockStyle}"

Margin="10 0 0 0"

RelativePanel.RightOf="image"

RelativePanel.AlignTopWithPanel="True"

Text="{x:Bind Title}" />

<TextBlock

Style="{StaticResource CaptionTextBlockStyle}"

Margin="0 5 10 5"

RelativePanel.Below="titleTextBlock"

TextWrapping="Wrap"

TextTrimming="WordEllipsis"

Text="{x:Bind Description}" />

</RelativePanel>

</ItemContainer>

</DataTemplate>

<Image

HorizontalAlignment="Center"

VerticalAlignment="Center"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

<StackPanel

VerticalAlignment="Bottom"

Height="40"

Padding="5 1 5 1"

Orientation="Vertical"

Opacity="0.75"

Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}">

<TextBlock

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Title}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text=" Likes" />

</StackPanel>

</Grid>

</ItemContainer>

</DataTemplate>

</Border.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<ItemsView Name="itemsView"

ItemTemplate="{StaticResource LinedFlowLayoutDataTemplateKey}"

HorizontalAlignment="Left"

Width="500"

Height="500">

<ItemsView.Layout>

<LinedFlowLayout

LineHeight="160"

LineSpacing="5"

MinItemSpacing="5"

ItemsStretch="Fill" />

</ItemsView.Layout>

</ItemsView>

</StackPanel>

<StackPanel Grid.Column="1"

Width="200">

<StackPanel.Resources>

</Style>

</StackPanel.Resources>

<RadioButtons

Header="Layout"

FontWeight="SemiBold">

<RadioButton Name="linedFlowLayoutRadioButton"

GroupName="ItemsViewLayouts"

FontWeight="Normal"

Content="LinedFlowLayout"

IsChecked="True" />

<RadioButton Name="uniformGridLayoutRadioButton"

GroupName="ItemsViewLayouts"

FontWeight="Normal"

Content="UniformGridLayout" />

<RadioButton Name="stackLayoutRadioButton"

GroupName="ItemsViewLayouts"

FontWeight="Normal"

Content="StackLayout" />

</RadioButtons>

<StackPanel Name="linedFlowLayoutSettingStackPanel"

Margin="0 10 0 0"

MinHeight="300">

<TextBlock

FontWeight="SemiBold"

Text="LinedFlowLayout settings" />

<NumberBox Name="lineSpacingNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Margin="0 10 0 0"

Header="Space between lines"

Minimum="0"

Maximum="100"

Value="5" />

<NumberBox Name="minItemSpacingNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Margin="0 10 0 0"

Header="Minimum space between items on a line"

Minimum="0"

Maximum="100"

Value="5" />

<RadioButtons

Margin="0 10 0 0"

Header="Line height">

<RadioButton Name="smallLineHeightRadioButton"

GroupName="LinedFlowLayoutLineHeights"

Content="Small" />

<RadioButton Name="largeLineHeightRadioButton"

GroupName="LinedFlowLayoutLineHeights"

Content="Large"

IsChecked="True" />

</RadioButtons>

</StackPanel>

<StackPanel Name="stackLayoutSettingsStackPanel"

Margin="0 10 0 0"

MinHeight="300"

Visibility="Collapsed">

<TextBlock

FontWeight="SemiBold"

Text="StackLayout settings" />

<NumberBox Name="spacingNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Margin="0 10 0 0"

Header="Space between rows"

Minimum="0"

Maximum="100"

Value="5" />

</StackPanel>

<StackPanel Name="uniformGridLayoutSettingsStackPanel"

Margin="0 10 0 0"

MinHeight="300"

Visibility="Collapsed">

<TextBlock

FontWeight="SemiBold"

Text="UniformGridLayout settings" />

<NumberBox Name="minColumnSpacingNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Margin="0 10 0 0"

Header="Minimum space between columns"

Minimum="0"

Maximum="100"

Value="5" />

<NumberBox Name="minRowSpacingNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Margin="0 10 0 0"

Header="Minimum space between rows"

Minimum="0"

Maximum="100"

Value="5" />

<NumberBox Name="mximumRowsOrColumnsNumberBox"

Style="{ThemeResource DefaultNumberBoxStyle}"

Header="Maximum number of items per row before wrapping"

Minimum="1"

Maximum="8"

Value="3" />

</StackPanel>

</Grid>

</Border>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Threading.Tasks;

using Microsoft.UI.Dispatching;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 선형 플로우 레이아웃
        /// </summary>
        private LinedFlowLayout linedFlowLayout = null;

        /// <summary>
        /// 선형 플로우 레이아웃 데이터 템플리트
        /// </summary>
        private DataTemplate linedFlowLayoutDataTemplate = null;

        /// <summary>
        /// 스택 레이아웃
        /// </summary>
        private StackLayout stackLayout = null;

        /// <summary>
        /// 스택 레이아웃 데이터 템플리트
        /// </summary>
        private DataTemplate stackLayoutDataTemplate = null;

        /// <summary>
        /// 유니폼 그리드 레이아웃
        /// </summary>
        private UniformGridLayout uniformGridLayout = null;

        /// <summary>
        /// 유니폼 그리드 레이아웃 데이터 템플리트
        /// </summary>
        private DataTemplate uniformGridLayoutDataTemplate = null;

        /// <summary>
        /// 선형 플로우 레이아웃 라인 높이 비동기 적용 여부
        /// </summary>
        private bool applyLinedFlowLayoutLineHeightAsync = false;

        /// <summary>
        /// 선형 플로우 레이아웃 옵션 비동기 적용 여부
        /// </summary>
        private bool applyLinedFlowLayoutOptionsAsync = false;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.border.Loaded                              += border_Loaded;
            this.linedFlowLayoutRadioButton.Checked         += layoutRadioButton_Checked;
            this.uniformGridLayoutRadioButton.Checked       += layoutRadioButton_Checked;
            this.stackLayoutRadioButton.Checked             += layoutRadioButton_Checked;
            this.lineSpacingNumberBox.ValueChanged          += linedFlowLayoutSettingsNumberBox_ValueChanged;
            this.minItemSpacingNumberBox.ValueChanged       += linedFlowLayoutSettingsNumberBox_ValueChanged;
            this.smallLineHeightRadioButton.Checked         += lineHeightRadioButton_Checked;
            this.largeLineHeightRadioButton.Checked         += lineHeightRadioButton_Checked;
            this.spacingNumberBox.ValueChanged              += stackLayoutSettingsNumberBox_ValueChanged;
            this.minColumnSpacingNumberBox.ValueChanged     += uniformGridLayoutSettingsNumberBox_ValueChanged;
            this.minRowSpacingNumberBox.ValueChanged        += uniformGridLayoutSettingsNumberBox_ValueChanged;
            this.mximumRowsOrColumnsNumberBox.ValueChanged  += uniformGridLayoutSettingsNumberBox_ValueChanged;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 테두리 로드시 처리하기 - border_Loaded(sender, e)

        /// <summary>
        /// 테두리 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void border_Loaded(object sender, RoutedEventArgs e)
        {
            if(this.itemsView != null)
            {
                this.itemsView.ScrollView.ViewChanged += itemsViewScrollView_ViewChanged;

                this.linedFlowLayout             = this.itemsView.Layout as LinedFlowLayout;
                this.linedFlowLayoutDataTemplate = this.itemsView.ItemTemplate as DataTemplate;
            }

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(includeAllItems: true);

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            Task.Run
            (
                delegate ()
                {
                    _ = DispatcherQueue.TryEnqueue
                    (
                        DispatcherQueuePriority.Low,
                        () =>
                        {
                            if(this.itemsView != null)
                            {
                                this.itemsView.ItemsSource = sourceCollection;
                            }
                        }
                    );
                }
            );
        }

        #endregion
        #region 아이템 뷰 스크롤 뷰 뷰 변경시 처리하기 - itemsViewScrollView_ViewChanged(sender, e)

        /// <summary>
        /// 아이템 뷰 스크롤 뷰 뷰 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void itemsViewScrollView_ViewChanged(ScrollView sender, object e)
        {
            if(sender.VerticalOffset == 0 && (this.applyLinedFlowLayoutOptionsAsync || this.applyLinedFlowLayoutLineHeightAsync))
            {
                if(this.applyLinedFlowLayoutOptionsAsync)
                {
                    this.applyLinedFlowLayoutOptionsAsync = false;

                    ApplyLinedFlowLayoutSettings();
                }

                if(this.applyLinedFlowLayoutLineHeightAsync)
                {
                    this.applyLinedFlowLayoutLineHeightAsync = false;

                    ApplyLinedFlowLayoutLineHeight();
                }
            }
        }

        #endregion
        #region 레이아웃 라디오 버튼 체크시 처리하기 - layoutRadioButton_Checked(sender, e)

        /// <summary>
        /// 레이아웃 라디오 버튼 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void layoutRadioButton_Checked(object sender, RoutedEventArgs e)
        {
            if(sender is RadioButton radioButton && this.itemsView != null)
            {
                switch(radioButton.Content.ToString())
                {
                    case "LinedFlowLayout" :

                        if(this.linedFlowLayout != null && this.linedFlowLayoutDataTemplate != null)
                        {
                            this.itemsView.Layout       = this.linedFlowLayout;
                            this.itemsView.ItemTemplate = this.linedFlowLayoutDataTemplate;

                            this.linedFlowLayoutSettingStackPanel.Visibility    = Visibility.Visible;
                            this.stackLayoutSettingsStackPanel.Visibility       = Visibility.Collapsed;
                            this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;
                        }

                        break;

                    case "StackLayout" :

                        if(this.stackLayout == null)
                        {
                            this.stackLayout = new StackLayout() { Spacing = 5 };
                        }

                        if(this.stackLayoutDataTemplate == null)
                        {
                            this.stackLayoutDataTemplate = this.border.Resources["StackLayoutDataTemplateKey"] as DataTemplate;
                        }

                        this.itemsView.Layout       = this.stackLayout;
                        this.itemsView.ItemTemplate = this.stackLayoutDataTemplate;

                        this.linedFlowLayoutSettingStackPanel.Visibility    = Visibility.Collapsed;
                        this.stackLayoutSettingsStackPanel.Visibility       = Visibility.Visible;
                        this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;

                        break;

                    case "UniformGridLayout" :

                        if(this.uniformGridLayout == null)
                        {
                            this.uniformGridLayout = new UniformGridLayout()
                            {
                                MinRowSpacing        = 5,
                                MinColumnSpacing     = 5,
                                MaximumRowsOrColumns = 3
                            };
                        }

                        if(this.uniformGridLayoutDataTemplate == null)
                        {
                            this.uniformGridLayoutDataTemplate = this.border.Resources["UniformGridLayoutDataTemplateKey"] as DataTemplate;
                        }

                        this.itemsView.Layout       = this.uniformGridLayout;
                        this.itemsView.ItemTemplate = this.uniformGridLayoutDataTemplate;

                        this.linedFlowLayoutSettingStackPanel.Visibility    = Visibility.Collapsed;
                        this.stackLayoutSettingsStackPanel.Visibility       = Visibility.Collapsed;
                        this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Visible;

                        break;
                }
            }
        }

        #endregion
        #region 선형 플로우 레이아웃 설정 넘버 박스 값 변경시 처리하기 - linedFlowLayoutSettingsNumberBox_ValueChanged(sender, e)

        /// <summary>
        /// 선형 플로우 레이아웃 설정 넘버 박스 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void linedFlowLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)
        {
            if(this.itemsView != null && this.itemsView.ScrollView != null && this.itemsView.ScrollView.VerticalOffset != 0)
            {
                this.itemsView.ScrollView.ScrollTo(0, 0, new ScrollingScrollOptions(ScrollingAnimationMode.Disabled, ScrollingSnapPointsMode.Ignore));

                this.applyLinedFlowLayoutOptionsAsync = true;
            }
            else
            {
                ApplyLinedFlowLayoutSettings();
            }
        }

        #endregion
        #region 라인 높이 라디오 버튼 체크시 처리하기 - lineHeightRadioButton_Checked(sender, e)

        /// <summary>
        /// 라인 높이 라디오 버튼 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void lineHeightRadioButton_Checked(object sender, RoutedEventArgs e)
        {
            if(this.itemsView != null && this.itemsView.ScrollView != null && this.itemsView.ScrollView.VerticalOffset != 0)
            {
                this.itemsView.ScrollView.ScrollTo(0, 0, new ScrollingScrollOptions(ScrollingAnimationMode.Disabled, ScrollingSnapPointsMode.Ignore));

                this.applyLinedFlowLayoutLineHeightAsync = true;
            }
            else
            {
                ApplyLinedFlowLayoutLineHeight();
            }
        }

        #endregion
        #region 스택 레이아웃 설정 넘버 박스 값 변경시 처리하기 - stackLayoutSettingsNumberBox_ValueChanged(sender, e)

        /// <summary>
        /// 스택 레이아웃 설정 넘버 박스 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void stackLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)
        {
            if(this.stackLayout != null)
            {
                this.stackLayout.Spacing = this.spacingNumberBox.Value;
            }
        }

        #endregion
        #region 유니폼 그리드 레이아웃 설정 넘버 박스 값 변경시 처리하기 - uniformGridLayoutSettingsNumberBox_ValueChanged(sender, e)

        /// <summary>
        /// 유니폼 그리드 레이아웃 설정 넘버 박스 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void uniformGridLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)
        {
            if(this.uniformGridLayout != null)
            {
                this.uniformGridLayout.MinColumnSpacing     = this.minColumnSpacingNumberBox.Value;
                this.uniformGridLayout.MinRowSpacing        = this.minRowSpacingNumberBox.Value;
                this.uniformGridLayout.MaximumRowsOrColumns = (int)this.mximumRowsOrColumnsNumberBox.Value;
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 선형 플로우 레이아웃 설정 적용하기 - ApplyLinedFlowLayoutSettings()

        /// <summary>
        /// 선형 플로우 레이아웃 설정 적용하기
        /// </summary>
        private void ApplyLinedFlowLayoutSettings()
        {
            if(this.linedFlowLayout != null && this.lineSpacingNumberBox != null && this.minItemSpacingNumberBox != null)
            {
                this.linedFlowLayout.LineSpacing    = this.lineSpacingNumberBox.Value;
                this.linedFlowLayout.MinItemSpacing = this.minItemSpacingNumberBox.Value;
            }
        }

        #endregion
        #region 선형 플로우 레이아웃 라인 높이 적용하기 - ApplyLinedFlowLayoutLineHeight()

        /// <summary>
        /// 선형 플로우 레이아웃 라인 높이 적용하기
        /// </summary>
        private void ApplyLinedFlowLayoutLineHeight()
        {
            if(this.linedFlowLayout != null && this.smallLineHeightRadioButton != null)
            {
                this.linedFlowLayout.LineHeight = (bool)this.smallLineHeightRadioButton.IsChecked ? 80 : 160;
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

331

332

333

334

335

336

337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355

using System.Collections.Generic;

using System.Collections.ObjectModel;

using System.Threading.Tasks;

using Microsoft.UI.Dispatching;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 선형 플로우 레이아웃

/// </summary>

private LinedFlowLayout linedFlowLayout = null;

/// <summary>

/// 선형 플로우 레이아웃 데이터 템플리트

/// </summary>

private DataTemplate linedFlowLayoutDataTemplate = null;

/// <summary>

/// 스택 레이아웃

/// </summary>

private StackLayout stackLayout = null;

/// <summary>

/// 스택 레이아웃 데이터 템플리트

/// </summary>

private DataTemplate stackLayoutDataTemplate = null;

/// <summary>

/// 유니폼 그리드 레이아웃

/// </summary>

private UniformGridLayout uniformGridLayout = null;

/// <summary>

/// 유니폼 그리드 레이아웃 데이터 템플리트

/// </summary>

private DataTemplate uniformGridLayoutDataTemplate = null;

/// <summary>

/// 선형 플로우 레이아웃 라인 높이 비동기 적용 여부

/// </summary>

private bool applyLinedFlowLayoutLineHeightAsync = false;

/// <summary>

/// 선형 플로우 레이아웃 옵션 비동기 적용 여부

/// </summary>

private bool applyLinedFlowLayoutOptionsAsync = false;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.border.Loaded += border_Loaded;

this.linedFlowLayoutRadioButton.Checked += layoutRadioButton_Checked;

this.uniformGridLayoutRadioButton.Checked += layoutRadioButton_Checked;

this.stackLayoutRadioButton.Checked += layoutRadioButton_Checked;

this.lineSpacingNumberBox.ValueChanged += linedFlowLayoutSettingsNumberBox_ValueChanged;

this.minItemSpacingNumberBox.ValueChanged += linedFlowLayoutSettingsNumberBox_ValueChanged;

this.smallLineHeightRadioButton.Checked += lineHeightRadioButton_Checked;

this.largeLineHeightRadioButton.Checked += lineHeightRadioButton_Checked;

this.spacingNumberBox.ValueChanged += stackLayoutSettingsNumberBox_ValueChanged;

this.minColumnSpacingNumberBox.ValueChanged += uniformGridLayoutSettingsNumberBox_ValueChanged;

this.minRowSpacingNumberBox.ValueChanged += uniformGridLayoutSettingsNumberBox_ValueChanged;

this.mximumRowsOrColumnsNumberBox.ValueChanged += uniformGridLayoutSettingsNumberBox_ValueChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 테두리 로드시 처리하기 - border_Loaded(sender, e)

/// <summary>

/// 테두리 로드시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void border_Loaded(object sender, RoutedEventArgs e)

{

if(this.itemsView != null)

{

this.itemsView.ScrollView.ViewChanged += itemsViewScrollView_ViewChanged;

this.linedFlowLayout = this.itemsView.Layout as LinedFlowLayout;

this.linedFlowLayoutDataTemplate = this.itemsView.ItemTemplate as DataTemplate;

}

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(includeAllItems: true);

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

Task.Run

(

delegate ()

{

_ = DispatcherQueue.TryEnqueue

(

DispatcherQueuePriority.Low,

() =>

{

if(this.itemsView != null)

{

this.itemsView.ItemsSource = sourceCollection;

}

);

}

);

}

#endregion

#region 아이템 뷰 스크롤 뷰 뷰 변경시 처리하기 - itemsViewScrollView_ViewChanged(sender, e)

/// <summary>

/// 아이템 뷰 스크롤 뷰 뷰 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void itemsViewScrollView_ViewChanged(ScrollView sender, object e)

{

if(sender.VerticalOffset == 0 && (this.applyLinedFlowLayoutOptionsAsync || this.applyLinedFlowLayoutLineHeightAsync))

{

if(this.applyLinedFlowLayoutOptionsAsync)

{

this.applyLinedFlowLayoutOptionsAsync = false;

ApplyLinedFlowLayoutSettings();

}

if(this.applyLinedFlowLayoutLineHeightAsync)

{

this.applyLinedFlowLayoutLineHeightAsync = false;

ApplyLinedFlowLayoutLineHeight();

}

#endregion

#region 레이아웃 라디오 버튼 체크시 처리하기 - layoutRadioButton_Checked(sender, e)

/// <summary>

/// 레이아웃 라디오 버튼 체크시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void layoutRadioButton_Checked(object sender, RoutedEventArgs e)

{

if(sender is RadioButton radioButton && this.itemsView != null)

{

switch(radioButton.Content.ToString())

{

case "LinedFlowLayout" :

if(this.linedFlowLayout != null && this.linedFlowLayoutDataTemplate != null)

{

this.itemsView.Layout = this.linedFlowLayout;

this.itemsView.ItemTemplate = this.linedFlowLayoutDataTemplate;

this.linedFlowLayoutSettingStackPanel.Visibility = Visibility.Visible;

this.stackLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;

this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;

}

break;

case "StackLayout" :

if(this.stackLayout == null)

{

this.stackLayout = new StackLayout() { Spacing = 5 };

}

if(this.stackLayoutDataTemplate == null)

{

this.stackLayoutDataTemplate = this.border.Resources["StackLayoutDataTemplateKey"] as DataTemplate;

}

this.itemsView.Layout = this.stackLayout;

this.itemsView.ItemTemplate = this.stackLayoutDataTemplate;

this.linedFlowLayoutSettingStackPanel.Visibility = Visibility.Collapsed;

this.stackLayoutSettingsStackPanel.Visibility = Visibility.Visible;

this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;

break;

case "UniformGridLayout" :

if(this.uniformGridLayout == null)

{

this.uniformGridLayout = new UniformGridLayout()

{

MinRowSpacing = 5,

MinColumnSpacing = 5,

MaximumRowsOrColumns = 3

};

}

if(this.uniformGridLayoutDataTemplate == null)

{

this.uniformGridLayoutDataTemplate = this.border.Resources["UniformGridLayoutDataTemplateKey"] as DataTemplate;

}

this.itemsView.Layout = this.uniformGridLayout;

this.itemsView.ItemTemplate = this.uniformGridLayoutDataTemplate;

this.linedFlowLayoutSettingStackPanel.Visibility = Visibility.Collapsed;

this.stackLayoutSettingsStackPanel.Visibility = Visibility.Collapsed;

this.uniformGridLayoutSettingsStackPanel.Visibility = Visibility.Visible;

break;

}

#endregion

#region 선형 플로우 레이아웃 설정 넘버 박스 값 변경시 처리하기 - linedFlowLayoutSettingsNumberBox_ValueChanged(sender, e)

/// <summary>

/// 선형 플로우 레이아웃 설정 넘버 박스 값 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void linedFlowLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)

{

if(this.itemsView != null && this.itemsView.ScrollView != null && this.itemsView.ScrollView.VerticalOffset != 0)

{

this.itemsView.ScrollView.ScrollTo(0, 0, new ScrollingScrollOptions(ScrollingAnimationMode.Disabled, ScrollingSnapPointsMode.Ignore));

this.applyLinedFlowLayoutOptionsAsync = true;

}

else

{

ApplyLinedFlowLayoutSettings();

}

#endregion

#region 라인 높이 라디오 버튼 체크시 처리하기 - lineHeightRadioButton_Checked(sender, e)

/// <summary>

/// 라인 높이 라디오 버튼 체크시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void lineHeightRadioButton_Checked(object sender, RoutedEventArgs e)

{

if(this.itemsView != null && this.itemsView.ScrollView != null && this.itemsView.ScrollView.VerticalOffset != 0)

{

this.itemsView.ScrollView.ScrollTo(0, 0, new ScrollingScrollOptions(ScrollingAnimationMode.Disabled, ScrollingSnapPointsMode.Ignore));

this.applyLinedFlowLayoutLineHeightAsync = true;

}

else

{

ApplyLinedFlowLayoutLineHeight();

}

#endregion

#region 스택 레이아웃 설정 넘버 박스 값 변경시 처리하기 - stackLayoutSettingsNumberBox_ValueChanged(sender, e)

/// <summary>

/// 스택 레이아웃 설정 넘버 박스 값 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void stackLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)

{

if(this.stackLayout != null)

{

this.stackLayout.Spacing = this.spacingNumberBox.Value;

}

#endregion

#region 유니폼 그리드 레이아웃 설정 넘버 박스 값 변경시 처리하기 - uniformGridLayoutSettingsNumberBox_ValueChanged(sender, e)

/// <summary>

/// 유니폼 그리드 레이아웃 설정 넘버 박스 값 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void uniformGridLayoutSettingsNumberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)

{

if(this.uniformGridLayout != null)

{

this.uniformGridLayout.MinColumnSpacing = this.minColumnSpacingNumberBox.Value;

this.uniformGridLayout.MinRowSpacing = this.minRowSpacingNumberBox.Value;

this.uniformGridLayout.MaximumRowsOrColumns = (int)this.mximumRowsOrColumnsNumberBox.Value;

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 선형 플로우 레이아웃 설정 적용하기 - ApplyLinedFlowLayoutSettings()

/// <summary>

/// 선형 플로우 레이아웃 설정 적용하기

/// </summary>

private void ApplyLinedFlowLayoutSettings()

{

if(this.linedFlowLayout != null && this.lineSpacingNumberBox != null && this.minItemSpacingNumberBox != null)

{

this.linedFlowLayout.LineSpacing = this.lineSpacingNumberBox.Value;

this.linedFlowLayout.MinItemSpacing = this.minItemSpacingNumberBox.Value;

}

#endregion

#region 선형 플로우 레이아웃 라인 높이 적용하기 - ApplyLinedFlowLayoutLineHeight()

/// <summary>

/// 선형 플로우 레이아웃 라인 높이 적용하기

/// </summary>

private void ApplyLinedFlowLayoutLineHeight()

{

if(this.linedFlowLayout != null && this.smallLineHeightRadioButton != null)

{

this.linedFlowLayout.LineHeight = (bool)this.smallLineHeightRadioButton.IsChecked ? 80 : 160;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] ItemsView 엘리먼트 : ItemTemplate 속성/ItemInvoked 이벤트 사용하기

■ ItemsView 엘리먼트의 ItemTemplate 속성과 ItemInvoked 이벤트를 사용하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <StackPanel Margin="10">
        <StackPanel.Resources>
            <DataTemplate x:Key="ImageDataTemplateKey" x:DataType="local:CustomDataObject">
                <ItemContainer
                    HorizontalAlignment="Left"
                    Width="200"
                    Height="140">
                    <Image
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Margin="5"
                        Stretch="UniformToFill"
                        Source="{x:Bind ImageLocation}" />
                </ItemContainer>
            </DataTemplate>
        </StackPanel.Resources>
        <ItemsView Name="itemsView"
            ItemTemplate="{StaticResource ImageDataTemplateKey}"
            HorizontalAlignment="Left"
            Width="220"
            Height="450"
            IsItemInvokedEnabled="True" />
        <TextBlock Name="textBlock"
            Margin="0 10 0 0" />
    </StackPanel>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<StackPanel.Resources>

<ItemContainer

HorizontalAlignment="Left"

Width="200"

Height="140">

<Image

HorizontalAlignment="Center"

VerticalAlignment="Center"

Margin="5"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

</ItemContainer>

</DataTemplate>

</StackPanel.Resources>

<ItemsView Name="itemsView"

ItemTemplate="{StaticResource ImageDataTemplateKey}"

HorizontalAlignment="Left"

Width="220"

Height="450"

IsItemInvokedEnabled="True" />

<TextBlock Name="textBlock"

Margin="0 10 0 0" />

</StackPanel>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(true);

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            this.itemsView.ItemsSource = sourceCollection;

            this.itemsView.ItemInvoked += itemsView_ItemInvoked;
        }

        #endregion

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

        #region 아이템 뷰 항목 호출시 처리하기 - itemsView_ItemInvoked(sender, e)

        /// <summary>
        /// 아이템 뷰 항목 호출시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void itemsView_ItemInvoked(ItemsView sender, ItemsViewItemInvokedEventArgs e)
        {
            this.textBlock.Text = $"You invoked {(e.InvokedItem as CustomDataObject).Title}.";
        }

        #endregion
    }
}

using System.Collections.Generic;

using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList(true);

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

this.itemsView.ItemsSource = sourceCollection;

this.itemsView.ItemInvoked += itemsView_ItemInvoked;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 아이템 뷰 항목 호출시 처리하기 - itemsView_ItemInvoked(sender, e)

/// <summary>

/// 아이템 뷰 항목 호출시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void itemsView_ItemInvoked(ItemsView sender, ItemsViewItemInvokedEventArgs e)

{

this.textBlock.Text = $"You invoked {(e.InvokedItem as CustomDataObject).Title}.";

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] GridView 엘리먼트 : ItemTemplate/AllowDrop/CanDragItems/CanReorderItems/IsItemClickEnabled/FlowDirection/SelectionMode 속성 사용하기

■ GridView 엘리먼트의 ItemTemplate/AllowDrop/CanDragItems/CanReorderItems/IsItemClickEnabled/FlowDirection/SelectionMode 속성을 사용하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Border Name="border"
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black">
        <Border.Resources>
            <DataTemplate x:Key="ImageDataTemplateKey" x:DataType="local:CustomDataObject">
                <Image
                    Width="190"
                    Height="130"
                    Stretch="UniformToFill"
                    Source="{x:Bind ImageLocation}" />
            </DataTemplate>
            <DataTemplate x:Key="IconTextDataTemplateKey" x:DataType="local:CustomDataObject">
                <RelativePanel
                    Width="280"
                    MinHeight="160">
                    <Image Name="image"
                        Width="18"
                        Margin="0 5 0 0"
                        RelativePanel.AlignLeftWithPanel="True"
                        RelativePanel.AlignTopWithPanel="True"
                        Stretch="Uniform"
                        Source="{x:Bind ImageLocation}" />
                    <TextBlock Name="titleTextBlock"
                        Style="{StaticResource BaseTextBlockStyle}"
                        Margin="10 0 0 0"
                        RelativePanel.RightOf="image"
                        RelativePanel.AlignTopWithPanel="True"
                        Text="{x:Bind Title}" />
                    <TextBlock
                        Style="{StaticResource CaptionTextBlockStyle}"
                        Margin="0 5 10 0"
                        RelativePanel.Below="titleTextBlock"
                        TextWrapping="Wrap"
                        TextTrimming="WordEllipsis"
                        Text="{x:Bind Description}" />
                </RelativePanel>
            </DataTemplate>
            <DataTemplate x:Key="ImageTextDataTemplateKey" x:DataType="local:CustomDataObject">
                <Grid Width="280">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"   />
                    </Grid.ColumnDefinitions>
                    <Image Grid.Column="0"
                        VerticalAlignment="Top"
                        Height="100"
                        Stretch="Fill"
                        Source="{x:Bind ImageLocation}" />
                    <StackPanel Grid.Column="1"
                        Margin="10 0 0 10">
                        <TextBlock
                            Style="{ThemeResource SubtitleTextBlockStyle}"
                            Margin="0 0 0 10"
                            Text="{x:Bind Title}" />
                        <StackPanel Orientation="Horizontal">
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Text="{x:Bind Views}" />
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Text=" Views" />
                        </StackPanel>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Text="{x:Bind Likes}" />
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Text=" Likes" />
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </DataTemplate>
            <DataTemplate x:Key="TextDataTemplateKey" x:DataType="local:CustomDataObject">
                <StackPanel
                    Width="240"
                    Orientation="Horizontal">
                    <TextBlock
                        Style="{StaticResource TitleTextBlockStyle}"
                        Margin="10 0 0 0"
                        Text="{x:Bind Title}" />
                </StackPanel>
            </DataTemplate>
        </Border.Resources>
        <Grid Margin="10">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"    />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"    />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <GridView Name="gridView" Grid.Row="0" Grid.Column="0"
                ItemTemplate="{StaticResource ImageDataTemplateKey}"
                AllowDrop="{x:Bind allowDropCheckBox.IsChecked.Value, Mode=OneWay}"
                CanDragItems="{x:Bind canDragItemsCheckBox.IsChecked.Value, Mode=OneWay}"
                CanReorderItems="{x:Bind canReorderItemsCheckBox.IsChecked.Value, Mode=OneWay}"
                IsItemClickEnabled="{x:Bind isItemClickEnabledCheckBox.IsChecked.Value, Mode=OneWay}"
                FlowDirection="LeftToRight" />
            <StackPanel Grid.Row="1" Grid.Column="0">
                <TextBlock Name="countClickedTextBlock"  />
                <TextBlock Name="countSelectedTextBlock" />
            </StackPanel>
            <StackPanel Grid.Row="0" Grid.RowSpan="2" Grid.Column="1"
                Margin="10 0 0 0">
                <RadioButtons Header="ItemTemplate">
                    <RadioButton
                        GroupName="Template"
                        Tag="ImageDataTemplateKey"
                        IsChecked="True"
                        Content="Image"
                        Checked="templateRadioButton_Checked" />
                    <RadioButton
                        GroupName="Template"
                        Tag="IconTextDataTemplateKey"
                        Content="Icon/Text"
                        Checked="templateRadioButton_Checked" />
                    <RadioButton
                        GroupName="Template"
                        Tag="ImageTextDataTemplateKey"
                        Content="Image/Text"
                        Checked="templateRadioButton_Checked" />
                    <RadioButton
                        GroupName="Template"
                        Tag="TextDataTemplateKey"
                        Content="Text"
                        Checked="templateRadioButton_Checked" />
                </RadioButtons>
                <StackPanel>
                    <ToggleButton Name="reverseFlowDirectionToggleButton"
                        Margin="0 10 0 0"
                        Content="Reverse FlowDirection" />
                    <TextBlock
                        Margin="0 10 0 0"
                        Text="GridView Properties" />
                    <CheckBox Name="isItemClickEnabledCheckBox"
                        Margin="0 5 0 0"
                        Content="IsItemClickEnabled" />
                    <CheckBox Name="canDragItemsCheckBox"
                        Margin="0 5 0 0"
                        Content="CanDragItems" />
                    <CheckBox Name="canReorderItemsCheckBox"
                        Margin="0 5 0 0"
                        Content="CanReorderItems" />
                    <CheckBox Name="allowDropCheckBox"
                        Margin="0 5 0 0"
                        Content="AllowDrop" />
                    <ComboBox Name="selectionModeComboBox"
                        Margin="0 5 0 0"
                        Header="SelectionMode"
                        SelectedIndex="1">
                        <x:String>None</x:String>
                        <x:String>Single</x:String>
                        <x:String>Multiple</x:String>
                        <x:String>Extended</x:String>
                    </ComboBox>
                </StackPanel>
            </StackPanel>
        </Grid>
    </Border>
</Window>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Border Name="border"

Margin="10"

BorderThickness="1"

BorderBrush="Black">

<Border.Resources>

<Image

Width="190"

Height="130"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

</DataTemplate>

<RelativePanel

Width="280"

MinHeight="160">

<Image Name="image"

Width="18"

Margin="0 5 0 0"

RelativePanel.AlignLeftWithPanel="True"

RelativePanel.AlignTopWithPanel="True"

Stretch="Uniform"

Source="{x:Bind ImageLocation}" />

<TextBlock Name="titleTextBlock"

Style="{StaticResource BaseTextBlockStyle}"

Margin="10 0 0 0"

RelativePanel.RightOf="image"

RelativePanel.AlignTopWithPanel="True"

Text="{x:Bind Title}" />

<TextBlock

Style="{StaticResource CaptionTextBlockStyle}"

Margin="0 5 10 0"

RelativePanel.Below="titleTextBlock"

TextWrapping="Wrap"

TextTrimming="WordEllipsis"

Text="{x:Bind Description}" />

</RelativePanel>

</DataTemplate>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Image Grid.Column="0"

VerticalAlignment="Top"

Height="100"

Stretch="Fill"

Source="{x:Bind ImageLocation}" />

<StackPanel Grid.Column="1"

Margin="10 0 0 10">

<TextBlock

Style="{ThemeResource SubtitleTextBlockStyle}"

Margin="0 0 0 10"

Text="{x:Bind Title}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text="{x:Bind Views}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text=" Views" />

</StackPanel>

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Text=" Likes" />

</StackPanel>

</Grid>

</DataTemplate>

<StackPanel

Width="240"

Orientation="Horizontal">

<TextBlock

Style="{StaticResource TitleTextBlockStyle}"

Margin="10 0 0 0"

Text="{x:Bind Title}" />

</StackPanel>

</DataTemplate>

</Border.Resources>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<GridView Name="gridView" Grid.Row="0" Grid.Column="0"

ItemTemplate="{StaticResource ImageDataTemplateKey}"

AllowDrop="{x:Bind allowDropCheckBox.IsChecked.Value, Mode=OneWay}"

CanDragItems="{x:Bind canDragItemsCheckBox.IsChecked.Value, Mode=OneWay}"

CanReorderItems="{x:Bind canReorderItemsCheckBox.IsChecked.Value, Mode=OneWay}"

IsItemClickEnabled="{x:Bind isItemClickEnabledCheckBox.IsChecked.Value, Mode=OneWay}"

FlowDirection="LeftToRight" />

</StackPanel>

<StackPanel Grid.Row="0" Grid.RowSpan="2" Grid.Column="1"

Margin="10 0 0 0">

<RadioButton

GroupName="Template"

Tag="ImageDataTemplateKey"

IsChecked="True"

Content="Image"

Checked="templateRadioButton_Checked" />

<RadioButton

GroupName="Template"

Tag="IconTextDataTemplateKey"

Content="Icon/Text"

Checked="templateRadioButton_Checked" />

<RadioButton

GroupName="Template"

Tag="ImageTextDataTemplateKey"

Content="Image/Text"

Checked="templateRadioButton_Checked" />

<RadioButton

GroupName="Template"

Tag="TextDataTemplateKey"

Content="Text"

Checked="templateRadioButton_Checked" />

</RadioButtons>

<ToggleButton Name="reverseFlowDirectionToggleButton"

Margin="0 10 0 0"

Content="Reverse FlowDirection" />

<TextBlock

Margin="0 10 0 0"

Text="GridView Properties" />

<CheckBox Name="isItemClickEnabledCheckBox"

Margin="0 5 0 0"

Content="IsItemClickEnabled" />

<CheckBox Name="canDragItemsCheckBox"

Margin="0 5 0 0"

Content="CanDragItems" />

<CheckBox Name="canReorderItemsCheckBox"

Margin="0 5 0 0"

Content="CanReorderItems" />

<CheckBox Name="allowDropCheckBox"

Margin="0 5 0 0"

Content="AllowDrop" />

<ComboBox Name="selectionModeComboBox"

Margin="0 5 0 0"

Header="SelectionMode"

SelectedIndex="1">

<x:String>None</x:String>

<x:String>Single</x:String>

<x:String>Multiple</x:String>

<x:String>Extended</x:String>

</ComboBox>

</StackPanel>

</Grid>

</Border>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            this.gridView.ItemsSource = sourceCollection;

            this.gridView.ItemClick                     += gridView_ItemClick;
            this.gridView.SelectionChanged              += gridView_SelectionChanged;
            this.reverseFlowDirectionToggleButton.Click += reverseFlowDirectionToggleButton_Click;
            this.isItemClickEnabledCheckBox.Click       += isItemClickEnabledCheckBox_Click;
            this.selectionModeComboBox.SelectionChanged += selectionModeComboBox_SelectionChanged;
        }

        #endregion

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

        #region 그리드 뷰 항목 클릭시 처리하기 - gridView_ItemClick(sender, e)

        /// <summary>
        /// 그리드 뷰 항목 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void gridView_ItemClick(object sender, ItemClickEventArgs e)
        {
            this.countClickedTextBlock.Text = $"You clicked {(e.ClickedItem as CustomDataObject).Title}.";
        }

        #endregion
        #region 그리드 뷰 선택 변경시 처리하기 - gridView_SelectionChanged(sender, e)

        /// <summary>
        /// 그리드 뷰 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void gridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(sender is GridView gridView)
            {
                this.countSelectedTextBlock.Text = $"You have selected {this.gridView.SelectedItems.Count} item(s).";
            }
        }

        #endregion
        #region 템플리트 라디오 버튼 체크시 처리하기 - templateRadioButton_Checked(sender, e)

        /// <summary>
        /// 템플리트 라디오 버튼 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void templateRadioButton_Checked(object sender, RoutedEventArgs e)
        {
            object tag = (sender as FrameworkElement).Tag;

            if(tag != null)
            {
                string templateName = tag.ToString();

                this.gridView.ItemTemplate = (DataTemplate)this.border.Resources[templateName];
            }
        }

        #endregion
        #region Reverse FlowDirection 토글 버튼 클릭시 처리하기 - reverseFlowDirectionToggleButton_Click(sender, e)

        /// <summary>
        /// Reverse FlowDirection 토글 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void reverseFlowDirectionToggleButton_Click(object sender, RoutedEventArgs e)
        {
            if(this.gridView.FlowDirection == FlowDirection.LeftToRight)
            {
                this.gridView.FlowDirection = FlowDirection.RightToLeft;
            }
            else
            {
                this.gridView.FlowDirection = FlowDirection.LeftToRight;
            }
        }

        #endregion
        #region IsItemClickEnabled 체크 박스 클릭시 처리하기 - isItemClickEnabledCheckBox_Click(sender, e)

        /// <summary>
        /// IsItemClickEnabled 체크 박스 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void isItemClickEnabledCheckBox_Click(object sender, RoutedEventArgs e)
        {
            this.countClickedTextBlock.Text = string.Empty;
        }

        #endregion
        #region 선택 모드 콤보 박스 선택 변경시 처리하기 - selectionModeComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 선택 모드 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void selectionModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.gridView != null)
            {
                string colorName = e.AddedItems[0].ToString();

                switch(colorName)
                {
                    case "None" :

                        this.gridView.SelectionMode = ListViewSelectionMode.None;

                        this.countSelectedTextBlock.Text = string.Empty;

                        break;

                    case "Single" :

                        this.gridView.SelectionMode = ListViewSelectionMode.Single;

                        break;

                    case "Multiple" :

                        this.gridView.SelectionMode = ListViewSelectionMode.Multiple;

                        break;

                    case "Extended" :

                        this.gridView.SelectionMode = ListViewSelectionMode.Extended;

                        break;
                }
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

using System.Collections.Generic;

using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

this.gridView.ItemsSource = sourceCollection;

this.gridView.ItemClick += gridView_ItemClick;

this.gridView.SelectionChanged += gridView_SelectionChanged;

this.reverseFlowDirectionToggleButton.Click += reverseFlowDirectionToggleButton_Click;

this.isItemClickEnabledCheckBox.Click += isItemClickEnabledCheckBox_Click;

this.selectionModeComboBox.SelectionChanged += selectionModeComboBox_SelectionChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 그리드 뷰 항목 클릭시 처리하기 - gridView_ItemClick(sender, e)

/// <summary>

/// 그리드 뷰 항목 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void gridView_ItemClick(object sender, ItemClickEventArgs e)

{

this.countClickedTextBlock.Text = $"You clicked {(e.ClickedItem as CustomDataObject).Title}.";

}

#endregion

#region 그리드 뷰 선택 변경시 처리하기 - gridView_SelectionChanged(sender, e)

/// <summary>

/// 그리드 뷰 선택 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void gridView_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(sender is GridView gridView)

{

this.countSelectedTextBlock.Text = $"You have selected {this.gridView.SelectedItems.Count} item(s).";

}

#endregion

#region 템플리트 라디오 버튼 체크시 처리하기 - templateRadioButton_Checked(sender, e)

/// <summary>

/// 템플리트 라디오 버튼 체크시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void templateRadioButton_Checked(object sender, RoutedEventArgs e)

{

object tag = (sender as FrameworkElement).Tag;

if(tag != null)

{

string templateName = tag.ToString();

this.gridView.ItemTemplate = (DataTemplate)this.border.Resources[templateName];

}

#endregion

#region Reverse FlowDirection 토글 버튼 클릭시 처리하기 - reverseFlowDirectionToggleButton_Click(sender, e)

/// <summary>

/// Reverse FlowDirection 토글 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void reverseFlowDirectionToggleButton_Click(object sender, RoutedEventArgs e)

{

if(this.gridView.FlowDirection == FlowDirection.LeftToRight)

{

this.gridView.FlowDirection = FlowDirection.RightToLeft;

}

else

{

this.gridView.FlowDirection = FlowDirection.LeftToRight;

}

#endregion

#region IsItemClickEnabled 체크 박스 클릭시 처리하기 - isItemClickEnabledCheckBox_Click(sender, e)

/// <summary>

/// IsItemClickEnabled 체크 박스 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void isItemClickEnabledCheckBox_Click(object sender, RoutedEventArgs e)

{

this.countClickedTextBlock.Text = string.Empty;

}

#endregion

#region 선택 모드 콤보 박스 선택 변경시 처리하기 - selectionModeComboBox_SelectionChanged(sender, e)

/// <summary>

/// 선택 모드 콤보 박스 선택 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void selectionModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.gridView != null)

{

string colorName = e.AddedItems[0].ToString();

switch(colorName)

{

case "None" :

this.gridView.SelectionMode = ListViewSelectionMode.None;

this.countSelectedTextBlock.Text = string.Empty;

break;

case "Single" :

this.gridView.SelectionMode = ListViewSelectionMode.Single;

break;

case "Multiple" :

this.gridView.SelectionMode = ListViewSelectionMode.Multiple;

break;

case "Extended" :

this.gridView.SelectionMode = ListViewSelectionMode.Extended;

break;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] GridView 엘리먼트 : ItemTemplate/ItemsPanel 속성을 사용해 레이아웃 커스텀마이징하기

■ GridView 엘리먼트의 ItemTemplate/ItemsPanel 속성을 사용해 레이아웃을 커스텀마이징하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Border
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black">
        <Border.Resources>
            <DataTemplate x:Key="ImageOverlayTemplate" x:DataType="local:CustomDataObject">
                <Grid Width="150">
                    <Image
                        Stretch="UniformToFill"
                        Source="{x:Bind ImageLocation}" />
                    <StackPanel
                        VerticalAlignment="Bottom"
                        Height="40"
                        Padding="5 1 5 1"
                        Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}"
                        Orientation="Vertical"
                        Opacity="0.75">
                        <TextBlock
                            Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                            Text="{x:Bind Title}" />
                        <StackPanel Orientation="Horizontal">
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                Text="{x:Bind Likes}" />
                            <TextBlock
                                Style="{ThemeResource CaptionTextBlockStyle}"
                                Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"
                                Text=" Likes" />
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </DataTemplate>
        </Border.Resources>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"   />
                <ColumnDefinition Width="200" />
            </Grid.ColumnDefinitions>
            <GridView Name="gridView" Grid.Column="0"
                Margin="10"
                ItemTemplate="{StaticResource ImageOverlayTemplate}">
                <GridView.ItemContainerStyle>
                    <Style TargetType="GridViewItem" BasedOn="{StaticResource DefaultGridViewItemStyle}">
                        <Setter Property="Margin" Value="5" />
                    </Style>
                </GridView.ItemContainerStyle>
                <GridView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <ItemsWrapGrid Name="itemsWrapGrid"
                            Orientation="Horizontal"
                            MaximumRowsOrColumns="3"
                            Loaded="itemsWrapGrid_InitWrapGrid" />
                    </ItemsPanelTemplate>
                </GridView.ItemsPanel>
            </GridView>
            <StackPanel Grid.Column="1"
                Margin="0 10 10 0">
                <StackPanel.Resources>
                    <Style x:Key="DefaultNumberBoxStyleKey" TargetType="NumberBox">
                        <Setter Property="SpinButtonPlacementMode"    Value="Inline"   />
                        <Setter Property="SmallChange"                Value="1"        />
                        <Setter Property="HorizontalAlignment"        Value="Stretch"  />
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"  />
                        <Setter Property="MaxWidth"                   Value="250"      />
                    </Style>
                </StackPanel.Resources>
                <NumberBox Name="columnSpaceNumberBox"
                    Style="{ThemeResource DefaultNumberBoxStyleKey}"
                    Header="Space between columns"
                    Minimum="0"
                    Maximum="100"
                    Value="5" />
                <NumberBox Name="rowSpaceNumberBox"
                    Style="{ThemeResource DefaultNumberBoxStyleKey}"
                    Margin="0 10 0 0"
                    Header="Space between rows"
                    Minimum="0"
                    Maximum="100"
                    Value="5" />
                <NumberBox Name="wrapItemCountNumberBox"
                    Style="{ThemeResource DefaultNumberBoxStyleKey}"
                    Margin="0 10 0 0"
                    Header="Maximum number of items before wrapping"
                    Minimum="1"
                    Maximum="8"
                    Value="3" />
            </StackPanel>
        </Grid>
    </Border>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Border

Margin="10"

BorderThickness="1"

BorderBrush="Black">

<Border.Resources>

<Image

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

<StackPanel

VerticalAlignment="Bottom"

Height="40"

Padding="5 1 5 1"

Background="{ThemeResource SystemControlBackgroundBaseMediumBrush}"

Orientation="Vertical"

Opacity="0.75">

<TextBlock

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Title}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text="{x:Bind Likes}" />

<TextBlock

Style="{ThemeResource CaptionTextBlockStyle}"

Foreground="{ThemeResource SystemControlForegroundAltHighBrush}"

Text=" Likes" />

</StackPanel>

</Grid>

</DataTemplate>

</Border.Resources>

<Grid>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<GridView Name="gridView" Grid.Column="0"

Margin="10"

ItemTemplate="{StaticResource ImageOverlayTemplate}">

<GridView.ItemContainerStyle>

</Style>

</GridView.ItemContainerStyle>

<GridView.ItemsPanel>

<ItemsWrapGrid Name="itemsWrapGrid"

Orientation="Horizontal"

MaximumRowsOrColumns="3"

Loaded="itemsWrapGrid_InitWrapGrid" />

</ItemsPanelTemplate>

</GridView.ItemsPanel>

</GridView>

<StackPanel Grid.Column="1"

Margin="0 10 10 0">

<StackPanel.Resources>

</Style>

</StackPanel.Resources>

<NumberBox Name="columnSpaceNumberBox"

Style="{ThemeResource DefaultNumberBoxStyleKey}"

Header="Space between columns"

Minimum="0"

Maximum="100"

Value="5" />

<NumberBox Name="rowSpaceNumberBox"

Style="{ThemeResource DefaultNumberBoxStyleKey}"

Margin="0 10 0 0"

Header="Space between rows"

Minimum="0"

Maximum="100"

Value="5" />

<NumberBox Name="wrapItemCountNumberBox"

Style="{ThemeResource DefaultNumberBoxStyleKey}"

Margin="0 10 0 0"

Header="Maximum number of items before wrapping"

Minimum="1"

Maximum="8"

Value="3" />

</StackPanel>

</Grid>

</Border>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 항목 랩 그리그
        /// </summary>
        private ItemsWrapGrid itemsWrapGrid;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            this.gridView.ItemsSource = sourceCollection;

            this.columnSpaceNumberBox.ValueChanged   += numberBox_ValueChanged;
            this.rowSpaceNumberBox.ValueChanged      += numberBox_ValueChanged;
            this.wrapItemCountNumberBox.ValueChanged += numberBox_ValueChanged;
        }

        #endregion

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

        #region 항목 랩 그리드 초기화시 처리하기 - itemsWrapGrid_InitWrapGrid(sender, e)

        /// <summary>
        /// 항목 랩 그리드 초기화시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void itemsWrapGrid_InitWrapGrid(object sender, RoutedEventArgs e)
        {
            this.itemsWrapGrid = sender as ItemsWrapGrid;

            this.itemsWrapGrid.MaximumRowsOrColumns = 3;
        }

        #endregion
        #region 넘버 박스 값 변경시 처리하기 - numberBox_ValueChanged(sender, e)

        /// <summary>
        /// 넘버 박스 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void numberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)
        {
            if(this.itemsWrapGrid == null)
            {
                return;
            }

            if(sender == this.wrapItemCountNumberBox)
            {
                this.itemsWrapGrid.MaximumRowsOrColumns = (int)this.wrapItemCountNumberBox.Value;

                return;
            }

            int rowSpace    = (int)this.rowSpaceNumberBox.Value;
            int columnSpace = (int)this.columnSpaceNumberBox.Value;

            for(int i = 0; i < this.gridView.Items.Count; i++)
            {
                GridViewItem item = this.gridView.ContainerFromIndex(i) as GridViewItem;

                Thickness thickness = item.Margin;

                thickness.Left   = columnSpace;
                thickness.Top    = rowSpace;
                thickness.Right  = columnSpace;
                thickness.Bottom = rowSpace;

                item.Margin = thickness;
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

using System.Collections.Generic;

using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 항목 랩 그리그

/// </summary>

private ItemsWrapGrid itemsWrapGrid;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

this.gridView.ItemsSource = sourceCollection;

this.columnSpaceNumberBox.ValueChanged += numberBox_ValueChanged;

this.rowSpaceNumberBox.ValueChanged += numberBox_ValueChanged;

this.wrapItemCountNumberBox.ValueChanged += numberBox_ValueChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 항목 랩 그리드 초기화시 처리하기 - itemsWrapGrid_InitWrapGrid(sender, e)

/// <summary>

/// 항목 랩 그리드 초기화시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void itemsWrapGrid_InitWrapGrid(object sender, RoutedEventArgs e)

{

this.itemsWrapGrid = sender as ItemsWrapGrid;

this.itemsWrapGrid.MaximumRowsOrColumns = 3;

}

#endregion

#region 넘버 박스 값 변경시 처리하기 - numberBox_ValueChanged(sender, e)

/// <summary>

/// 넘버 박스 값 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void numberBox_ValueChanged(NumberBox sender, NumberBoxValueChangedEventArgs e)

{

if(this.itemsWrapGrid == null)

{

return;

}

if(sender == this.wrapItemCountNumberBox)

{

this.itemsWrapGrid.MaximumRowsOrColumns = (int)this.wrapItemCountNumberBox.Value;

return;

}

int rowSpace = (int)this.rowSpaceNumberBox.Value;

int columnSpace = (int)this.columnSpaceNumberBox.Value;

for(int i = 0; i < this.gridView.Items.Count; i++)

{

GridViewItem item = this.gridView.ContainerFromIndex(i) as GridViewItem;

Thickness thickness = item.Margin;

thickness.Left = columnSpace;

thickness.Top = rowSpace;

thickness.Right = columnSpace;

thickness.Bottom = rowSpace;

item.Margin = thickness;

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] GridView 클래스 : ItemClick 이벤트를 사용해 항목 클릭하기

■ GridView 클래스의 ItemClick 이벤트를 사용해 항목을 클릭하는 방법을 보여준다. ▶ CustomDataObject.cs


using System;
using System.Collections.Generic;

namespace TestProject
{
    /// <summary>
    /// 커스텀 데이터 객체
    /// </summary>
    public class CustomDataObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 위치 - ImageLocation

        /// <summary>
        /// 이미지 위치
        /// </summary>
        public string ImageLocation { get; set; }

        #endregion
        #region 조회수 - Views

        /// <summary>
        /// 조회수
        /// </summary>
        public string Views { get; set; }

        #endregion
        #region 좋아요 - Likes

        /// <summary>
        /// 좋아요
        /// </summary>
        public string Likes { get; set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - CustomDataObject()

        /// <summary>
        /// 생성자
        /// </summary>
        public CustomDataObject()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

        /// <summary>
        /// 커스텀 데이터 객체 리스트 구하기
        /// </summary>
        /// <param name="includeAllItems">모든 항목 포함 여부</param>
        /// <returns>커스텀 데이터 객체 리스트</returns>
        public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)
        {
            string[] dummyTextArray = new string[]
            {
                @"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id facilisis lectus. Cras nec convallis ante, quis pulvinar tellus. Integer dictum accumsan pulvinar. Pellentesque eget enim sodales sapien vestibulum consequat.",
                @"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",
                @"Quisque accumsan pretium ligula in faucibus. Mauris sollicitudin augue vitae lorem cursus condimentum quis ac mauris. Pellentesque quis turpis non nunc pretium sagittis. Nulla facilisi. Maecenas eu lectus ante. Proin eleifend vel lectus non tincidunt. Fusce condimentum luctus nisi, in elementum ante tincidunt nec.",
                @"Aenean in nisl at elit venenatis blandit ut vitae lectus. Praesent in sollicitudin nunc. Pellentesque justo augue, pretium at sem lacinia, scelerisque semper erat. Ut cursus tortor at metus lacinia dapibus.",
                @"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",
                @"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",
                @"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",
                @"Duis facilisis, quam ut laoreet commodo, elit ex aliquet massa, non varius tellus lectus et nunc. Donec vitae risus ut ante pretium semper. Phasellus consectetur volutpat orci, eu dapibus turpis. Fusce varius sapien eu mattis pharetra.",
            };

            Random random = new Random();

            int count = includeAllItems ? 13 : 8;

            List<CustomDataObject> targetList = new List<CustomDataObject>();

            for(int i = 0; i < count; i++)
            {
                targetList.Add
                (
                    new CustomDataObject()
                    {
                        Title         = $"Item {i + 1}",
                        ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",
                        Views         = random.Next(100, 999).ToString(),
                        Likes         = random.Next(10, 99).ToString(),
                        Description   = dummyTextArray[i % dummyTextArray.Length],
                    }
                );
            }

            return targetList;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

using System;

using System.Collections.Generic;

namespace TestProject

{

/// <summary>

/// 커스텀 데이터 객체

/// </summary>

public class CustomDataObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 위치 - ImageLocation

/// <summary>

/// 이미지 위치

/// </summary>

public string ImageLocation { get; set; }

#endregion

#region 조회수 - Views

/// <summary>

/// 조회수

/// </summary>

public string Views { get; set; }

#endregion

#region 좋아요 - Likes

/// <summary>

/// 좋아요

/// </summary>

public string Likes { get; set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomDataObject()

/// <summary>

/// 생성자

/// </summary>

public CustomDataObject()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 커스텀 데이터 객체 리스트 구하기 - GetCustomDataObjectList(includeAllItems)

/// <summary>

/// 커스텀 데이터 객체 리스트 구하기

/// </summary>

/// <param name="includeAllItems">모든 항목 포함 여부</param>

/// <returns>커스텀 데이터 객체 리스트</returns>

public static List<CustomDataObject> GetCustomDataObjectList(bool includeAllItems = false)

{

string[] dummyTextArray = new string[]

{

@"Nullam eget mattis metus. Donec pharetra, tellus in mattis tincidunt, magna ipsum gravida nibh, vitae lobortis ante odio vel quam.",

@"Ut consequat magna luctus justo egestas vehicula. Integer pharetra risus libero, et posuere justo mattis et.",

@"Proin malesuada, libero vitae aliquam venenatis, diam est faucibus felis, vitae efficitur erat nunc non mauris. Suspendisse at sodales erat.",

@"Aenean vulputate, turpis non tincidunt ornare, metus est sagittis erat, id lobortis orci odio eget quam. Suspendisse ex purus, lobortis quis suscipit a, volutpat vitae turpis.",

};

Random random = new Random();

int count = includeAllItems ? 13 : 8;

List<CustomDataObject> targetList = new List<CustomDataObject>();

for(int i = 0; i < count; i++)

{

targetList.Add

(

new CustomDataObject()

{

Title = $"Item {i + 1}",

ImageLocation = $"/IMAGE/LandscapeImage{i + 1:d2}.jpg",

Views = random.Next(100, 999).ToString(),

Likes = random.Next(10, 99).ToString(),

Description = dummyTextArray[i % dummyTextArray.Length],

}

);

}

return targetList;

}

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <Border
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black">
        <Grid>
            <Grid.Resources>
                <DataTemplate x:Key="ImageDataTemplateKey" x:DataType="local:CustomDataObject">
                    <Image
                        Width="190"
                        Height="130"
                        Stretch="UniformToFill"
                        Source="{x:Bind ImageLocation}" />
                </DataTemplate>
            </Grid.Resources>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"    />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <GridView Name="gridView" Grid.Row="0"
                ItemTemplate="{StaticResource ImageDataTemplateKey}"
                Margin="10"
                SelectionMode="Single"
                IsItemClickEnabled="True">
            </GridView>
            <TextBlock x:Name="textBlock" Grid.Row="1"
                Margin="10 0 10 10" />
        </Grid>
    </Border>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<Border

Margin="10"

BorderThickness="1"

BorderBrush="Black">

<Grid>

<Grid.Resources>

<Image

Width="190"

Height="130"

Stretch="UniformToFill"

Source="{x:Bind ImageLocation}" />

</DataTemplate>

</Grid.Resources>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<GridView Name="gridView" Grid.Row="0"

ItemTemplate="{StaticResource ImageDataTemplateKey}"

Margin="10"

SelectionMode="Single"

IsItemClickEnabled="True">

</GridView>

<TextBlock x:Name="textBlock" Grid.Row="1"

Margin="10 0 10 10" />

</Grid>

</Border>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;
using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

            ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

            this.gridView.ItemsSource = sourceCollection;

            this.gridView.ItemClick += gridView_ItemClick;
        }

        #endregion

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

        #region 그리드 뷰 항목 클릭시 처리하기 - gridView_ItemClick(sender, e)

        /// <summary>
        /// 그리드 뷰 항목 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void gridView_ItemClick(object sender, ItemClickEventArgs e)
        {
            this.textBlock.Text = $"You clicked {(e.ClickedItem as CustomDataObject).Title}.";
        }

        #endregion
    }
}

using System.Collections.Generic;

using System.Collections.ObjectModel;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

List<CustomDataObject> sourceList = CustomDataObject.GetCustomDataObjectList();

ObservableCollection<CustomDataObject> sourceCollection = new ObservableCollection<CustomDataObject>(sourceList);

this.gridView.ItemsSource = sourceCollection;

this.gridView.ItemClick += gridView_ItemClick;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 그리드 뷰 항목 클릭시 처리하기 - gridView_ItemClick(sender, e)

/// <summary>

/// 그리드 뷰 항목 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void gridView_ItemClick(object sender, ItemClickEventArgs e)

{

this.textBlock.Text = $"You clicked {(e.ClickedItem as CustomDataObject).Title}.";

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] FlipView 엘리먼트 : ItemsPanel 속성을 사용해 수직 플립 뷰 만들기

■ FlipView 엘리먼트의 ItemsPanel 속성을 사용해 수직 플립 뷰를 만드는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TestProject">
    <FlipView
        HorizontalAlignment="Center"
        Width="400"
        Height="270">
        <Image Source="ms-appx:///IMAGE/cliff.jpg"   />
        <Image Source="ms-appx:///IMAGE/grapes.jpg"  />
        <Image Source="ms-appx:///IMAGE/rainier.jpg" />
        <Image Source="ms-appx:///IMAGE/sunset.jpg"  />
        <Image Source="ms-appx:///IMAGE/valley.jpg"  />
        <FlipView.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Vertical"/>
            </ItemsPanelTemplate>
        </FlipView.ItemsPanel>
    </FlipView>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

Title="TestProject">

<FlipView

HorizontalAlignment="Center"

Width="400"

Height="270">

<FlipView.ItemsPanel>

</ItemsPanelTemplate>

</FlipView.ItemsPanel>

</FlipView>

</Window>

TestProject.zip

[C#/WINUI3/.NET6] FlipView 엘리먼트 : ItemTemplate 속성을 사용해 데이터 바인딩하기

■ FlipView 엘리먼트의 ItemTemplate 속성을 사용해 데이터를 바인딩하는 방법을 보여준다. ▶ ImageItem.cs


namespace TestProject
{
    /// <summary>
    /// 이미지 항목
    /// </summary>
    public class ImageItem
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; set; }

        #endregion
        #region 이미지 경로 - ImagePath

        /// <summary>
        /// 이미지 경로
        /// </summary>
        public string ImagePath { get; set; }

        #endregion
    }
}

namespace TestProject

{

/// <summary>

/// 이미지 항목

/// </summary>

public class ImageItem

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 이미지 경로 - ImagePath

/// <summary>

/// 이미지 경로

/// </summary>

public string ImagePath { get; set; }

#endregion

}

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestProject"
    Title="TestProject">
    <FlipView
        Width="400"
        Height="400"
        BorderThickness="1"
        BorderBrush="Black"
        ItemsSource="{x:Bind ImageItemList, Mode=OneWay}">
        <FlipView.ItemTemplate>
            <DataTemplate x:DataType="local:ImageItem">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"    />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Image Grid.Row="0"
                        VerticalAlignment="Center"
                        Margin="10"
                        Stretch="Uniform"
                        Source="{x:Bind ImagePath}" />
                    <Border Grid.Row="1"
                        Height="60"
                        Background="#a5ffffff">
                        <TextBlock Name="Control2Text"
                            Style="{StaticResource TitleTextBlockStyle}"
                            HorizontalAlignment="Center"
                            Padding="10 10"
                            Foreground="Black"
                            Text="{x:Bind Title}" />
                    </Border>
                </Grid>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

xmlns:local="using:TestProject"

Title="TestProject">

<FlipView

Width="400"

Height="400"

BorderThickness="1"

BorderBrush="Black"

ItemsSource="{x:Bind ImageItemList, Mode=OneWay}">

<FlipView.ItemTemplate>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Image Grid.Row="0"

VerticalAlignment="Center"

Margin="10"

Stretch="Uniform"

Source="{x:Bind ImagePath}" />

<Border Grid.Row="1"

Height="60"

Background="#a5ffffff">

<TextBlock Name="Control2Text"

Style="{StaticResource TitleTextBlockStyle}"

HorizontalAlignment="Center"

Padding="10 10"

Foreground="Black"

Text="{x:Bind Title}" />

</Border>

</Grid>

</DataTemplate>

</FlipView.ItemTemplate>

</FlipView>

</Window>

▶ MainWindow.xaml.cs


using System.Collections.Generic;

using Microsoft.UI.Xaml;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public sealed partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 이미지 항목 리스트 - ImageItemList

        /// <summary>
        /// 이미지 항목 리스트
        /// </summary>
        public List<ImageItem> ImageItemList { get; } = new List<ImageItem>()
        {
            new ImageItem { Title = "cliff"  , ImagePath = "ms-appx:///IMAGE/cliff.jpg"   },
            new ImageItem { Title = "grapes" , ImagePath = "ms-appx:///IMAGE/grapes.jpg"  },
            new ImageItem { Title = "rainier", ImagePath = "ms-appx:///IMAGE/rainier.jpg" },
            new ImageItem { Title = "sunset" , ImagePath = "ms-appx:///IMAGE/sunset.jpg"  },
            new ImageItem { Title = "valley" , ImagePath = "ms-appx:///IMAGE/valley.jpg"  }
        };

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();
        }

        #endregion
    }
}

using System.Collections.Generic;

using Microsoft.UI.Xaml;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public sealed partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 이미지 항목 리스트 - ImageItemList

/// <summary>

/// 이미지 항목 리스트

/// </summary>

public List<ImageItem> ImageItemList { get; } = new List<ImageItem>()

{

new ImageItem { Title = "cliff" , ImagePath = "ms-appx:///IMAGE/cliff.jpg" },

new ImageItem { Title = "grapes" , ImagePath = "ms-appx:///IMAGE/grapes.jpg" },

new ImageItem { Title = "rainier", ImagePath = "ms-appx:///IMAGE/rainier.jpg" },

new ImageItem { Title = "sunset" , ImagePath = "ms-appx:///IMAGE/sunset.jpg" },

new ImageItem { Title = "valley" , ImagePath = "ms-appx:///IMAGE/valley.jpg" }

};

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET6] FlipView 엘리먼트 사용하기

■ FlipView 엘리먼트를 사용하는 방법을 보여준다. ▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TestProject">
    <FlipView
        HorizontalAlignment="Center"
        Width="400"
        Height="270">
        <Image Source="ms-appx:///IMAGE/cliff.jpg"   />
        <Image Source="ms-appx:///IMAGE/grapes.jpg"  />
        <Image Source="ms-appx:///IMAGE/rainier.jpg" />
        <Image Source="ms-appx:///IMAGE/sunset.jpg"  />
        <Image Source="ms-appx:///IMAGE/valley.jpg"  />
    </FlipView>
</Window>

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

<Window x:Class="TestProject.MainWindow"

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

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

Title="TestProject">

<FlipView

HorizontalAlignment="Center"

Width="400"

Height="270">

</FlipView>

</Window>

TestProject.zip