Aug 11 2010

Windows Phone 7: Touch-based Gestures API in XNA Game Studio 4.0

Check out this great sample available in the XNA community site.

It includes code that uses the Gestures API to enable hold, drag, tap, flick, pinch gestures.


Aug 1 2010

Windows Phone 7, Multi-Touch Behaviors and the Surface samples for Silverlight

I’ve just finished some experiments using the Windows Phone 7 emulator and the “Microsoft Surface Manipulations and Inertia Sample for Microsoft Silverlightin order to enable Multi-Touch gestures using Blend Behaviors:

WP7BehaviorExpression

This new implementation, now available for download in the Expression Gallery, permits to enable Multi-Touch gestures (the usual translation, rotation, zoom and inertia) on separate User Controls available in the same container.

In this way you can apply distinct Multi-Touch manipulations (inertia included) to single elements using a single code in xaml:

<Grid x:Name="ContentPanel" Grid.Row="1">
  <Canvas>
      <Image Source="Images/Desert.jpg" x:Name="image1">
          <interactivity:Interaction.Behaviors>
               <WP7:MultiTouchManipulationBehavior IsInertiaEnabled="True" IsRotateEnabled="True" IsTranslateEnabled="True" IsScaleEnabled="True" MinimumScaleRadius="1" MaximumScaleRadius="720"/>
          </interactivity:Interaction.Behaviors>
      </Image>

      <Image Source="Images/Jellyfish.jpg" x:Name="image2">
          <interactivity:Interaction.Behaviors>
             <WP7:MultiTouchManipulationBehavior IsInertiaEnabled="True" IsRotateEnabled="True" IsTranslateEnabled="True" IsScaleEnabled="True" MinimumScaleRadius="60" MaximumScaleRadius="360"/>
          </interactivity:Interaction.Behaviors>
      </Image>
  </Canvas>
</Grid>

Alternatively you can use Blend inserting a reference to the project MultiTouch.Behaviors.Silverlight.WP7 and then dragging the MultiTouchManipulationBehavior from the Assets section to the  control to be touch-enabled:

Multi-Touch Behavior Blend

 

Considerations

This one has been an interesting exercise in porting code written for Silverlight to Windows Phone: I had only to create a Windows Phone 7 project and add to it the code already available for the Silverlight version and all worked well quite quickly.

Limitations

At this time the behavior works only in the fixed Portrait orientation of Windows Phone: if you change to Landscape the manipulation doesn’t work well. I’ll have to investigate further and currently I don’t have a physical device to test (I’d really love to have a device to try it :) ).

Happy Silverlighting!


Jul 5 2010

Windows Phone 7 Multi-Touch Behavior videos #wp7dev

Some time ago I’ve started a Codeplex project dedicated to multi-touch, available on Codeplex at http://multitouch.codeplex.com.

The goal of this project is to provide an unified interface for Silverlight, WPF and Windows Phone 7 in order to provide multi-touch support using a visual approach via the concept of Behavior available in Expression Blend.

Recently I had the honor to welcome in the project a pillar of the Silverlight community, Laurent Bugnion, who is working on the Windows Phone 7 version of the Behavior:

Laurent has just published on his blog two awesome videos to get started with this new Behavior, and has created a specific section on his site http://www.galasoft.ch/touch to announce updates and publish content.

A special thanks to Pete Blois of the Expression Blend team for his help and contributions.

Stay tuned as we’ll be posting updates very soon :)

Happy Silverlighting!


Apr 5 2010

Experiments with Multi-touch: A Windows Phone Manipulation sample

I’ve just updated the project on CodePlex http://multitouch.codeplex.com to Silverlight 4 RC and added a new sample of multi-touch using Windows Phone 7 manipulation capabilities starting from this how-to available in MSDN – “How to: Handle Manipulation Events”http://msdn.microsoft.com/en-us/library/ff426933(VS.96).aspx.

The modified sample uses an Image to illustrate the possibility to move and scale objects in the Windows Phone emulator using the “ManipulationDelta” event:

These are the steps to follow in order to enable Scale and Translation gestures in a Windows Phone application:

  • Just create a new “Windows Phone Application” from Visual Studio and then add an Image control in the MainPage.xaml using this code
<Canvas x:Name="ContentCanvas" Grid.Row="1">
    <Image Source="Images/Desert.jpg" Canvas.Left="99" Canvas.Top="100"
           x:Name="image1" Stretch="Fill" Width="300">
    </Image>
</Canvas>

  • Then add an event handler for the “ManipulationDelta” event for applying a Scale and a Translate transform using the CompositeTransform available in Silverlight 4:
public MainPage()
{
    InitializeComponent();

    SupportedOrientations = SupportedPageOrientation.Portrait | SupportedPageOrientation.Landscape;

    ManipulationDelta += image1_ManipulationDelta;
    _compositeTransform=new CompositeTransform();
    image1.RenderTransform = _compositeTransform;
}

private CompositeTransform _compositeTransform;

void image1_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
    // Scale
    if (e.DeltaManipulation.Scale.X!=0)
       _compositeTransform.ScaleX *= e.DeltaManipulation.Scale.X;
    if (e.DeltaManipulation.Scale.Y!=0)
        _compositeTransform.ScaleY *= e.DeltaManipulation.Scale.Y;

    // Translation
    _compositeTransform.TranslateX += e.DeltaManipulation.Translation.X;
    _compositeTransform.TranslateY += e.DeltaManipulation.Translation.Y;
}

The source code is available for download from CodePlex: http://multitouch.codeplex.com

Happy Silverlighting!


Mar 15 2010

Great news from MIX: Windows Phone development, Silverlight 4 RC available!

Big news today from the MIX conference in Las Vegas: a new Silverlight 4 RC release and Windows Phone development using Silverlight.

While watching the event I’ve put together some links, check it out!

Silverlight 4 RC

Want to know what’s new in Silverlight 4 RC? Check out this doc.

As usually all the bits can be downloaded from the Get Started section of the official site.

Other useful links:

Windows Phone

Happy Silverlighting!