PowerApps의 화면 컨트롤Screen control in PowerApps

앱에서 하나 이상의 다른 컨트롤을 포함하는 UI 요소입니다.A UI element that contains one or more other controls in an app.

설명Description

대부분의 레이블 컨트롤, 버튼 컨트롤 및 기타 데이터를 표시하고 탐색을 지원하는 컨트롤 등을 포함하는 여러 화면 컨트롤이 있습니다.Most apps have multiple Screen controls that contain Label controls, Button controls, and other controls that show data and support navigation.

주요 속성Key properties

BackgroundImage – 화면의 배경에 표시되는 이미지 파일의 이름입니다.BackgroundImage – The name of an image file that appears in the background of a screen.

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

추가 속성Additional properties

ImagePosition – 이미지와 같은 크기가 아닌 경우 컨트롤 또는 화면에 있는 이미지의 위치입니다(채우기, 맞춤, 늘이기, 타일 또는 가운데).ImagePosition – The position (Fill, Fit, Stretch, Tile, or Center) of an image in a screen or a control if it isn't the same size as the image.

OnHidden – 사용자가 화면에서 나갈 때 앱의 동작입니다.OnHidden – The behavior of an app when the user navigates away from a screen.

OnVisible – 사용자가 화면으로 들어올 때 앱의 동작입니다.OnVisible – The behavior of an app when the user navigates to a screen.

OnStart – 사용자가 앱을 열 때 앱의 동작입니다.OnStart – The behavior of the app when the user opens the app.

  • 이 속성이 설정된 수식은 앱의 첫 화면이 표시되기 전에 실행됩니다.The formula to which this property is set runs before the first screen of the app appears. Navigate 함수를 호출하여 앱을 시작할 때 처음 표시하는 화면을 변경합니다.Call the Navigate function to change which screen appears first when the app starts.
  • 아직 화면이 표시되지 않았으므로 UpdateContext 함수로 컨텍스트 변수를 설정할 수 없습니다.You can't set context variables with the UpdateContext function because no screen has appeared yet. 그러나 Navigate 함수에서 컨텍스트 변수를 전달하고 Collect 함수를 사용하여 컬렉션을 만들고 채울 수 있습니다.However, you can pass context variables in the Navigate function and create and fill a collection by using the Collect function.
  • 앱을 업데이트하면 이 속성을 설정할 수식은 앱이 PowerApps Studio로 로드될 때 실행됩니다.When you update an app, the formula to which this property is set runs when the app is loaded into PowerApps Studio. 이 속성 변경의 결과를 확인하려면 앱을 저장하고 종료한 다음 다시 로드해야 합니다.To see the impact of changing this property, you'll need to save, close, and reload your app.
  • OnStart 속성은 실제로는 화면이 아닌 앱의 속성입니다.The OnStart property is actually a property of the app, not the screen. 편집 편의를 위해 이 속성을 앱의 첫 화면에서 속성처럼 보고 수정할 수 있습니다.For editing convenience, you view and modify it as a property on the first screen of your app. 첫 화면을 제거하거나 화면 순서를 변경한 경우 이 속성을 찾기 어렵습니다.If you remove the first screen or reorder screens, this property may become hard to find. 이 경우 앱을 저장하고 닫은 다음 다시 로드하면 속성이 첫 화면의 속성으로 다시 표시됩니다.In this case, save, close, and reload your app, and the property will reappear as a property of the first screen.

Distinct( DataSource, ColumnName )Distinct( DataSource, ColumnName )

Example

  1. 라디오 컨트롤을 추가하고 이름을 ScreenFills로 지정한 다음, Items 속성을 다음 값으로 설정합니다.Add a Radio control, name it ScreenFills, and set its Items property to this value:
    ["Red", "Green"]["Red", "Green"]

    컨트롤을 추가, 이름을 지정하고, 구성하는 방법을 모르시나요?Don't know how to add, name, and configure a control?

  2. 기본 화면 컨트롤의 이름을 Source로 지정한 다음, 다른 화면 컨트롤을 추가하고 이름을 Target으로 지정합니다.Name the default Screen control Source, add another Screen control, and name it Target.

  3. Source에서 셰이프 컨트롤(예: 화살표)을 추가하고 OnSelect 속성을 다음 수식으로 설정합니다.On Source, add a Shape control (such as an arrow), and set its OnSelect property to this formula:
    Navigate(Target, ScreenTransition.Fade)Navigate(Target, ScreenTransition.Fade)

    Navigate 함수 또는 다른 함수에 대해 더 알고 싶으신가요?Want more information about the Navigate function or other functions?

  4. Target에서 셰이프 컨트롤(예: 화살표)을 추가하고 OnSelect 속성을 다음 수식으로 설정합니다.In Target, add a Shape control (such as an arrow), and set its OnSelect property to this formula:
    Navigate(Source, ScreenTransition.Fade)Navigate(Source, ScreenTransition.Fade)

  5. TargetFill 속성을 다음 수식으로 설정합니다.Set the Fill property of Target to this formula:
    If("Red" in ScreenFills.Selected.Value, RGBA(255, 0, 0, 1), RGBA(54, 176, 75, 1))If("Red" in ScreenFills.Selected.Value, RGBA(255, 0, 0, 1), RGBA(54, 176, 75, 1))

  6. Source에서 F5 키를 누르고 라디오 컨트롤의 옵션을 하나 클릭하거나 탭한 다음, 셰이프 컨트롤을 클릭하거나 탭합니다.From Source, press F5, click or tap either option in the Radio control, and then click or tap the Shape control.

    Target이 선택한 색으로 나타납니다.Target appears in the color that you chose.

  7. Target에서 셰이프 컨트롤을 클릭하거나 탭하여 Source로 돌아갑니다.On Target, click or tap the Shape control to return to Source.

  8. (선택 사항) 라디오 컨트롤의 다른 옵션을 클릭하거나 탭한 다음 세이프 컨트롤을 클릭하거나 탭하여 다른 색으로 Target이 표시되는지 확인합니다.(optional) Click or tap the other option in the Radio control, and then click or tap the Shape control to confirm that Target appears in the other color.

  9. 기본 작업 영역으로 돌아가려면 Esc 키를 누릅니다.To return to the default workspace, press Esc.

접근성 지침Accessibility guidelines

색 대비Color contrast

화면이 텍스트의 효과적인 배경인 경우 다음 사이에 적절한 색 대비가 있어야 합니다.When the Screen is the effective background for text, there must be adequate color contrast between:

예를 들어 화면레이블 이 포함되어 있고 레이블에 투명한 채우기가 있는 경우 화면의 채우기 는 효과적으로 레이블의 배경색이 됩니다.For example, if a Screen contains a Label and the label has transparent fill, then the screen's Fill effectively becomes the background color for the label.

텍스트 외에도 평가 컨트롤의 별표 이미지 같은 필수 그래픽 개체에 대한 색 대비를 확인하는 것이 좋습니다.In addition to text, consider checking color contrast with essential graphical objects like the star images in a Rating control.

화면 판독기 지원Screen reader support

  • 화면에 대한 의미 있는 이름이 있어야 합니다.There must be a meaningful name for each Screen. [컨트롤] 창의 트리 뷰 또는 [속성] 창의 헤더에서 다른 컨트롤과 동일한 방법으로 화면 이름을 보고 편집할 수 있습니다.The screen name can be viewed and edited in the same way as other controls: in the tree view of the controls pane or in the header of the properties pane.

    참고

    화면이 로드되면 화면 읽기 프로그램이 해당 이름을 알립니다.When a new Screen is loaded, screen readers will announce its name.