Following yesterday’s example on how to use the new Surface Dial in a Windows Store App, today I’ll share how to integrate some of this device capabilities into a page with a Media Player Element.
I have not put down much of imagination for this example, I just want to have 2 basic features to cover with Surface Dial
- Using the dial rotation, control the position of the video I am playing
- With the click of the dial, pause or resume the video playback
And as in the previous example, I have to record an action that is triggered from a Surface Dial menu.
Bonus: I’ve seen that there is another way to create the action buttons on the dial.
For this I use the source type [Segoe MDL2 Assets], and with the value of a char, I define the icon to use.
I’ll use this code to cover the 2 features and the new way to create a menu item in the Surface Dial Studio circle menu
In the previous piece of code, we can see As you can see in the same
- 10 to 17, menu creation and subscription to click events and rotation.
- 21, change position of the video player using the rotation delta that gives us the RotationChanged () event of the Surface Dial
- 26 to 36, in the click of the dial, pause or resume of the video depending on the state of the same
Source Code at GitHub
Greetings @ Toronto
- El Bruno, Kind of a Hello World with a Surface Dial in a Windows Store App
- Windows Dev Center, Surface Dial Interactions
- Canadian Developer Connection, Developing for Surface Dial
- Visual Studio MarketPlace, Windows Template Studio