Animating ScatterViewItem.Orientation and retaining the value
i having trouble animating scatterviewitem's orientation property using doubleanimation. have flip button on scatterviewitem supposed flip item 180 degrees , -180 degrees on second click. works. problem seeing must use fillbehavior.holdend in order flipped angle persist after flipping doubleanimation seems never finish (even though completed fired) , orientation property's local value ignored after initial animation. basically, after item first flipped 1 cannot rotate scatterviewitem neither finger nor programmatically. have tried calling beginanimation(null) in completed event handler in order stop pending animations no avail. ideas helpful.
i have created surface project scratch , added this:
private void flipcompleted(object sender, eventargs e) { _item.beginanimation(scatterviewitem.orientationproperty, null); }
as modified xaml this:
<s:surfacewindow x:class="surfaceapplication1.surfacewindow1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:s="http://schemas.microsoft.com/surface/2008" title="surfaceapplication1" > <s:surfacewindow.resources> <imagebrush x:key="windowbackground" stretch="none" opacity="0.6" imagesource="pack://application:,,,/resources/windowbackground.jpg"/> <storyboard x:key="flipforward" completed="flipcompleted"> <doubleanimation by="180" duration="0:0:0.5" storyboard.targetproperty="(s:scatterviewitem.orientation)" /> </storyboard> <storyboard x:key="flipbackward"> <doubleanimation by="-180" duration="0:0:0.5" storyboard.targetproperty="(s:scatterviewitem.orientation)" /> </storyboard> </s:surfacewindow.resources> <grid background="{staticresource windowbackground}" > <s:scatterview> <s:scatterviewitem x:name="_item"> <s:scatterviewitem.style> <style targettype="{x:type s:scatterviewitem}" basedon="{staticresource {x:type s:scatterviewitem}}"> <style.triggers> <datatrigger binding="{binding elementname=_button,path=ischecked}" value="true"> <datatrigger.enteractions> <beginstoryboard> <staticresource resourcekey="flipforward" /> </beginstoryboard> </datatrigger.enteractions> <datatrigger.exitactions> <beginstoryboard> <staticresource resourcekey="flipbackward" /> </beginstoryboard> </datatrigger.exitactions> </datatrigger> </style.triggers> </style> </s:scatterviewitem.style> <s:surfacetogglebutton margin="20" x:name="_button">click me!</s:surfacetogglebutton> </s:scatterviewitem> </s:scatterview> </grid> </s:surfacewindow>
i having trouble animating scatterviewitem's orientation property using doubleanimation. have flip button on scatterviewitem supposed flip item 180 degrees , -180 degrees on second click. works. problem seeing must use fillbehavior.holdend in order flipped angle persist after flipping doubleanimation seems never finish (even though completed fired) , orientation property's local value ignored after initial animation. basically, after item first flipped 1 cannot rotate scatterviewitem neither finger nor programmatically. have tried calling beginanimation(null) in completed event handler in order stop pending animations no avail. ideas helpful.
i have created surface project scratch , added this:
private void flipcompleted(object sender, eventargs e) { _item.beginanimation(scatterviewitem.orientationproperty, null); }
as modified xaml this:
<s:surfacewindow x:class="surfaceapplication1.surfacewindow1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:s="http://schemas.microsoft.com/surface/2008" title="surfaceapplication1" > <s:surfacewindow.resources> <imagebrush x:key="windowbackground" stretch="none" opacity="0.6" imagesource="pack://application:,,,/resources/windowbackground.jpg"/> <storyboard x:key="flipforward" completed="flipcompleted"> <doubleanimation by="180" duration="0:0:0.5" storyboard.targetproperty="(s:scatterviewitem.orientation)" /> </storyboard> <storyboard x:key="flipbackward"> <doubleanimation by="-180" duration="0:0:0.5" storyboard.targetproperty="(s:scatterviewitem.orientation)" /> </storyboard> </s:surfacewindow.resources> <grid background="{staticresource windowbackground}" > <s:scatterview> <s:scatterviewitem x:name="_item"> <s:scatterviewitem.style> <style targettype="{x:type s:scatterviewitem}" basedon="{staticresource {x:type s:scatterviewitem}}"> <style.triggers> <datatrigger binding="{binding elementname=_button,path=ischecked}" value="true"> <datatrigger.enteractions> <beginstoryboard> <staticresource resourcekey="flipforward" /> </beginstoryboard> </datatrigger.enteractions> <datatrigger.exitactions> <beginstoryboard> <staticresource resourcekey="flipbackward" /> </beginstoryboard> </datatrigger.exitactions> </datatrigger> </style.triggers> </style> </s:scatterviewitem.style> <s:surfacetogglebutton margin="20" x:name="_button">click me!</s:surfacetogglebutton> </s:scatterviewitem> </s:scatterview> </grid> </s:surfacewindow>
bart roozendaal, sevensteps
Other Forums > Surface Application Design and Development
Comments
Post a Comment