Universal Windows Platform – Tutorial Insider – Directs Control

Standard

comentsys.wordpress.com today features a Universal Windows Platform tutorial showing how to create Directs Control, which is a Directional Pad control which is used to indicate which direction has been selected.

Details

The User Control has a XAML View which is a Grid which forms the basis of the Pad and is a 3×3 grid, there are four Path UI elements for Up, Down, Left and Right with their positions set within the Grid so they display as needed to form the Pad. The Code View defines an enum for the directions the pad supports then there’s a Direction event which is triggered with the related Direction and when the “Pad” is loaded the DataContext is set.

When PointedMoved event is triggered for any of the Path elements corresponding to the available directions, the PointerPoint is obtained and if the PointerDeviceType is a Mouse and if IsLeftButtonPressed is true or it’s something else such a Pen or Touch and IsInContact is true then bool “fire” is set to true – if this is the case then the relevant Path will be obtained from the object “sender” of the event and the Direction event triggered with the value from the enum corresponding to the name of the Path which would be either Up, Down, Left or Right.

Behind the Scenes

This control shows how easy it is to create a simple control that emulates the behaviour of a physicaly directional pad – that is when you press a direction it continues to register that direction plus when it’s changed to another one this can be with a continuous press of a mouse, pen or touch to switch between the different directions, although this example is simple to display text in a Label to show the direction, it could form the basis of a game controller.

Leave a Reply

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 )

Google photo

You are commenting using your Google 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