캔버스 앱의 갤러리 컨트롤Gallery control in canvas apps

다른 컨트롤을 포함하고 데이터 집합을 보여주는 컨트롤입니다.A control that contains other controls and shows a set of data.

설명Description

갤러리 컨트롤은 데이터 원본에서 여러 개의 레코드를 표시할 수 있으며, 각 레코드는 여러 형식의 데이터를 포함할 수 있습니다.A Gallery control can show multiple records from a data source, and each record can contain multiple types of data. 예를 들어, 갤러리 컨트롤은 여러 연락처를 보여줄 수 있으며, 각 항목은 각 연락처에 대한 이름, 주소, 전화 번호를 포함한 연락처 정보를 보여줍니다.For example, a Gallery control can show multiple contacts with each item showing contact information that includes a name, an address, and a phone number for each contact. 각 데이터 필드는 갤러리 컨트롤 내에서 별도의 컨트롤로 나타나며, 해당 템플릿에서 이러한 컨트롤을 구성할 수 있습니다.Each data field appears in a separate control within the Gallery control, and you can configure those controls in its template. 템플릿은 가로/세로 방향으로 갤러리 컨트롤의 왼쪽 가장자리, 그리고 세로/가로 방향로 갤러리 컨트롤의 상단에 갤러리 내부의 첫 번째 항목으로 나타냅니다.The template appears as the first item inside the gallery, on the left edge of a Gallery control in horizontal/landscape orientation and at the top of a Gallery control in vertical/portrait orientation. 템플릿에 적용한 변경 사항은 갤러리 컨트롤 전체에서 반영됩니다.Any changes that you make in the template are reflected throughout the Gallery control.

미리 정의 된 템플릿을 표시 이미지 및 텍스트 갤러리를 사용할 뿐만 아니라 가변 높이 항목에 대 한 갤러리에 대 한 합니다.Predefined templates for showing images and text in a gallery are available, as well as a gallery for variable-height items.

제한 사항Limitations

사용자가 스크롤할 경우 합니다 유연한 높이 모든 항목이 로드 되는 현재 보기 밀어넣어질 수 있습니다 뷰의 아래쪽 out 및 데이터 로드가 완료 되 면 항목 전에 갤러리 컨트롤입니다.If a user scrolls the Flexible height gallery control before all items are loaded, the item that's currently in view may be pushed down and out of view when the data loading is finished. 이 문제를 방지 하려면 표준 사용 갤러리 컨트롤 대신 합니다 유연한 높이 변형 합니다.To avoid this issue, use a standard Gallery control instead of the Flexible height variant.

주요 속성Key properties

Default – 앱이 시작하면 갤러리에서 선택할 데이터 원본의 항목 또는 레코드입니다.Default – The item or record from the data source to be selected in the gallery when the app starts up.

Items – 갤러리, 목록 또는 차트와 같은 컨트롤에 표시되는 데이터 원본입니다.Items – The source of data that appears in a control such as a gallery, a list, or a chart.

Selected – 선택한 항목입니다.Selected – The selected item.

추가 속성Additional properties

AccessibleLabel – 화면 읽기 프로그램에 대 한 갤러리 (항목이 아니라 포함)의 레이블을 지정 합니다.AccessibleLabel – Label of the gallery (not the items it contains) for screen readers. 항목 목록의 개념을 설명해야 합니다.Should describe what the list of items are.

AllItems – 갤러리의 템플릿에 속해 있는 추가 컨트롤 값을 포함하는 갤러리에 있는 모든 항목입니다.AllItems – All items in a gallery, including additional control values that are a part of the gallery's template.

BorderColor - 컨트롤의 테두리 색입니다.BorderColor – The color of a control's border.

BorderStyle - 컨트롤의 테두리는 Solid, Dashed, Dotted, None입니다.BorderStyle – Whether a control's border is Solid, Dashed, Dotted, or None.

BorderThickness - 컨트롤의 테두리 굵기입니다.BorderThickness – The thickness of a control's border.

