locked
Can I have controls that can be dragged and also have Storyboard animations? RRS feed

  • Question

  • I want to be able to drag my controls across the screen, and I also want the controls have their own animations so that they can move to a certain position from wherever they have been dragged on the screen.

    Is there any way I can do this?

    Friday, September 6, 2013 12:25 PM

Answers

  • This is an odd way of doing things, at least it is to me.  I prefer to use real positioning on a canvas rather than using transforms.

    Here's my content inside the grid:

       <Page.Resources>
            <Style x:Key="btnTest" TargetType="Button">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Pressed"/>
                                        <VisualState x:Name="Disabled"/>
                                        <VisualState x:Name="PointerOver"/>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="FocusStates">
                                        <VisualState x:Name="Focused"/>
                                        <VisualState x:Name="PointerFocused"/>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <TextBlock x:Name="name" HorizontalAlignment="Left" Height="28" Margin="-82,41,-81,-27" TextWrapping="Wrap" Text="{TemplateBinding Content}" VerticalAlignment="Top" Width="205" TextAlignment="Center"/>
                                <Ellipse x:Name="circle" Fill="{TemplateBinding Background}" Stroke="White" StrokeThickness="3"/>
                                <TextBlock x:Name="no1" HorizontalAlignment="Left" Height="21" Margin="-13,11,-14,0" TextWrapping="Wrap" Text="{TemplateBinding Tag}" VerticalAlignment="Top" Width="69" TextAlignment="Center"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Storyboard x:Name="MoveToPosition">
                <!--<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="GK">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="159.701"/>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="GK">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-149.254"/>
                </DoubleAnimationUsingKeyFrames>-->
                <DoubleAnimation Storyboard.TargetName="GK" Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:1"  To="500" x:Name="LeftAnimation"/>
                <DoubleAnimation Storyboard.TargetName="GK" Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:1" To="500" x:Name="TopAnimation"/>
            </Storyboard>
        </Page.Resources>
    
        <Canvas x:Name="teamGrid" Background="#FF1111D6">
    
            <Rectangle x:Name="Pitch" Fill="#FF1111D6" HorizontalAlignment="Left" Height="767" Margin="-1,0,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="1367"/>
            <Ellipse x:Name="D01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="100,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/>
            <Ellipse x:Name="D02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="1117,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/>
            <Ellipse x:Name="centreCircle" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="492,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="381"/>
            <Path x:Name="HalfwayLine" Data="M682.09,0 L682.09,780.61" Fill="#FF1111D6" HorizontalAlignment="Left" Height="772" Margin="680.09,-4.986,0,-12.624" Stretch="Fill" Stroke="White" StrokeThickness="5" UseLayoutRounding="False" VerticalAlignment="Top" Width="5"/>
            <Ellipse x:Name="kickOff_" Fill="White" HorizontalAlignment="Left" Height="23" Margin="672,377,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="22"/>
            <Rectangle x:Name="box00" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="0,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/>
            <Rectangle x:Name="box01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="1181,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/>
            <Rectangle x:Name="box02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="0,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/>
            <Rectangle x:Name="box03" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="1271,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/>
            <Button x:Name="GK"   Content="Hello" Height="46" Style="{StaticResource btnTest}" Width="46" Tag="" ManipulationMode="All" Background="#FF27FD06" BorderBrush="White" ManipulationDelta="Drag_ManipulationDelta">
                <!--<Button.RenderTransform>
                    <CompositeTransform/>
                </Button.RenderTransform>-->
            </Button>
            <Button x:Name="MoveButton" Content="Button" HorizontalAlignment="Left" Height="65" Margin="1149,10,0,0" VerticalAlignment="Top" Width="159" Click="MoveButton_Click"/>
            
        </Canvas>
    I also changed the events inside the code-behind to this:
       private void Drag_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
            {
            //    TranslateTransform elementTransform = (TranslateTransform)
            //        (sender as UIElement).RenderTransform;
    
            //    elementTransform.X += e.Delta.Translation.X;
            //    elementTransform.Y += e.Delta.Translation.Y;
    
                Canvas.SetLeft(GK, e.Cumulative.Translation.X);
                Canvas.SetTop(GK, e.Cumulative.Translation.Y);
    
            }
    
            private void MoveButton_Click(object sender, RoutedEventArgs e)
            {
                LeftAnimation.From = Canvas.GetLeft(GK);
                TopAnimation.From = Canvas.GetTop(GK);
                MoveToPosition.Begin();
            }

    It's still a little flaky, but I think that you might want to consider using canvas.left and canvas.top properties everywhere you can since it's going to be more flexible and more sraightforward than the relative properties of transforms.


    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    • Marked as answer by EddyTheBlack Thursday, September 12, 2013 8:36 PM
    Thursday, September 12, 2013 4:39 PM
    Moderator

