Add behavior to datatemplate/itemstemplate RRS feed

  • Question

  • Hello,


    is it possible to add a behavior (in my case TranslateZoomRotateBehavior) to an itemtemplate/datatemplate. I have a surfacelistbox where the items get filled by databinding. But i want when i do a rotate gesture on an item, it rotates (and if possible all items rotate), each time 180°.


    Friday, December 9, 2011 4:01 PM

All replies

  • I just tried it, it seems to work ok by putting it into the template. I used the ItemContainerStyle, but it should work in the ItemTEmplate as well. If it doesn't work, post the xaml you are using.
    Friday, December 9, 2011 4:58 PM
  • Thanks for helping, I'll test it @ the office monday!
    Saturday, December 10, 2011 1:29 PM
  • Hi, i can't drag the behavior on de template, not even de itemcontainerstyle:




                        <Style TargetType="{x:Type s:ScatterViewItem}">


                            <Setter Property="Background"

      Value="{DynamicResource {x:Static s:SurfaceColors.ScatterViewItemBackgroundBrushKey}}" />

                            <Setter Property="BorderBrush"

      Value="{x:Null}" />

                            <Setter Property="Foreground"

      Value="{DynamicResource {x:Static s:SurfaceColors.ScatterViewItemForegroundBrushKey}}" />

                            <Setter Property="BorderThickness"

      Value="0" />

                            <Setter Property="HorizontalContentAlignment"

      Value="Stretch" />

                            <Setter Property="VerticalContentAlignment"

      Value="Stretch" />

                            <Setter Property="MinWidth" 


                            <Setter Property="MinHeight" 


                            <Setter Property="Template">


                                    <ControlTemplate TargetType="{x:Type s:ScatterViewItem}">


                                            <Storyboard x:Key="ActivationTimeline">

                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Overlay">

                                                    <SplineDoubleKeyFrame KeyTime="0:0:0.017" Value="0.1" KeySpline="0,0.43,0.2,1"/>

                                                    <SplineDoubleKeyFrame KeyTime="0:0:1.3" Value="0" KeySpline="0.21,0,0,1"/>




                                            <Storyboard x:Key="DeactivateTimeline"/>



                                        <Grid x:Name="container"  

      RenderTransformOrigin="{TemplateBinding RenderTransformOrigin}">


                                                <ScaleTransform ScaleX="1"

      ScaleY="1" />


                                            <Border x:Name="contentBorder"

      Width="{TemplateBinding Width}"

      Height="{TemplateBinding Height}"

      MinHeight="{TemplateBinding MinHeight}"

      MinWidth="{TemplateBinding MinWidth}"

      MaxHeight="{TemplateBinding MaxHeight}"

      MaxWidth="{TemplateBinding MaxWidth}"

      BorderBrush="{TemplateBinding BorderBrush}"

      BorderThickness="{TemplateBinding BorderThickness}">


                                                    <ContentPresenter x:Name="Content"  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"

      Margin="{TemplateBinding Padding}" />

                                                    <Border x:Name="Overlay" Background="#FFE6E6E6" Opacity="0" IsHitTestVisible="False"/>







                                                    <Condition  Property="IsContainerActive"

      Value="True" />

                                                    <Condition  Property="ShowsActivationEffects"

      Value="True" />




                                            <Trigger Property="IsEnabled"


                                                <Setter Property="Opacity"


      Value="0.4" />






                 <Setter Property="Background" Value="Transparent"/>

                            <Setter Property="Width" Value="Auto"/>

    <Setter Property="Height" Value="Auto"/>                





    <DataTemplate x:Key="Test23">






    Thanks for the help

    Monday, December 12, 2011 9:28 AM
  • What steps are you taking when editing the template and trying to drag/drop the behavior?
    Monday, December 12, 2011 7:40 PM
  • right click - edit templates and from there assets -> behavior ->drag and drop....
    Tuesday, December 13, 2011 11:47 AM
  • Interesting, those are exactly the steps I used. Where are you dragging to? I don't recall if I dragged it to the artboard or to the O&T tree.
    Wednesday, December 14, 2011 3:48 PM
  • I drag it on the artboard.
    Thursday, December 15, 2011 9:06 AM