DisplayMode – 컨트롤이 사용자 입력을 허용(편집)하거나, 데이터만 표시(보기)하거나 사용 안 하도록(사용 안 함) 설정할지 선택합니다.DisplayMode – Whether the control allows user input (Edit), only displays data (View), or is disabled (Disabled).

Fill - 컨트롤의 배경색입니다.Fill – The background color of a control.

Height – 컨트롤의 위쪽 및 아래쪽 가장자리 사이의 간격입니다.Height – The distance between a control's top and bottom edges.

ItemAccessibleLabel – 화면 읽기 프로그램에 대 한 각 갤러리 항목의 레이블입니다.ItemAccessibleLabel – Label of each gallery item for screen readers. 각 항목은 무엇을 설명 해야 합니다.Should describe what each item is.

NavigationStepShowNavigation 속성이 true로 설정되어 있고 사용자가 해당 갤러리 한쪽 끝에서 탐색 화살표를 선택할 경우 갤러리를 스크롤하는 정도입니다.NavigationStep – How far a gallery scrolls if its ShowNavigation property is set to true and the user selects a navigation arrow at either end of that gallery.

선택 가능한 – 갤러리 항목을 선택할 수 있는지 여부입니다.Selectable – Whether gallery items can be selected. 로 설정 하면 true, 화면 읽기 프로그램을 선택할 수 있는 목록으로 갤러리를 식별 하 고 클릭 하거나 탭 하 여 항목을 선택 합니다.When set to true, screen readers identify the gallery as a selectable list, and you select an item by clicking or tapping it. 로 설정 하면 false, 화면 판독기 일반 목록으로 갤러리를 식별 하 고 클릭 하거나 항목을 눌러 선택 하지 않습니다.When set to false, screen readers identify the gallery as a regular list, and clicking or tapping an item doesn't select it.

ShowNavigation – 사용자가 화살표를 클릭하거나 탭하여 갤러리에서 항목을 스크롤할 수 있도록 갤러리의 각 끝에 화살표를 나타낼지 여부를 선택합니다.ShowNavigation – Whether an arrow appears at each end of a gallery so that a user can scroll through the items in the gallery by clicking or tapping an arrow.

ShowScrollbar – 사용자가 갤러리를 마우스로 가리킬 때 스크롤바를 나타낼지 여부를 선택합니다.ShowScrollbar – Whether a scrollbar appears when the user hovers over a gallery.

Snap – 사용자가 갤러리를 스크롤할 때 다음 항목이 전체 화면으로 나타나도록 자동으로 맞출지 여부를 선택합니다.Snap – Whether, when a user scrolls through a gallery, it automatically snaps so that the next item appears in full.

TemplateFill – 갤러리의 배경색입니다.TemplateFill – The background color of a gallery.

TemplatePadding – 갤러리에서 항목 사이의 거리입니다.TemplatePadding – The distance between items in a gallery.

TemplateSize -세로 방향으로 갤러리에 대한 템플릿의 높이 또는 가로 방향으로 갤러리에 대한 템플릿의 너비입니다.TemplateSize – The height of the template for a gallery in vertical/portrait orientation or the width of the template for a gallery in horizontal/landscape orientation.

Transition – 사용자가 갤러리의 항목을 가리킬 때 나타나는 시각 효과입니다(, 푸시 또는 없음).Transition – The visual effect (Pop, Push, or None) when the user hovers over an item in a gallery.

Visible – 컨트롤을 표시하거나 숨길지 여부를 선택합니다.Visible – Whether a control appears or is hidden.

Width – 컨트롤의 왼쪽 및 오른쪽 가장자리 사이의 간격입니다.Width – The distance between a control's left and right edges.

WrapCount – 가로 또는 세로 레이아웃에 따라 각 행 또는 열당 표시되는 항목 수입니다.WrapCount – Number of items shown per row or column based on horizontal or vertical layout.

X – 컨트롤의 왼쪽 가장자리와 해당 부모 컨테이너(부모 컨테이너가 없는 경우 화면)의 왼쪽 가장자리 사이의 거리입니다.X – The distance between the left edge of a control and the left edge of its parent container (screen if no parent container).

