CODEWITHSUNDEEP
windows-8windows-store-appswinrt-xaml
Stephan Ronald
Stephan Ronald

Reputation: 1405

Implementing DragStarted DragDelta events in windows 8 / WinRT

How I can attach DragStarted DragDelta events to a grid in windows 8 / WinRT. I did the Same in windows phone with GestureService.GetGestureListener() method. I tried to replace the code with ManipulationStarted & ManipulationDelta events in windows 8. But the result is not same. In windows phone for a single drag it enters DragDelta events 2 or more times. But in the other hand in windows 8, in ManupulationDelta event it only fires once for the similar Drag operation.

Upvotes: 15

Views: 1389

Answers (1)

Jerry Nixon
Jerry Nixon

Reputation: 31813

Yeah, I think I know what you want.

Let's say you have some XAML like this:

<Grid Margin="50">
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <Rectangle Fill="Blue" x:Name="MyRect" />
</Grid>

You want to move that rectangle around the Grid by dragging it.

Just use this code:

public MainPage()
{
    this.InitializeComponent();
    MyRect.ManipulationMode = ManipulationModes.TranslateX | ManipulationModes.TranslateY;
    MyRect.ManipulationDelta += Rectangle_ManipulationDelta;
    MyRect.ManipulationCompleted += Rectangle_ManipulationCompleted;
}

private void Rectangle_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    var _Rectangle = sender as Windows.UI.Xaml.Shapes.Rectangle;
    var _Transform = (_Rectangle.RenderTransform = (_Rectangle.RenderTransform as TranslateTransform) ?? new TranslateTransform()) as TranslateTransform;
    _Transform.X += e.Delta.Translation.X;
    _Transform.Y += e.Delta.Translation.Y;
}

private void Rectangle_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
    var _Rectangle = sender as Windows.UI.Xaml.Shapes.Rectangle;
    _Rectangle.RenderTransform = null;

    var _Column = System.Convert.ToInt16(_Rectangle.GetValue(Grid.ColumnProperty));
    if (_Column <= 0 && e.Cumulative.Translation.X > _Rectangle.RenderSize.Width * .5)
        _Rectangle.SetValue(Grid.ColumnProperty, 1);
    else if (_Column == 1 && e.Cumulative.Translation.X < _Rectangle.RenderSize.Width * -.5)
        _Rectangle.SetValue(Grid.ColumnProperty, 0);

    var _Row = System.Convert.ToInt16(_Rectangle.GetValue(Grid.RowProperty));
    if (_Row <= 0 && e.Cumulative.Translation.Y > _Rectangle.RenderSize.Height * .5)
        _Rectangle.SetValue(Grid.RowProperty, 1);
    else if (_Row == 1 && e.Cumulative.Translation.Y < _Rectangle.RenderSize.Height * -.5)
        _Rectangle.SetValue(Grid.RowProperty, 0);
}

For this:

enter image description here

Hope I'm close! Best of luck!

Upvotes: 10

Related Questions