silverlight程序，在多页面之间进行导航

问题背景：

类似ASP.NET的masterPage的形式，在父页A中，留有一块类似ASP.NET的ContentPlaceHolder的容器，这个容器里面，我们可以对子页B、C之间进行切换。

导航事件的触发按钮，我们写成用户控件形式，包含在子页B、C里面，点击这些按钮，要能触发父页的导航控件。

解决思路：

在程序集 System.Windows.Controls.Navigation 中，有Frame控件，该控件提供了Navigate方法，使得我们可以像沿用ASP.NET的masterPage的风格，来使用silverlight进行多页面之间的导航。

用户控件可以使用VisualTreeHelper来向上遍历，直到查询到我们所需要的导航控件，然后就可以使用该控件进行导航啦。

核心步骤：

1：用户控件中的按钮要能触发父页面的导航控件。

我们可以抽象成，子控件需要可以向上遍历，当查询到父控件后，获取父控件的引用。

本部分代码如下：

using System;
using System.Windows;
using System.Windows.Media;
namespace userControlNavigate
{
public class SearchParentControl
{
public static T getParentColtrol<T>(DependencyObject childControl, string parentControlName) where T : FrameworkElement
{
DependencyObject currentParentControl = VisualTreeHelper.GetParent(childControl);

while (currentParentControl!=null)
{
//如果当前父元素和我们要找的类型名称一致，返回，当然，我们可以省略查询父控件的名称，这样向上遍历时匹配到合适的类型，就立刻返回。
if (currentParentControl is T &&
(string.Equals((currentParentControl as T).Name, parentControlName, StringComparison.CurrentCultureIgnoreCase) |
string.IsNullOrEmpty(parentControlName)))
{
return currentParentControl as T;
}
currentParentControl = VisualTreeHelper.GetParent(currentParentControl);
}
return null;
}
}
}

2：在获取父控件后，要使用该控件提供的导航功能

using System;
using System.Windows;
using System.Windows.Controls;

namespace userControlNavigate
{
public class NavHelper
{
private static string URIPath = "/";
/// <summary>
/// 用于子控件获取父控件的nav控件，然后使用该nav控件导航到指定的页面
/// </summary>
/// <param name="sender">子控件实体</param>
/// <param name="searchName">父控件名称</param>
/// <param name="NavViewName">要导航到视图的名称,注意是文件名称，不是路径，页面文件都在指定页面文件夹下</param>
public static void navigate(DependencyObject sender, string searchName, string NavViewName)
{
Frame NavFrame = SearchParentControl.getParentColtrol<Frame>(sender, searchName);
NavFrame.Navigate(new Uri(URIPath + NavViewName, UriKind.Relative));
}
}
}

更动态的页面切换方式

silverlight给我们提供了丰富属性来供动画使用，在本例中，我们希望在新的页面切人的时候以翻转的形式进入我们的视野

通过对目标控件PlaneProjection.RotationY的值进行操作，我们可以达到在Y轴上翻转的效果。

前台代码如下：

<UserControl x:Class="userControlNavigate.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:nav="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.Resources>
<Storyboard x:Name="SBFadeIn">
<DoubleAnimation Duration="0:0:0.3" From="-90" To="0" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="NavFrame" d:IsOptimized="True"/>
</Storyboard>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="0.2*" />
<RowDefinition Height="0.6*"/>
<RowDefinition Height="0.12*"/>
</Grid.RowDefinitions>
<TextBlock Foreground="Black" FontSize="30" Grid.Row="0" HorizontalAlignment="Center">HEAD</TextBlock>

<nav:Frame x:Name="NavFrame" Grid.Row="1" Navigated="NavFrame_Navigated">
<nav:Frame.Projection>
<PlaneProjection />
</nav:Frame.Projection>
</nav:Frame>

<TextBlock Foreground="Black" FontSize="30" Grid.Row="2" HorizontalAlignment="Center">Foot</TextBlock>
</Grid>
</UserControl>

当导航完成后，我们播放切入动画，实现新页面翻转进入视野

后台代码：

using System;
using System.Windows;
using System.Windows.Controls;

namespace userControlNavigate
{
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
Loaded+=new RoutedEventHandler(MainPage_Loaded);
}
private void MainPage_Loaded(object sender, EventArgs e)
{
NavFrame.Navigate(new Uri("/Home.xaml", UriKind.Relative));
}

private void NavFrame_Navigated(object sender, System.Windows.Navigation.NavigationEventArgs e)
{
SBFadeIn.Begin();
}
}
}

更动态的背景图片

借助于silverlight动画，我们可以将动画直接作为网站的背景，本例中动画使用<Grid><Canvas>的容器顺序，通过Grid达到将背景动画铺满浏览器，通过Canvas的 Z-index属性，将背景动画垫在诸多控件底部。这样我们的背景动画就完成架构啦。动画的代码是直接拿同事的作品。。就不贴了，源码里面有。

源码在一楼奉上