IRotaryEventReceiver

IRotaryEventReceiver is a receiver interface to receive Rotary event. When a rotary event occur, IRotaryEventReceiver calls Rotate(RotaryEventArgs) method. You can control the Rotary event using this interface. If you read the following paragraphs, you can easily rotate image according to bezel rotation.

WARNING: If device or emulator is not supported bezel action. IRotaryEventReceiver is not supported.

Add IRotaryEventReceiver

Add IRotaryEventReceiver interface to CirclePage or Page having CircleSurfaceEffectBehavior. Implement Rotate() method to control a rotary event. RotaryEventArgs is event argument for the Rotary Event. RotaryEventArgs.IsClockwise gets the direction of bezel rotation. IsClockwise is true, when the device is rotated in the clockwise direction. The following sample receives rotary event at Rotate() method and add angle of the image following to rotary event direction. And then rotate the image.

Set the event receiver to a RotaryFocusObject.

Apply the implementation of IRotaryEventReceiver to the RotaryFocusObject in CirclePage.
IRotaryEventReceiver implements IRotaryFocusable, only IRotaryFocusable applied to a RotaryFocusObject can receive Bezel events.

For more information, see IRotaryEventReceiver API reference.

The code example of this guide uses TCIRotaryEventReceiver code of WearableUIGallery. The code is available in test\WearableUIGallery\WearableUIGallery\TC\TCIRotaryEventReceiver.xaml

C# file

    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TCIRotaryEventReceiver : CirclePage, IRotaryEventReceiver
    {
        bool _rotating;
        double _angle;
        public TCIRotaryEventReceiver ()
        {
            InitializeComponent ();
            _angle = 0;
        }

        public void Rotate(RotaryEventArgs args)
        {
            if (_rotating) return;

            _rotating = true;
            _angle += args.IsClockwise ? 30 : -30;
            Cat.RotateTo(_angle).ContinueWith(
                (b) =>
                {
                    _rotating = false;
                    if (_angle == 360)
                    {
                        Cat.Rotation = 0;
                        _angle = 0;
                    }
                });
        }
    }

XAML file

<?xml version="1.0" encoding="utf-8" ?>
<w:CirclePage
    x:Class="WearableUIGallery.TC.TCIRotaryEventReceiver"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:WearableUIGallery.TC"
    xmlns:w="clr-namespace:Tizen.Wearable.CircularUI.Forms;assembly=Tizen.Wearable.CircularUI.Forms"
    x:Name="MyCirclePage"
    RotaryFocusObject="{x:Reference MyCirclePage}">
    <w:CirclePage.Content>
        <Image x:Name="Cat" Source="image/cat360.png" />
    </w:CirclePage.Content>
</w:CirclePage>