컨트롤

샘플 찾아보기

.NET 다중 플랫폼 앱 UI(.NET MAUI) 앱의 사용자 인터페이스는 각 대상 플랫폼의 네이티브 컨트롤에 매핑되는 개체로 구성됩니다.

.NET MAUI 앱의 사용자 인터페이스를 만드는 데 사용되는 기본 컨트롤 그룹은 페이지, 레이아웃 및 보기입니다. .NET MAUI 페이지는 일반적으로 전체 화면 또는 창을 차지합니다. 페이지에는 일반적으로 보기 및 기타 레이아웃이 포함된 레이아웃이 포함되어 있습니다. 페이지, 레이아웃 및 뷰는 클래스에서 VisualElement 파생됩니다. 이 클래스는 파생 클래스에 유용한 다양한 속성, 메서드 및 이벤트를 제공합니다.

참고 항목

ListView 또한 TableView 셀 사용을 지원합니다. 셀은 테이블의 항목에 사용되는 특수 요소로, 각 항목을 렌더링하는 방법을 설명합니다.

페이지

.NET MAUI 앱은 하나 이상의 페이지로 구성됩니다. 페이지는 일반적으로 모든 화면 또는 창을 차지하며 각 페이지에는 일반적으로 하나 이상의 레이아웃이 포함됩니다.

.NET MAUI에는 다음 페이지가 포함되어 있습니다.

페이지	설명
ContentPage	ContentPage 는 단일 보기를 표시하며 가장 일반적인 페이지 유형입니다. 자세한 내용은 ContentPage를 참조 하세요.
FlyoutPage	FlyoutPage 는 두 개의 관련 정보 페이지, 즉 항목을 표시하는 플라이아웃 페이지와 플라이아웃 페이지의 항목에 대한 세부 정보를 제공하는 세부 정보 페이지를 관리하는 페이지입니다. 자세한 내용은 FlyoutPage를 참조 하세요.
NavigationPage	NavigationPage 는 원하는 대로 페이지, 앞뒤로 탐색할 수 있는 계층적 탐색 환경을 제공합니다. 자세한 내용은 NavigationPage를 참조 하세요.
TabbedPage	TabbedPage 는 페이지의 위쪽 또는 아래쪽에 있는 탭으로 탐색할 수 있는 일련의 페이지로 구성되며, 각 탭은 페이지 콘텐츠를 로드합니다. 자세한 내용은 TabbedPage를 참조 하세요.

레이아웃

.NET MAUI 레이아웃은 사용자 인터페이스 컨트롤을 시각적 구조로 구성하는 데 사용되며, 각 레이아웃에는 일반적으로 여러 보기가 포함됩니다. 레이아웃 클래스는 일반적으로 자식 요소의 위치와 크기를 설정하는 논리를 포함합니다.

.NET MAUI에는 다음과 같은 레이아웃이 포함됩니다.

레이아웃	설명
AbsoluteLayout	AbsoluteLayout 는 부모에 상대적인 특정 위치에 자식 요소를 배치합니다. 자세한 내용은 AbsoluteLayout을 참조하세요.
BindableLayout	BindableLayout 를 사용하면 각 항목의 모양을 설정하는 옵션을 사용하여 모든 레이아웃 클래스가 항목 컬렉션에 바인딩하여 콘텐츠를 생성할 수 있습니다. 자세한 내용은 BindableLayout을 참조하세요.
FlexLayout	FlexLayout 를 사용하면 자식이 서로 다른 맞춤 및 방향 옵션으로 쌓이거나 래핑될 수 있습니다. FlexLayout는 플렉스 레이아웃 또는 flex-box라고 하는 CSS 유연한 상자 레이아웃 모듈을 기반으로 합니다. 자세한 내용은 FlexLayout을 참조하세요.
Grid	Grid 는 자식 요소를 행과 열의 그리드에 배치합니다. 자세한 내용은 Grid를 참조하세요.
HorizontalStackLayout	HorizontalStackLayout 는 자식 요소를 가로 스택에 배치합니다. 자세한 내용은 HorizontalStackLayout을 참조하세요.
StackLayout	StackLayout 는 자식 요소를 세로 또는 가로 스택에 배치합니다. 자세한 내용은 StackLayout을 참조하세요.
VerticalStackLayout	VerticalStackLayout 는 자식 요소를 세로 스택에 배치합니다. 자세한 내용은 VerticalStackLayout을 참조하세요.

