SelectionChanged 이벤트를
UWP XAML
SelectionChanged 사용 방법
ComboBox는 다음을 사용합니다.
콤보 상자 컨트롤에는 여러 가지가 있습니다.
Combobox는 단순히 선택하는 것이 아니라 항목을 선택했을 때 값에 따라 이벤트가 발생할 수 있습니다.
SelectionChanged 이벤트를
UWP XAML을 사용하는 방법
UWP의 Combobox는 XAML 태그를 사용하고 여러 태그를 선택 요소로 사용합니다. 콤보 상자의 역할은 여러 항목 중 하나를 선택할 수 있도록 하는 것입니다. 먼저 화면에 나
lgnat.tistory.com
선택 이벤트 SelectionChanged
SelectionChanged 이벤트를 등록하고 사용하여 UWP 콤보 상자를 선택할 때 특정 작업을 트리거할 수 있습니다.
아래는 태그에서 SelectionChanged를 호출하는 XAML입니다.
<ComboBox Name="콤보박스_컨트롤명" SelectionChanged="콤보박스_선택이벤트명_SelectionChanged">
<ComboBoxItem/>
<ComboBoxItem/>
<ComboBoxItem/>
....
</ComboBox>xaml 코드에 이벤트를 등록했으면 C# 코드인 xaml.cs에 이벤트를 실제로 실행하기 위한 코드를 추가해야 합니다.
다음은 xaml.cs로 작성된 SelectionChanged 이벤트를 보여줍니다.
/** 콤보박스 선택시 이벤트 실행 */
private void ComboBoxSample_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ComboBox cb = sender as ComboBox;
ComboBoxItem cbi = cb.Items(cb.SelectedIndex) as ComboBoxItem;
// 코드
}위의 코드는 UWP의 선택 이벤트인 SelectionChanged를 보여줍니다.
위에서 중요한 점은 SelectedIndex 부분입니다.
내
SelectedIndex는 숫자 인덱스로 선택된 자식 컨트롤을 사용자에게 알려줍니다.
선택한 인덱스를 찾으면 어떤 하위 컨트롤이 선택되었는지 확인할 수 있습니다.
전체 코드
UWP 콤보 상자에서 항목이 선택되면 C# 코드를 만들어 어떤 항목이 선택되는지 확인합니다.
작성 후 삽입
xaml.cs 코드에서 SelectionChanged에 대한 코드를 작성하고 어떤 값이 선택되었는지 메시지 창으로 표시합니다.
아래는 컨트롤을 만든 UWP XAML입니다.
<Page
x:Class="UWPAppTutorials.Ctl_ComboBoxPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UWPAppTutorials"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<StackPanel>
<ComboBox Name="ComboBoxSample" SelectionChanged="ComboBoxSample_SelectionChanged">
<ComboBoxItem Content="---- 선택하세요 ----" Tag="" IsSelected="True"></ComboBoxItem>
<ComboBoxItem Content="ItemText1" Tag="ItemValue1"></ComboBoxItem>
<ComboBoxItem Content="ItemText2" Tag="ItemValue2"></ComboBoxItem>
<ComboBoxItem Content="ItemText3" Tag="ItemValue3"></ComboBoxItem>
</ComboBox>
</StackPanel>
</Grid>
</Page>SelectionChanged 이벤트 코드는
xaml.cs 코드에서 SelectionChanged 이벤트를 구현하고 코드를 작성합니다.
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Popups;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
// 빈 페이지 항목 템플릿에 대한 설명은 https://go.microsoft.com/fwlink/?LinkId=234238에 나와 있습니다.
namespace UWPAppTutorials
{
/// <summary>
/// 자체적으로 사용하거나 프레임 내에서 탐색할 수 있는 빈 페이지입니다.
/// </summary>
public sealed partial class Ctl_ComboBoxPage : Page
{
public Ctl_ComboBoxPage()
{
this.InitializeComponent();
/** 윈도우 크기 초기화 */
InitSetWindowsSize();
}
/** MessageDialog 화면에 표시하기 */
async void ShowMessageDialog(string content)
{
var dialog = new MessageDialog(content);
await dialog.ShowAsync();
}
/** 윈도우 크기 초기화 */
void InitSetWindowsSize()
{
double width = 480;
double height = 320;
ApplicationView.GetForCurrentView().SetPreferredMinSize(new Size(width, height));
}
/** 콤보박스 선택시 이벤트 실행 */
private void ComboBoxSample_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ComboBox cb = sender as ComboBox;
int idxItem = cb.SelectedIndex;
if (idxItem == 0)
{
return;
}
ComboBoxItem cbi = cb.Items(cb.SelectedIndex) as ComboBoxItem;
object objTag = cbi.Tag;
object objContent = cbi.Content;
string content = "";
content += (cb.SelectedIndex + " 번째 :");
content += ("{");
content += (" 항목 : " + objTag);
content += (", 값 : " + objContent);
content += ("}");
ShowMessageDialog(content);
}
}
}SelectionChanged 이벤트 코드를 보면 SelectedIndex를 사용하여 값이 여러 개인 인덱스를 찾습니다.
에서 태그와 콘텐츠 값을 추가한 후
결과 화면은 이렇게 생겼습니다.
