Windows 10 Creaters Update 新功能——畫中畫模式和視窗高斯模糊

標籤：支援   ica   load   mod   void   下載   public   效果   var   

在Windows 10 Creaters Update中，可以給視窗設定高斯模糊了，只要幾行代碼！

    <Grid   Loaded="Grid_Loaded">        <Grid x:Name="mg"></Grid>        <Grid Background="Blue" Opacity="0.4" x:Name="rootGrid" ></Grid>        <!--your uielements-->    </Grid>

        Windows.UI.Composition.Compositor _compositor;        Windows.UI.Composition.SpriteVisual _hostSprite;        public MainPage()        {            this.InitializeComponent();            _compositor = Windows.UI.Xaml.Hosting.ElementCompositionPreview.GetElementVisual(this).Compositor;        }        private void Grid_Loaded(object sender, RoutedEventArgs e)        {            _hostSprite = _compositor.CreateSpriteVisual();            _hostSprite.Size = new System.Numerics.Vector2((float)rootGrid.ActualWidth, (float)rootGrid.ActualHeight);            ElementCompositionPreview.SetElementChildVisual(mg, _hostSprite);            _hostSprite.Brush = _compositor.CreateHostBackdropBrush();        }

效果

 

XAML裡的那個Grid的顏色是可以換的，刪了也行。那個是為了實現向開始菜單那樣特定顏色的模糊。

不過這個方法在新增加的畫中畫模式無效

關於如何?畫中畫其實很簡單

檢測是否支援畫中畫

ApplicationView.GetForCurrentView().IsViewModeSupported(ApplicationViewMode.CompactOverlay)

進入畫中畫

bool modeSwitched = await ApplicationView.GetForCurrentView().TryEnterViewModeAsync(ApplicationViewMode.CompactOverlay);

    ViewModePreferences compactOptions = ViewModePreferences.CreateDefault(ApplicationViewMode.CompactOverlay);    compactOptions.CustomSize = new Windows.Foundation.Size(320, 200);//你要的視窗大小    bool modeSwitched = await ApplicationView.GetForCurrentView().TryEnterViewModeAsync(ApplicationViewMode.Default, compactOptions);

退出畫中畫

bool modeSwitched = await ApplicationView.GetForCurrentView().TryEnterViewModeAsync(ApplicationViewMode.Default);

也可以結合UWP的多視窗功能

await CoreApplication.CreateNewView().Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>    {        var frame = new Frame();        compactViewId = ApplicationView.GetForCurrentView().Id;        frame.Navigate(typeof(SecondaryCompactViewPage));        Window.Current.Content = frame;        Window.Current.Activate();        ApplicationView.GetForCurrentView().Title = "畫中畫視窗";    });    bool viewShown = await ApplicationViewSwitcher.TryShowAsViewModeAsync(compactViewId, ApplicationViewMode.CompactOverlay);

微軟的多視窗樣本：https://github.com/Microsoft/Windows-universal-samples/tree/master/Samples/MultipleViews

微軟關於畫中畫功能的介紹：https://blogs.msdn.microsoft.com/universal-windows-app-model/2017/02/11/compactoverlay-mode-aka-picture-in-picture/

我還做了一個完整的樣本，可以在這裡下載https://git.oschina.net/PixeezPlus/Sharp2DDemo/tree/master/GaussianBlurWindow

還有一點需要注意，就是這些代碼只在PC的Creaters Update以上版本有效

Windows 10 Creaters Update 新功能——畫中畫模式和視窗高斯模糊