title: windows phone 7, Button template image source binding
body: <p>I have got Pivot with ListBoxes in each PevotItem. I've made Button control for animating items in ListBoxes. There is tree of those buttons - each of them has different image in it. However maybe there is some way to make one Button and just bind the image source. I think it will improve loading page time.</p>
  
  <p>I will be thankful for any answer.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>    &lt;DataTemplate x:Key="pageItemTemplate"&gt;
          &lt;Button Content="{Binding name}" Margin="0,0,0,20" Style="{StaticResource PageListItemButton}"/&gt;
      &lt;/DataTemplate&gt;
  
  
  
  
  &lt;Style x:Key="PageListItemButton" TargetType="Button"&gt;
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="Button"&gt;
                      &lt;StackPanel x:Name="stackPanel" Orientation="Horizontal"&gt;
                          &lt;StackPanel.Projection&gt;
                              &lt;PlaneProjection CenterOfRotationY="0" CenterOfRotationX="1"/&gt;
                          &lt;/StackPanel.Projection&gt;
                          &lt;VisualStateManager.VisualStateGroups&gt;
                              &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                  &lt;VisualStateGroup.Transitions&gt;
                                      &lt;VisualTransition GeneratedDuration="0:0:0.05"&gt;
                                          &lt;VisualTransition.GeneratedEasingFunction&gt;
                                              &lt;CircleEase EasingMode="EaseInOut"/&gt;
                                          &lt;/VisualTransition.GeneratedEasingFunction&gt;
                                      &lt;/VisualTransition&gt;
                                  &lt;/VisualStateGroup.Transitions&gt;
                                  &lt;VisualState x:Name="Normal"/&gt;
                                  &lt;VisualState x:Name="MouseOver"/&gt;
                                  &lt;VisualState x:Name="Pressed"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="stackPanel" d:IsOptimized="True"/&gt;
                                          &lt;DoubleAnimation Duration="0" To="0.7" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="stackPanel" d:IsOptimized="True"/&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="Disabled"/&gt;
                              &lt;/VisualStateGroup&gt;
                          &lt;/VisualStateManager.VisualStateGroups&gt;
                          &lt;Image Source="Images/MainPage/page.png" Height="40" Stretch="Fill" Width="40"/&gt;
                          &lt;ContentPresenter VerticalAlignment="Bottom"/&gt;
                      &lt;/StackPanel&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
          &lt;Setter Property="FontFamily" Value="/BestNote;component/Fonts/Fonts.zip#Diavlo Bold"/&gt;
          &lt;Setter Property="FontWeight" Value="Bold"/&gt;
          &lt;Setter Property="FontSize" Value="24"/&gt;
          &lt;Setter Property="Foreground" Value="#FF292929"/&gt;
      &lt;/Style&gt;
  </code></pre>