Y – 컨트롤의 위쪽 가장자리와 해당 부모 컨테이너(부모 컨테이너가 없는 경우 화면)의 위쪽 가장자리 사이의 거리입니다.Y – The distance between the top edge of a control and the top edge of the parent container (screen if no parent container).

Filter( DataSource, Formula )Filter( DataSource, Formula )

Examples

데이터 표시 및 필터링Show and filter data

사용자로부터 데이터 가져오기Get data from the user

접근성 지침Accessibility guidelines

색 대비Color contrast

갤러리 항목의 아무 곳이나 클릭하면 선택되어야 하는 경우 다음 사이에 적절한 색 대비가 있어야 합니다.If clicking anywhere in a gallery item is meant to select it, there must be adequate color contrast between:

  • BorderColor 및 갤러리 외부 색(테두리가 있는 경우)BorderColor and the color outside the gallery (if there is a border)
  • Fill 및 갤러리 외부 색(테두리가 없는 경우)Fill and the color outside the gallery (if there is no border)

화면 판독기 지원Screen reader support

  • AccessibleLabel 이 있어야 합니다.AccessibleLabel must be present.

    참고

    갤러리에서 항목이 변경 되 면 화면 읽기 프로그램 공지.Screen readers will announce when items in the gallery change. AccessibleLabel도 언급됩니다.The AccessibleLabel is also mentioned. 이 언급은 알림에 대한 컨텍스트를 제공하고 동일한 화면에 여러 개의 갤러리가 있는 경우 더욱 중요합니다.This gives context to the announcement and is even more important when there are multiple galleries on the same screen.

  • 사용 하 여 갤러리 항목을 여러 컨트롤에 포함 되어 있으면 ItemAccessibleLabel 갤러리 항목의 내용을 요약 합니다.When a gallery item contains multiple controls, use ItemAccessibleLabel to summarize the gallery item's contents.

  • 값을 설정할 선택 가능true 사용자가 갤러리 항목을 선택 하도록 하려는 경우.Set the value of Selectable to true if you want users to select a gallery item. 그렇지 않으면 해당 값을 설정 false합니다.Otherwise, set that value to false.

  • 사용 하 여 갤러리 항목을 여러 컨트롤에 포함 되어 있으면 ItemAccessibleLabel 항목의 내용을 갤러리의 요약을 제공 합니다.When a gallery item contains multiple controls, use ItemAccessibleLabel to provide a summary of the gallery item's contents.

  • 선택 가능한 사용자는 갤러리 항목을 선택 하려는 여부에 따라 적절 하 게 설정 해야 합니다.Selectable should be set appropriately, depending on whether users are meant to select a gallery item.

키보드 지원Keyboard support

  • ShowScrollbartrue로 설정하는 것이 좋습니다.Consider setting ShowScrollbar to true. 대부분의 터치 스크린 디바이스에서 스크롤 막대는 스크롤이 시작될 때까지 표시되지 않습니다.On most touch screen devices, the scrollbar will not show until scrolling begins.

  • 갤러리 항목의 아무 곳이나 클릭하면 선택되어야 하는 경우에는 키보드 사용자가 갤러리 항목을 선택할 수 있는 방법도 있어야 합니다.If clicking anywhere in a gallery item is meant to select it, there must also be way for keyboard users to select the gallery item. 예를 들어 OnSelect 속성이 Select(Parent) 로 설정된 단추 를 추가합니다.For example, adding a Button that has its OnSelect property set to Select(Parent).

    참고

    갤러리 외부의 컨트롤은 갤러리 내의 키보드 탐색 순서에서 고려되지 않습니다.Controls outside the gallery are not considered in the keyboard navigation order within the gallery. 갤러리 내부 컨트롤의 TabIndex 는 범위가 지정됩니다.TabIndex of controls inside a gallery are scoped. 자세한 내용은 접근성 속성을 참조하세요.See accessibility properties to learn more.