■ FontIcon 엘리먼트의 FontFamily/Glyph 속성을 사용해 이모지 아이콘을 표시하는 방법을 보여준다.
※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다.
※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를 None으로 추가했다.
▶ Item.cs
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
namespace TestProject; /// <summary> /// 항목 /// </summary> public class Item { //////////////////////////////////////////////////////////////////////////////////////////////////// Property ////////////////////////////////////////////////////////////////////////////////////////// Public #region 10진수 코드 - DecimalCode /// <summary> /// 10진수 코드 /// </summary> public string DecimalCode { get; set; } #endregion #region 16진수 코드 - HexadecimalCode /// <summary> /// 16진수 코드 /// </summary> public string HexadecimalCode { get; set; } #endregion #region 이모지 문자 - EmojiCharacter /// <summary> /// 이모지 문자 /// </summary> public string EmojiCharacter { get; set; } #endregion } |
▶ MainPage.xaml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
<?xml version="1.0" encoding="utf-8"?> <Page x:Class="TestProject.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:TestProject" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" FontFamily="나눔고딕코딩" FontSize="16"> <ListView Name="listView" Margin="10" BorderThickness="1" BorderBrush="DarkGray" SelectionMode="Single"> <ListView.ItemTemplate> <DataTemplate x:DataType="local:Item"> <StackPanel Orientation="Horizontal" Padding="10" Spacing="10"> <TextBlock VerticalAlignment="Center" Width="100" Text="{x:Bind DecimalCode}" /> <TextBlock VerticalAlignment="Center" Width="100" Text="{x:Bind HexadecimalCode}" /> <FontIcon FontFamily="Segoe UI Emoji" FontSize="24" Glyph="{x:Bind EmojiCharacter}" /> </StackPanel> </DataTemplate> </ListView.ItemTemplate> <ListView.ItemContainerStyle> <Style TargetType="ListViewItem"> <Setter Property="HorizontalContentAlignment" Value="Stretch" /> </Style> </ListView.ItemContainerStyle> </ListView> </Page> |
▶ MainPage.xaml.cs
—————————————————————————————————-
using System.Collections.Generic;
using Microsoft.UI.Xaml.Controls;
namespace TestProject;
/// <summary>
/// 메인 페이지
/// </summary>
public sealed partial class MainPage : Page
{
//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
////////////////////////////////////////////////////////////////////////////////////////// Public
#region 생성자 – MainPage()
/// <summary>
/// 생성자
/// </summary>
public MainPage()
{
InitializeComponent();
List<Item> list = new List<Item>();
AddItem(list,127462, 127487);
AddItem(list,127744, 128591);
AddItem(list,128640, 128709);
AddItem(list,129292, 129535);
this.listView.ItemsSource = list;
}
#endregion
//////////////////////////////////////////////////////////////////////////////////////////////////// Method
////////////////////////////////////////////////////////////////////////////////////////// Private
#region 항목 추가하기 – AddItem(targetList, startCode, endCode)
/// <summary>
/// 항목 추가하기
/// </summary>
/// <param name="targetList">타겟 리스트</param>
/// <param name="startCode">시작 코드</param>
/// <param name="endCode">종료 코드</param>
private void AddItem(List<Item> targetList, int startCode, int endCode)
{
for(int i = startCode; i <= endCode; i++)
{
if(i >= 129443 && i <= 129444)
{
continue;
}
if(i >= 129451 && i <= 129453)
{
continue;
}
if(i >= 129483 && i <= 129484)
{
continue;
}
if(i >= 129483 && i <= 129484)
{
continue;
}
string emojiCharacter = char.ConvertFromUtf32(i);
targetList.Add
(
new Item
{
DecimalCode = i.ToString(),
HexadecimalCode = $"U+{i:X4}",
EmojiCharacter = emojiCharacter
}
);
}
}
#endregion
}
—————————————————————————————————-
