UWP - In App 튜토리얼 회색 자만 제외 Xaml 요소

Question

예제 http://dashboard.securingdemocracy.org/ 해당 페이지로 이동하여 '처음 : 클릭하십시오'버튼을 클릭하면 간단한 자습서가 시작됩니다. 내 UWP 응용 프로그램에서 이것을 복제하고 싶습니다. 조광 효과를 복제하는 방법을 잘 모르겠습니다. 모든 제안을 부탁드립니다.

Answer 1

light dismiss 대화 상자의 경우 UWP에서 Flyout 컨트롤을 사용해보십시오.

마스크 효과의 경우 간단한 구현을 원할 경우 Opacity 설정의 모양을 사용하여 컨트롤에 마스크 효과가 적용될 UI 컨트롤을 포함하고 Canvas.Index 연결된 속성을 제어하도록 설정할 수 있습니다 다루지 않을 하나의 컨트롤에 대한 z 순서. 예 :

<Canvas Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <TextBox Text="Testparagraph" Canvas.Top="20" Canvas.Left="20" Canvas.ZIndex="1" Background="White" IsReadOnly="True"></TextBox> 
    <TextBox Text="testparagraph 2" Canvas.Top="80" Canvas.Left="20" Canvas.ZIndex="-1" Background="White" IsReadOnly="True"></TextBox> 
    <Rectangle Fill="Gray" Opacity="0.5" Height="400" Width="400" Canvas.ZIndex="0"></Rectangle> 
</Canvas> 

복잡한 구현을 위해서는 Composition effects을 사용해보십시오. WindowsUIDevLabs 라이브러리에는 마스크 효과 샘플이 있습니다. 예를 들어 마스크 효과는 ForegroundFocusEffects입니다. 시나리오에 대한 세부 정보 직접 구현하십시오.