Using Blend with Page Transactions RRS feed

  • Question

  • Hi

    Brand new to Blend so forgive me if this is a dumb question.

    I have a WPF Project in VS2010

    It consist of a MainWindow.xaml




    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" xmlns:ee="http://schemas.microsoft.com/expression/2010/effects" xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" x:Class="MainWindow"

    Title="MainWindow" Background="Aqua" MinHeight="768" MinWidth="1024" mc:Ignorable="d" d:DesignHeight="407" d:DesignWidth="847" SizeToContent="WidthAndHeight">

    <DockPanel Background="BurlyWood">

    <TextBlock Background="Yellow" DockPanel.Dock="Bottom" MinHeight="25" Height="29">

    <Button Content="Button" Height="23" x:Name="Button1" Width="75" />

    <Button Content="Button" Height="23" x:Name="Button2" Width="75" />

    <Button Content="Button" Height="23" Name="Button3" Width="75" />


    <Frame x:Name="MainFrame" Margin="5,10,10,5"

    NavigationUIVisibility="Hidden" Background="Beige"/>



    The code behind:

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button1.Click

    MainFrame.Source = New Uri("/Forms/Page1.xaml", UriKind.Relative)

    End Sub

    Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button2.Click

    MainFrame.Source = New Uri("/Forms/Page2.xaml", UriKind.Relative)

    End Sub

    And 2 Pages Page1.xaml and Page2.xaml







    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" xmlns:ee="http://schemas.microsoft.com/expression/2010/effects" x:Name="page" x:Class="Page2"



    Title="Page2" d:DesignHeight="321" d:DesignWidth="633">

    <Grid x:Name="grid" Background="Coral">

    <TextBlock x:Name="textBlock"><Run Text="Page 2"/></TextBlock>



    Both pages have the same code except one is Page1 and the other is Page2.

    What I would like to have happen is that when one of the buttons is clicked on the MainWindow.xaml that button's corresponding Page will open with some sort of animation technique. Very simular to this website:


    When you click on a Nav button on this page you will see the page opens as if it is coming up from the bottom of the screen.

    How do you do this in Blend 4? I have seen other programmers do this and it looked so easy but now that I am infront of my computer I can not figure it out.

    Please help

    Thank You

    • Moved by Min Zhu Monday, November 29, 2010 7:28 AM (From:Windows Presentation Foundation (WPF))
    Sunday, November 28, 2010 4:10 PM

All replies