All replies

  • 1) Yes you can drag items across the screen using a canvas and with manipulation events

    2) Please explain the animations you want to use.


    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Friday, September 6, 2013 7:33 PM
    Moderator
  • What I want is an animation where a control moves directly to a certain position, at constant speed in a straight line regardless where it has been placed on the screen after being dragged.
    Friday, September 6, 2013 8:25 PM
  • Can anyone help me with this?
    Sunday, September 8, 2013 9:20 PM
  • Use a doubleanimation with a storyboard to change Canvas.Left and Canvas.Top of the control.
    Also, most people aren't working weekends.

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.


    Monday, September 9, 2013 12:45 PM
    Moderator
  • Monday, September 9, 2013 1:36 PM
  • This is what I have:

    // TeamvTeam is the constructor

    public TeamvTeam() { this.InitializeComponent(); GK.ManipulationMode = ManipulationModes.TranslateX | ManipulationModes.TranslateY; GK.RenderTransform = new TranslateTransform(); } protected override void OnNavigatedTo(NavigationEventArgs e) { } private void Drag_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e) { TranslateTransform elementTransform = (TranslateTransform) (sender as UIElement).RenderTransform; elementTransform.X += e.Delta.Translation.X; elementTransform.Y += e.Delta.Translation.Y; } private void MoveButton_Click(object sender, RoutedEventArgs e) { MoveToPosition.Begin(); }

    In the code above, GK is the control that is being dragged and has its ManipulationDelta method "Drag_Manipulation" which allows this.

    The "MoveButton_Click" is the event once I press the button for the animation to begin. (MovePosition being an instance of StoryBoard). But when I press the button, I get an error saying: Cannot resolve TargetProperty (UIElement.RenderTransform).(CompositeTransform.TranslateX) on specified object.

    How do I resolve this?

    Monday, September 9, 2013 5:13 PM
  • Can you show the XAML for this, or better yet, just put the project on Skydrive?

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Monday, September 9, 2013 5:31 PM
    Moderator
  • Here's the XAML:

    <Page x:Class="ProjectPassC.TeamvTeam" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:ProjectPassC" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Page.Resources> <Style x:Key="btnTest" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Pressed"/> <VisualState x:Name="Disabled"/> <VisualState x:Name="PointerOver"/> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"/> <VisualState x:Name="PointerFocused"/> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <TextBlock x:Name="name" HorizontalAlignment="Left" Height="28" Margin="-82,41,-81,-27" TextWrapping="Wrap" Text="{TemplateBinding Content}" VerticalAlignment="Top" Width="205" TextAlignment="Center"/> <Ellipse x:Name="circle" Fill="{TemplateBinding Background}" Stroke="White" StrokeThickness="3"/> <TextBlock x:Name="no1" HorizontalAlignment="Left" Height="21" Margin="-13,11,-14,0" TextWrapping="Wrap" Text="{TemplateBinding Tag}" VerticalAlignment="Top" Width="69" TextAlignment="Center"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <Storyboard x:Name="MoveToPosition"> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="GK"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:1" Value="159.701"/> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="GK"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-149.254"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </Page.Resources> <Grid x:Name="teamGrid" Background="#FF1111D6"> <Rectangle x:Name="Pitch" Fill="#FF1111D6" HorizontalAlignment="Left" Height="767" Margin="-1,0,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="1367"/> <Ellipse x:Name="D01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="100,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/> <Ellipse x:Name="D02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="1117,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/> <Ellipse x:Name="centreCircle" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="492,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="381"/> <Path x:Name="HalfwayLine" Data="M682.09,0 L682.09,780.61" Fill="#FF1111D6" HorizontalAlignment="Left" Height="772" Margin="680.09,-4.986,0,-12.624" Stretch="Fill" Stroke="White" StrokeThickness="5" UseLayoutRounding="False" VerticalAlignment="Top" Width="5"/> <Ellipse x:Name="kickOff_" Fill="White" HorizontalAlignment="Left" Height="23" Margin="672,377,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="22"/> <Rectangle x:Name="box00" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="0,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/> <Rectangle x:Name="box01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="1181,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/> <Rectangle x:Name="box02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="0,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/> <Rectangle x:Name="box03" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="1271,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/> <Button x:Name="GK" Content="" HorizontalAlignment="Left" Height="46" Margin="73,377,0,0" Style="{StaticResource btnTest}" VerticalAlignment="Top" Width="46" Tag="" ManipulationMode="All" Background="#FF27FD06" BorderBrush="White" ManipulationDelta="Drag_ManipulationDelta" RenderTransformOrigin="0.5,0.5"> <Button.RenderTransform> <CompositeTransform/> </Button.RenderTransform> </Button> <Button Content="Button" HorizontalAlignment="Left" Height="65" Margin="1149,10,0,0" VerticalAlignment="Top" Width="159" Click="Move"/> </Grid>

    </Page>

    I've made in bold what's probably the most important parts.

    Monday, September 9, 2013 5:59 PM
  • This is an odd way of doing things, at least it is to me.  I prefer to use real positioning on a canvas rather than using transforms.

    Here's my content inside the grid:

       <Page.Resources>
            <Style x:Key="btnTest" TargetType="Button">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Pressed"/>
                                        <VisualState x:Name="Disabled"/>
                                        <VisualState x:Name="PointerOver"/>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="FocusStates">
                                        <VisualState x:Name="Focused"/>
                                        <VisualState x:Name="PointerFocused"/>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <TextBlock x:Name="name" HorizontalAlignment="Left" Height="28" Margin="-82,41,-81,-27" TextWrapping="Wrap" Text="{TemplateBinding Content}" VerticalAlignment="Top" Width="205" TextAlignment="Center"/>
                                <Ellipse x:Name="circle" Fill="{TemplateBinding Background}" Stroke="White" StrokeThickness="3"/>
                                <TextBlock x:Name="no1" HorizontalAlignment="Left" Height="21" Margin="-13,11,-14,0" TextWrapping="Wrap" Text="{TemplateBinding Tag}" VerticalAlignment="Top" Width="69" TextAlignment="Center"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Storyboard x:Name="MoveToPosition">
                <!--<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="GK">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="159.701"/>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="GK">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-149.254"/>
                </DoubleAnimationUsingKeyFrames>-->
                <DoubleAnimation Storyboard.TargetName="GK" Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:1"  To="500" x:Name="LeftAnimation"/>
                <DoubleAnimation Storyboard.TargetName="GK" Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:1" To="500" x:Name="TopAnimation"/>
            </Storyboard>
        </Page.Resources>
    
        <Canvas x:Name="teamGrid" Background="#FF1111D6">
    
            <Rectangle x:Name="Pitch" Fill="#FF1111D6" HorizontalAlignment="Left" Height="767" Margin="-1,0,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="1367"/>
            <Ellipse x:Name="D01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="100,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/>
            <Ellipse x:Name="D02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="149" Margin="1117,315,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="149"/>
            <Ellipse x:Name="centreCircle" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="492,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="381"/>
            <Path x:Name="HalfwayLine" Data="M682.09,0 L682.09,780.61" Fill="#FF1111D6" HorizontalAlignment="Left" Height="772" Margin="680.09,-4.986,0,-12.624" Stretch="Fill" Stroke="White" StrokeThickness="5" UseLayoutRounding="False" VerticalAlignment="Top" Width="5"/>
            <Ellipse x:Name="kickOff_" Fill="White" HorizontalAlignment="Left" Height="23" Margin="672,377,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="22"/>
            <Rectangle x:Name="box00" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="0,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/>
            <Rectangle x:Name="box01" Fill="#FF1111D6" HorizontalAlignment="Left" Height="381" Margin="1181,196,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="185"/>
            <Rectangle x:Name="box02" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="0,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/>
            <Rectangle x:Name="box03" Fill="#FF1111D6" HorizontalAlignment="Left" Height="255" Margin="1271,263,0,0" Stroke="White" StrokeThickness="5" VerticalAlignment="Top" Width="95"/>
            <Button x:Name="GK"   Content="Hello" Height="46" Style="{StaticResource btnTest}" Width="46" Tag="" ManipulationMode="All" Background="#FF27FD06" BorderBrush="White" ManipulationDelta="Drag_ManipulationDelta">
                <!--<Button.RenderTransform>
                    <CompositeTransform/>
                </Button.RenderTransform>-->
            </Button>
            <Button x:Name="MoveButton" Content="Button" HorizontalAlignment="Left" Height="65" Margin="1149,10,0,0" VerticalAlignment="Top" Width="159" Click="MoveButton_Click"/>
            
        </Canvas>
    I also changed the events inside the code-behind to this:
       private void Drag_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
            {
            //    TranslateTransform elementTransform = (TranslateTransform)
            //        (sender as UIElement).RenderTransform;
    
            //    elementTransform.X += e.Delta.Translation.X;
            //    elementTransform.Y += e.Delta.Translation.Y;
    
                Canvas.SetLeft(GK, e.Cumulative.Translation.X);
                Canvas.SetTop(GK, e.Cumulative.Translation.Y);
    
            }
    
            private void MoveButton_Click(object sender, RoutedEventArgs e)
            {
                LeftAnimation.From = Canvas.GetLeft(GK);
                TopAnimation.From = Canvas.GetTop(GK);
                MoveToPosition.Begin();
            }

    It's still a little flaky, but I think that you might want to consider using canvas.left and canvas.top properties everywhere you can since it's going to be more flexible and more sraightforward than the relative properties of transforms.


    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    • Marked as answer by EddyTheBlack Thursday, September 12, 2013 8:36 PM
    Thursday, September 12, 2013 4:39 PM
    Moderator
  • I see.

    Can you point me in the direction on how to make us of the Canvas? How do positions of controls work with a Canvas?

    Also, I've had a go with your implementation. Now, the drag doesn't seem to work as intended. When you drag the first time it's okay. But if I want to drag a second time, its drags awkwardly out of sync with when the you touch/click the control
    • Edited by EddyTheBlack Thursday, September 12, 2013 7:20 PM
    Thursday, September 12, 2013 7:08 PM
  • Yes, that's why I said it was flaky.  Canvas allows for use of absolute positioning. Canvas.Left and Canvas.Top take double values which allow you to specify where everything goes.

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Thursday, September 12, 2013 7:22 PM
    Moderator
  • Okay, I've made some tweaks to your code. I've got it to work. Thanks for your help. Could you direct me on some documentation on using a Canvas please?
    • Edited by EddyTheBlack Thursday, September 12, 2013 8:37 PM
    Thursday, September 12, 2013 8:36 PM
  • I think this will help:
    http://wpftutorial.net/Canvas.html

    Honestly, there's very little to it - left and top, z-order.  It's basically something that you draw on using the shapes and you've already mastered that.  I don't have any awesome documentation to point you to.


    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Friday, September 13, 2013 2:47 PM
    Moderator