Windows 10 UWP 13 of N: Countinuum conecpt

  • 217
  • 0
  • UAP
  • 2021-04-30

介紹Windows 10 Mobile的Continuum相關資訊

Continuum是將Windows Phone可以讓APP 去Adaptive到第二個Screen的強大功能!

預設這個功能是開啟的!所以如果選用了UWP的專案進行開發但還沒完成Continuum的功能需要調整步驟如下

  1. 使用XML編輯器開啟專案中的Package.appxmanifest。
  2. 在Package的 element的attribute加入 xml 的namespace。
  3. xmlns:mobile = "http://schemas.microsoft.com/appx/manifest/mobile/windows10"

    並調整 IgnorableNamespcaes = " uap mp mobile "(加入無視mobile的編譯錯誤)。

  4. 在Applications下的Application內的Extensions加入下方的XML
<mobile:Extension Category="windows.mobileMultiScreenProperties">
 <mobile:MobileMultiScreenProperties RestrictToInternalScreen="true"/>
</mobile:Extension>

這樣就可以讓該UWP的App放在Phone中並不可以在Continuum的Large screen可以被點選。


針對Countinuum的新增了一個API讓大家對切換input的方式變換可以有使用以下的C#程式碼解決

public MainPage()
        {
            this.InitializeComponent();
            Window.Current.SizeChanged += Current_SizeChanged;
        }

        private void Current_SizeChanged(object sender, Windows.UI.Core.WindowSizeChangedEventArgs e)
        {
            switch(UIViewSettings.GetForCurrentView().UserInteractionMode)
            {
                case UserInteractionMode.Mouse:
                    VisualStateManager.GoToState(this, "MouseVisual", true);
                    break;
                default:
                case UserInteractionMode.Touch:
                    VisualStateManager.GoToState(this, "TouchVisual", true);
                    break;
            }
        }

當在Continuum的時候App的畫面變換是由SizeChanged來觸發的!而一般來說當User使用Continuum的時候較大的螢幕尺寸基本上會使用Keyboard and Mouse作為輸入裝置。

針對App執行在不同尺寸(Inches)的裝置處裡的方式可以用以下的C# Code取得目前裝置的大約尺寸~

以下的Code就是抓取實際硬體螢幕尺寸是否大約為7吋。

double physicalInches = Double.MaxValue;
            if (DisplayInformation.GetForCurrentView().DiagonalSizeInInches.HasValue)
                physicalInches = DisplayInformation.GetForCurrentView().DiagonalSizeInInches.Value;
            if (physicalInches > 0 && physicalInches < 7)
                rootFrame.Navigate(typeof(SevenInch_Page));
            else
                rootFrame.Navigate(typeof(Normal_Page));

當然要寫出好的Continuum的App不外乎就是要做出Responsive UI的方式!剛剛上面的程式碼都是針對螢幕尺寸或是操作介面,而早在Build 10240的時候就有兩種方式可以區別裝置的UI

可以建立XAML View並且命名為 " DeviceFamily-{FamilyType} " 而FamilyType來說最簡單就是Mobile!所以可以建立一個Xaml View並且命名規則為 "MainPage.DeviceFamily-Mobile"或是建立一資料夾為DeviceFamily-Mobile並將XAML view放置該Folder下!


而甚麼是Xaml View呢?其實就是XAML但沒有.cs在後端!這是共用現有的Page.cs所以可以只有保留一份.cs但依照裝置類型做不同的Xaml view.

而之前8.1開始就支援的Assets的多解析度的Scale一樣還是可以分為使用Folder的方式或是在檔案名稱的方式。


***以上Code以及說明都有可能隨著Windows 10 的版本以及Visual Studio 2015版本有所調整!***

參考資料 MSDN, Windows Dev Center, Channel 9

Channel 9 Developer`s guide to Windows 10 Version 1511 Build App for Countinuum

下次再分享Windows 10 的新技術拉~