뷰

.NET MAUI 보기는 다른 환경에서 컨트롤 또는 위젯이라고 하는 레이블, 단추 및 슬라이더와 같은 UI 개체입니다.

.NET MAUI에는 다음 보기가 포함됩니다.

보기	설명
ActivityIndicator	ActivityIndicator 는 애니메이션을 사용하여 진행 상황을 표시하지 않고 앱이 긴 작업에 참여하고 있음을 표시합니다. 자세한 내용은 ActivityIndicator를 참조 하세요.
BlazorWebView	BlazorWebView 를 사용하면 .NET MAUI 앱에서 Blazor 웹앱을 호스트할 수 있습니다. 자세한 내용은 BlazorWebView를 참조 하세요.
Border	Border 는 다른 컨트롤 주위에 테두리, 배경 또는 둘 다를 그리는 컨테이너 컨트롤입니다. 자세한 내용은 테두리를 참조하세요.
BoxView	BoxView 지정된 너비, 높이 및 색의 사각형 또는 사각형을 그립니다. 자세한 내용은 BoxView를 참조 하세요.
Button	Button 는 텍스트를 표시하고 작업을 수행하도록 앱을 지시하는 탭 또는 클릭에 응답합니다. 자세한 내용은 단추를 참조 하세요.
CarouselView	CarouselView 는 사용자가 살짝 밀어 컬렉션을 이동할 수 있는 데이터 항목의 스크롤 가능한 목록을 표시합니다. 자세한 내용은 CarouselView를 참조 하세요.
CheckBox	CheckBox 를 사용하면 선택하거나 비울 수 있는 단추 유형을 사용하여 부울 값을 선택할 수 있습니다. 자세한 내용은 CheckBox를 참조 하세요.
CollectionView	CollectionView 는 다양한 레이아웃 사양을 사용하여 선택 가능한 데이터 항목의 스크롤 가능한 목록을 표시합니다. 자세한 내용은 CollectionView를 참조하세요.
ContentView	ContentView 는 재사용 가능한 사용자 지정 컨트롤을 만들 수 있는 컨트롤입니다. 자세한 내용은 ContentView를 참조하세요.
DatePicker	DatePicker 를 사용하면 플랫폼 날짜 선택기를 사용하여 날짜를 선택할 수 있습니다. 자세한 내용은 DatePicker를 참조하세요.
Editor	Editor 를 사용하면 여러 줄의 텍스트를 입력하고 편집할 수 있습니다. 자세한 내용은 편집기를 참조 하세요.
Ellipse	Ellipse 는 줄임표 또는 원을 표시합니다. 자세한 내용은 타원을 참조 하세요.
Entry	Entry 를 사용하면 한 줄의 텍스트를 입력하고 편집할 수 있습니다. 자세한 내용은 항목을 참조 하세요.
Frame	Frame 는 색, 그림자 및 기타 옵션으로 구성할 수 있는 테두리로 보기 또는 레이아웃을 래핑하는 데 사용됩니다. 자세한 내용은 Frame을 참조 하세요.
GraphicsView	GraphicsView 는 네임스페이스의 형식을 사용하여 2D 그래픽을 그릴 수 있는 그래픽 캔버스입니다 Microsoft.Maui.Graphics . 자세한 내용은 GraphicsView를 참조하세요.
Image	Image 는 로컬 파일, URI, 포함된 리소스 또는 스트림에서 로드할 수 있는 이미지를 표시합니다. 자세한 내용은 이미지를 참조 하세요.
ImageButton	ImageButton 은 이미지를 표시하고 작업을 수행하도록 앱을 지시하는 탭 또는 클릭에 응답합니다. 자세한 내용은 ImageButton을 참조 하세요.
IndicatorView	IndicatorView 의 항목 CarouselView수를 나타내는 표시기를 표시합니다. 자세한 내용은 IndicatorView를 참조 하세요.
Label	Label 는 한 줄 및 여러 줄 텍스트를 표시합니다. 자세한 내용은 레이블을 참조 하세요.
Line	Line 는 시작점에서 끝점까지의 선을 표시합니다. 자세한 내용은 선을 참조 하세요.
ListView	ListView 는 선택 가능한 데이터 항목의 스크롤 가능한 목록을 표시합니다. 자세한 내용은 ListView를 참조 하세요.
Map	Map 맵을 표시하고 Microsoft.Maui.Controls.Maps NuGet 패키지를 앱에 설치해야 합니다.
Path	Path 곡선 및 복합 셰이프를 표시합니다. 자세한 내용은 경로를 참조 하세요.
Picker	Picker 는 항목을 선택할 수 있는 항목의 짧은 목록을 표시합니다. 자세한 내용은 선택기를 참조 하세요.
Polygon	Polygon 다각형을 표시합니다. 자세한 내용은 다각형을 참조 하세요.
Polyline	Polyline 는 연결된 일련의 직선을 표시합니다. 자세한 내용은 Polyline을 참조 하세요.
ProgressBar	ProgressBar 는 애니메이션을 사용하여 앱이 긴 작업을 통해 진행 중임을 표시합니다. 자세한 내용은 ProgressBar를 참조 하세요.
RadioButton	RadioButton 는 집합에서 한 옵션을 선택할 수 있는 단추의 형식입니다. 자세한 내용은 RadioButton을 참조 하세요.
Rectangle	Rectangle 는 사각형 또는 사각형을 표시합니다. 자세한 내용은 사각형을 참조 하세요.
RefreshView	RefreshView 는 스크롤 가능한 콘텐츠에 대한 풀 투 새로 고침 기능을 제공하는 컨테이너 컨트롤입니다. 자세한 내용은 RefreshView를 참조 하세요.
RoundRectangle	RoundRectangle 는 모서리가 둥근 사각형 또는 사각형을 표시합니다. 자세한 내용은 사각형을 참조 하세요.
ScrollView	ScrollView 는 일반적으로 레이아웃인 콘텐츠의 스크롤을 제공합니다. 자세한 내용은 ScrollView를 참조 하세요.
SearchBar	SearchBar 는 검색을 시작하는 데 사용되는 사용자 입력 컨트롤입니다. 자세한 내용은 SearchBar를 참조 하세요.
Slider	Slider 를 사용하면 연속 범위에서 값을 선택할 double 수 있습니다. 자세한 내용은 슬라이더를 참조 하세요.
Stepper	Stepper 를 사용하면 증분 값 범위에서 값을 선택할 double 수 있습니다. 자세한 내용은 스테퍼를 참조하세요.
SwipeView	SwipeView 는 콘텐츠 항목을 둘러싸고 살짝 밀기 제스처로 표시되는 상황에 맞는 메뉴 항목을 제공하는 컨테이너 컨트롤입니다. 자세한 내용은 SwipeView를 참조 하세요.
Switch	Switch 를 사용하면 켜거나 끌 수 있는 단추 유형을 사용하여 부울 값을 선택할 수 있습니다. 자세한 내용은 Switch를 참조하세요.
TableView	TableView 는 섹션으로 그룹화할 수 있는 스크롤 가능한 항목의 테이블을 표시합니다. 자세한 내용은 TableView를 참조 하세요.
TimePicker	TimePicker 를 사용하면 플랫폼 시간 선택기를 사용하여 시간을 선택할 수 있습니다. 자세한 내용은 TimePicker를 참조하세요.
TwoPaneView	TwoPaneView 는 콘텐츠를 사용 가능한 공간에 나란히 배치하거나 위에서 아래로 배치하는 두 개의 뷰가 있는 컨테이너를 나타냅니다. 자세한 내용은 TwoPaneView를 참조 하세요.
WebView	WebView 는 웹 페이지 또는 로컬 HTML 콘텐츠를 표시합니다. 자세한 내용은 WebView를 참조 하세요.