ContextMenu 제어
명령을 입력하는 데 사용되는 컨트롤입니다.
노트
GitHub 코드 구성 요소 리포지토리에서 전체 설명서 및 소스 코드를 확인할 수 있습니다.
Description
상황별 메뉴(ContextMenu)는 선택, 마우스 호버 또는 키보드 포커스의 컨텍스트를 기반으로 하는 명령 목록입니다. 가장 효과적이고 많이 사용되는 명령 화면 중 하나이며 다양한 위치에서 사용할 수 있습니다.
이 코드 구성 요소는 캔버스 앱 및 사용자 지정 페이지에서 사용하기 위한 단추에 제한된 유창한 UI ContextualMenu 컨트롤 주위에 래퍼를 제공합니다.
속성
키 속성
| Property | Description |
|---|---|
Items |
렌더링할 작업 항목. 첫 번째 항목은 루트 항목으로 간주됩니다. |
Items 속성
| 입력 | Description |
|---|---|
ItemDisplayName |
메뉴 항목의 표시 이름입니다. |
ItemKey |
어떤 항목이 선택되었는지 표시하고 하위 항목을 추가할 때 사용하는 키입니다. 키는 고유해야 합니다. |
ItemEnabled |
옵션이 비활성화된 경우 false로 설정합니다. |
ItemVisible |
옵션이 표시되지 않으면 false로 설정합니다. |
ItemChecked |
옵션이 선택되어 있으면 true로 설정합니다. |
ItemIconName |
사용할 유창한 UI 아이콘(유창한 UI 아이콘 참조) |
ItemIconColor |
아이콘을 렌더링할 색상입니다(예: 명명된 rgb 또는 16진수 값). |
ItemIconOnly |
텍스트 레이블을 표시하지 않고 아이콘만 표시합니다. |
ItemHeader |
항목을 섹션 헤더로 렌더링합니다. ItemParentKey이 이 항목의 키로 설정된 항목이 있으면 이 섹션 아래에 의미적으로 그룹화된 항목으로 추가됩니다. |
ItemTopDivider |
섹션 상단에 구분선을 렌더링합니다. |
ItemDivider |
항목을 섹션 구분선으로 렌더링하거나 항목이 헤더(ItemHeader = true)인 경우 섹션 하단에 구분선을 렌더링할지 여부를 제어합니다. |
ItemParentKey |
옵션을 다른 옵션의 자식 항목으로 렌더링합니다. |
노트
ItemIconColor구성 요소의 테마 값을 재정의하고 다른 상태 색상(예: 비활성화)을 무시합니다.ItemHeaderItemDivider구분자로 렌더링하려면 true로 설정해야 합니다. false로 설정하면 다른 값을 예상하고 공백으로 렌더링됩니다.ItemChecked속성과 하위 메뉴 항목의 동작을 추가하면 클릭 시 하위 메뉴가 닫히는 것을 방지할 수 있습니다.
예
Items에 대한 Power Fx 수식의 예:
Table(
{
ItemKey: "File",
ItemIconName: "save",
ItemDisplayName: "Save",
ItemOverflow:true
},
{
ItemKey: "Delete",
ItemIconName: "Delete",
ItemDisplayName: "Delete",
ItemOverflow:true
}
)
스타일 속성
| Property | Description |
|---|---|
Theme |
유창한 UI 테마 디자이너(windows.net)를 사용하여 생성된 JSON 문자열을 허용합니다. 이 항목을 비워 두면 Power Apps에서 정의한 기본 테마가 사용됩니다. 이 항목을 비워 두면 Power Apps에서 정의한 기본 테마가 사용됩니다. 설정 방법은 테마 설정을 참고하세요. |
Chevron |
루트 버튼에 아래쪽 갈매기 모양 표시 또는 숨기기 |
IconColor |
선택 사항. 컨텍스트 메뉴 버튼의 아이콘 색상입니다. |
HoverIconColor |
선택 사항. 컨텍스트 메뉴 버튼 위로 마우스를 가져갔을 때 아이콘의 색상입니다. |
IconSize |
선택 사항. 컨텍스트 메뉴 버튼의 아이콘 크기(픽셀)입니다. |
FontSize |
선택 사항. 컨텍스트 메뉴 버튼의 텍스트 크기(픽셀)입니다. |
FontColor |
선택 사항. 컨텍스트 메뉴 버튼의 텍스트 색상입니다. |
HoverFontColor |
선택 사항. 컨텍스트 메뉴 버튼 위로 마우스를 가져갔을 때의 텍스트 색상입니다. |
FillColor |
선택 사항. 컨텍스트 메뉴 버튼의 배경색입니다. |
HoverFillColor |
선택 사항. 컨텍스트 메뉴 버튼 위로 마우스를 가져갔을 때의 배경색입니다. |
TextAlignment |
버튼 텍스트의 정렬입니다. 가능한 값: 중앙, 왼쪽 또는 오른쪽 |
AccessibilityLabel |
화면 읽기 프로그램 아리아-레이블 |
이벤트 속성
| Property | Description |
|---|---|
InputEvent |
컨트롤에 보낼 이벤트입니다. 예: SetFocus. 아래를 참조하십시오. |
동작
SetFocus를 InputEvent로 지원합니다.
'선택 시' 동작 구성
구성 요소의 OnSelect 속성에서 Switch() 공식을 사용하여 컨트롤에서 선택한 ItemKey를 스위치 값으로 참조하여 각 항목에 대한 특정 작업을 구성합니다.
false 값을 Power Fx 언어의 적절한 표현식으로 바꿉니다.
Switch( Self.Selected.ItemKey,
/* Action for ItemKey 1 */
"File", false,
/* Action for ItemKey 2 */
"Delete", false,
/* Default action */
false
)
컨트롤에 포커스 설정
새 대화 상자가 표시되고 기본 포커스가 컨트롤에 있어야 하는 경우 명시적으로 설정된 포커스가 필요합니다.
입력 이벤트를 호출하려면 입력 이벤트 속성에 바인딩된 컨텍스트 변수를 SetFocus로 시작하고 그 뒤에 임의의 요소가 오는 문자열로 설정하여 앱이 이를 변경으로 감지하도록 할 수 있습니다.
예:
UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));
그러면 컨텍스트 변수 ctxResizableTextareaEvent가 속성 Input Event 속성에 바인딩됩니다.
제한 사항
이 코드 구성 요소는 캔버스 앱 및 사용자 정의 페이지에서만 사용할 수 있습니다.