如何為Surface Dial裝置開發自訂互動功能

標籤：img   計算   led   響應   pre   hang   main   ros   ann   

隨著Surface Studio的發布，微軟發布了與之相配套的外設硬體Surface Dial，使用者可以將Surface Dail吸附在Surface Studio的螢幕上面，用旋轉和點擊的實體操作來操作應用程式。

 

目前Surface Dial 可以支援的終端硬體有三款：

• Surface Studio
• Surface Book
• Surface Pro 4

有上述之一硬體的小夥伴們可以嘗試一下這款新鮮的產品。

 

下面，我用一款簡單的UWP程式來介紹如何給Surface Dial這款外設開發自訂的互動邏輯。

 

前期準備：

• 請確保您的電腦作業系統是最新的Win10 Anniversary Update版本
• 請確保您的Visual Studio是VS2015 update3 版本
• Surface Dial裝置(可選)
• Surface Studio, Surface Book 以及 Surface Pro 4 都是可選項，如果沒有，並不影響案例代碼的運行

 

運行例子:

如果您有surface dial裝置，並且擁有Surface Studio, Surface Book或者Surface Pro4其中的任一一款終端，請在Visual Studio裡面運行我們的案例代碼，並且將Surface Dail吸附在螢幕上。您將會看到下面這個介面。

此時，您可以選擇Surface Dial，介面中的滑動條會跟著您的轉動而變化，點擊Surface Dial的按鈕，介面中的開關控制項會開啟或者關閉。

 

使用代碼：

您可以使用代碼去自訂Surface Dail在您的應用程式裡的旋轉和點擊操作。

控制Surface Dail的核心類是RadialController ，可以在Windows.UI.Input這個名字空間下找到該類。您可以調用RadialController.CreateForCurrentView() 來擷取該類的實體。

 

RadialController類實體對外公布了幾個事件，在這個例子裡我們只關注ButtonClicked 事件和 RotationChanged事件。前者會在Surface Dail被點擊的時候調用，而後者則是響應旋轉操作。

 

下面是例子裡的核心程式碼片段：

    public sealed partial class MainPage : Page     {         RadialController rdController = null;         public MainPage()         {             this.InitializeComponent();              // get controller             rdController = RadialController.CreateForCurrentView();              // process click event             rdController.ButtonClicked += RdController_ButtonClicked;              // process rotate event             rdController.RotationChanged += RdController_RotationChanged;         }          private void RdController_RotationChanged(RadialController sender, RadialControllerRotationChangedEventArgs args)         {             // change the slider according to the delta degree from rotating             var deltaRatio = args.RotationDeltaInDegrees / 360.0f;             this.slider.Value += this.slider.Maximum * deltaRatio;         }          private void RdController_ButtonClicked(RadialController sender, RadialControllerButtonClickedEventArgs args)         {             // switch the toggle to opposite status             this.btnToggle.IsOn = !this.btnToggle.IsOn;         }     }

 

最後，您可以通過訪問 How to implement custom interactions for Surface Dial 來下載完整的代碼案例。

 

如何為Surface Dial裝置開發自訂互動功能