#Windows10 – Rotating maps with C# and #SurfaceDial in UWP Apps


In order to talk a little about how to create advanced menus for the Surface Dial, I will resume my view with a map and add an extra feature to this view:

  • Use the Surface Dial spin to control the map zoom
  • Use the Surface Dial spin to rotate the current view on the map

The first example I mentioned in the previous post, today I will show the 2nd functionality.

2017 10 12 SurfaceDial Maps 02.gif

The code to make this work is very simple. It is based on the following steps

  • To provide the 2 features with the Surface Dial, click on the dial, change the mode from Zoom to Rotate and again zoom
  • In the RotationChanged () event, the working mode is verified and changes are applied to the map

Very simple.


enum ControllerMode { zoom, rotate };
ControllerMode _controllerMode;
readonly RadialController _controller;
public MapPagePage()
locationService = new LocationService();
Center = new Geopoint(defaultPosition);
ZoomLevel = DefaultZoomLevel;
_controller = RadialController.CreateForCurrentView();
_controller.RotationResolutionInDegrees = 0.2;
_controller.UseAutomaticHapticFeedback = false;
var myItem = RadialControllerMenuItem.CreateFromFontGlyph("El Bruno – Maps", "\xE128", "Segoe MDL2 Assets");
_controller.ButtonClicked += ControllerButtonClicked;
_controller.RotationChanged += ControllerRotationChangedAsync;
private async void ControllerRotationChangedAsync(RadialController sender, RadialControllerRotationChangedEventArgs args)
if (_controllerMode == ControllerMode.zoom)
mapControl.ZoomLevel = mapControl.ZoomLevel + args.RotationDeltaInDegrees;
await mapControl.TryRotateAsync(args.RotationDeltaInDegrees);
private void ControllerButtonClicked(RadialController sender, RadialControllerButtonClickedEventArgs args)
if (_controllerMode == ControllerMode.rotate)
_controllerMode = ControllerMode.zoom;
_controllerMode = ControllerMode.rotate;

In the next post, a little about how to work with the menu offered by the Surface Dial.

Happy Coding!

Source Code GitHub

Greetings @ Toronto

El Bruno



Leave a comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: