xna - Drag Image in a Window Phone 7+ Silverlight app -

xna - Drag Image in a Window Phone 7+ Silverlight app -

windows phone 7.5 silverlight app

i want allow user drag image on page within restricted area. image within grid has other elements.

i using gesturelistener , have tried implementing. below code. have tried after reading few sample articles.

<image x:name="imgfootball" margin="55,108,55,1" grid.row="1" source="/ball.png" height="250" width="250"> <toolkit:gestureservice.gesturelistener> <toolkit:gesturelistener dragdelta="gesturelistener_dragdelta"></toolkit:gesturelistener> </toolkit:gestureservice.gesturelistener> <image.rendertransform> <compositetransform x:name="imgimagetranslate" /> </image.rendertransform> </image> private void gesturelistener_dragdelta(object sender, dragdeltagestureeventargs e) { imgimagetranslate.translatey += e.verticalchange; imgimagetranslate.translatex += e.horizontalchange; }

now using above code dragging works fine.

my problem (updated 01/19): want set limit dragging area . i.e. want add together drag circle , triangle. allowed dragged on other shapes cannot go on textblocks or arrows in corner. elements in grid.

i tried suggestion mentioned chris , used stackpanel. limits behavior not able position elments shown i.e. in scattered places. instead sp forces me stack them 1 on other vertically or horizontally. other shapes have own animation resizing, etc.

any suggestions?

you might easier result attaching mousedragelementbehavior object , setting constraintoparentbounds property respect bounds of parent object grid or border or something. refer here [http://microsoftfeed.com/2011/how-to-add-mousedragelementbehavior-in-windows-phone-7/][1][1]: http://microsoftfeed.com/2011/how-to-add-mousedragelementbehavior-in-windows-phone-7//

***example showing how 2 elements named drag within parent boundries bevause have behavior attached specific objects.;

<phone:phoneapplicationpage xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:microsoft.phone.controls;assembly=microsoft.phone" xmlns:shell="clr-namespace:microsoft.phone.shell;assembly=microsoft.phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:i="clr-namespace:system.windows.interactivity;assembly=system.windows.interactivity" xmlns:el="clr-namespace:microsoft.expression.interactivity.layout;assembly=microsoft.expression.interactions" mc:ignorable="d" d:designwidth="480" d:designheight="800" x:class="windowsphonetester.phonepage1" fontfamily="{staticresource phonefontfamilynormal}" fontsize="{staticresource phonefontsizenormal}" foreground="{staticresource phoneforegroundbrush}" orientation="portrait" shell:systemtray.isvisible="true"> <!--layoutroot root grid page content placed--> <grid x:name="layoutroot" background="transparent"> <grid.rowdefinitions> <rowdefinition height="auto"/> <rowdefinition height="*"/> </grid.rowdefinitions> <!--titlepanel contains name of application , page title--> <stackpanel x:name="titlepanel" grid.row="0" margin="12,17,0,28"> <textblock x:name="applicationtitle" text="my application" style="{staticresource phonetextnormalstyle}"/> <textblock x:name="pagetitle" text="page name" margin="9,-7,0,0" style="{staticresource phonetexttitle1style}"/> </stackpanel> <!--contentpanel - place additional content here--> <grid x:name="contentpanel" grid.row="1" margin="12,0,12,0"> <border borderbrush="#fff50606" borderthickness="3" margin="9,141,8,174"> <rectangle fill="#fff35206" horizontalalignment="left" height="74" margin="20,29,0,0" stroke="black" verticalalignment="top" width="76"/> </border> <path data="m43,98 l21,111 l41,124 z" fill="#fff4f4f5" horizontalalignment="left" height="27" margin="20.5,97.5,0,0" stretch="fill" stroke="black" uselayoutrounding="false" verticalalignment="top" width="23"/> <path data="m406,103 l406,125 l429,113 z" fill="#fff4f4f5" horizontalalignment="right" height="23" margin="0,102.5,26.5,0" stretch="fill" stroke="black" uselayoutrounding="false" verticalalignment="top" width="24"/> <textblock height="28" margin="108,98,112,0" textwrapping="wrap" text="textblock" verticalalignment="top"/> <ellipse fill="#ff0635f3" height="79" margin="164,181,204,0" stroke="black" verticalalignment="top"> <i:interaction.behaviors> <el:mousedragelementbehavior constraintoparentbounds="true"/> </i:interaction.behaviors> </ellipse> <rectangle fill="#fff3df06" horizontalalignment="right" height="64" margin="0,181,26,0" stroke="black" verticalalignment="top" width="123"/> <path data="m78,318 l41,383 l111,380 z" fill="#fff306df" horizontalalignment="left" height="66" margin="40.5,0,0,223.5" stretch="fill" stroke="black" uselayoutrounding="false" verticalalignment="bottom" width="71"> <i:interaction.behaviors> <el:mousedragelementbehavior constraintoparentbounds="true"/> </i:interaction.behaviors> </path> <path data="m275,309 l322,305 l357,327 l362,360 l342,391 l295,398 l259,376 l252,338 z" fill="#ff06f30a" horizontalalignment="right" height="94" margin="0,0,93.5,208.5" stretch="fill" stroke="black" uselayoutrounding="false" verticalalignment="bottom" width="111"/> </grid> </grid> </phone:phoneapplicationpage>

silverlight xna windows-phone-7