[windows phone开发]新生助手的开发过程与体会一
功能需求分析：
1． 为到达学院的新生指路，给出所有路线，并给出必要提示；
2． 对学院建筑进行介绍；
3． 对学院周边环境（交通、购物、银行等）进行介绍；
4． 必要的应用设置
总体设计：
采用全景视图，分为四页对各项功能依次实现。
下面就向大家大概介绍一下具体的实现过程，之中可能会掺杂着我自己的一些实际体会。
一． 首先建立在Visual Studio 2012或者Visual Studio Express 2012中新建一个Windows phone全景应用程序，名称改为StudentAssistant，不要用汉语名称，这样工程中的名称空间都会是这个名字，虽然不影响开发，但最终是发布不到应用商店里的，所以不要给自己找麻烦。之后选择你所开发应用所要应用的平台，我们选择Windows phone OS 8.0。
二．
我们的首页效果是这样的。
- 首先更改全景视图的背景图片
右击工程名 StudentAssistant->添加->新建文件夹，名称改为Images，右击Images->添加->现有项，添加你需要的图片到此文件夹，更改图片名为BackGround.jpg，以后所有图片均类似添加，不在重复叙述。
将MainPage.xaml中
<phone:Panorama.Background>
<ImageBrush ImageSource="/PanoramaApp1;component/Assets/PanoramaBackground.png"/>
</phone:Panorama.Background>
更改为
<phone:Panorama.Background>
<ImageBrush ImageSource="/StudentAssistant;component/Assets/PanoramaBackground.png"/>
</phone:Panorama.Background>
也就是将ImageSource更改为你所要应用的图片的位置。
- 个性化标题
删去
Title="我的应用程序"
在添加背景图片代码的下方添加：
<phone:Panorama.Title>
<Image Margin="-70,40,0,-35" Height="230" Source="/Images/Title.png"/>
</phone:Panorama.Title>
你就可以将自己设计的任何个性化的标题（实际上是自己Ps的图片）作为自己的应用标题，想怎么个性就怎么个性，Margin的参数根据需要自己调整，不再多说。
下面就正式进入功能设计
删去项目一中我们不需要的代码
<!--具有文字环绕的单行列表-->
<phone:LongListSelector Margin="0,0,-22,0" ItemsSource="{Binding Items}">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,-6,0,12">
<TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
在项目一中添加如下代码
<ScrollViewer Margin="0,-35,12,0" ScrollViewer.VerticalScrollBarVisibility="Auto" > <ScrollViewer.Content> <StackPanel VerticalAlignment="Top" Orientation="Vertical" > <Image x:Name="TritangleDown" Visibility="Collapsed" Source="/Images/Map/下向箭头.png"/> <Image x:Name="TritangleRight" Visibility="Collapsed" Source="/Images/Map/右向箭头.png"/> <Button x:Name="ButtonDaLian" Margin="0,0,0,10" BorderThickness="0" Height="75" Width="389" Click="ButtonDaLian_Click"> <Grid Width="390" > <Grid.ColumnDefinitions> <ColumnDefinition Width="75"/> <ColumnDefinition/> <ColumnDefinition Width="43"/> </Grid.ColumnDefinitions> <Image HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="0" Source="/Images/Map/火车.png" Margin="0"/> <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="1" Foreground="White" Text="大连火车站" FontSize="45" Margin="10,0,0,0"/> <Image x:Name="ImageDaLian" VerticalAlignment="Center" HorizontalAlignment="Left" Grid.Column="2" Width="35" Source="/Images/Map/右向箭头.png"/> </Grid> </Button> <Button Visibility="Collapsed" x:Name="BDTaxi" BorderThickness="0" Width="389"> <TextBlock HorizontalAlignment="Left" FontSize="35" Text=" 出租车" Width="389"/> </Button> </StackPanel> </ScrollViewer.Content> </ScrollViewer>
在后台代码MainPage.xaml.cs
public partial class MainPage : PhoneApplicationPage
中添加一个bool变量IsTouch，设为false，此变量是用来判断button是否被点击，从而使button做出不同的反应。此处button不点击右侧的箭头指向右，点击后箭头指向下，同时BDTaxi的可见性由不可见变为可见。
再处理ButtonDaLian的Click事件
private void ButtonDaLian_Click(object sender, RoutedEventArgs e)
{
if (IsTouch == false)
{
IsTouch = true;
BDTaxi.Visibility = Visibility.Visible;
ImageDaLian.Source = TritangleDown.Source;
}
else
{
IsTouch = false;
BDTaxi.Visibility = Visibility.Collapsed;
ImageDaLian.Source = TritangleRight.Source;
}
}
到此为止，首页的基本效果就做出来了。
总结一下：我们通过将应用标题替换成图片个性化了标题，构造了一个复合button，左边用来显示与button功能有关的图片，右边的箭头可以通过button的是否点击显示不同的箭头方向（实际上是两张不同的图片）。大家可以去Windows phone 的商店里搜索新生助手去下载一下体验一下这个应用的设计，功能估计大家用不上。http://www.windowsphone.com/zh-cn/store/app/%E6%96%B0%E7%94%9F%E5%8A%A9%E6%89%8B/d2f242a9-968c-4e7a-9b7c-1bef203c6d24
实际的应用还用blend处理了button的点击效果，边界大小等等，这里不再赘述，有兴趣的可以自学一下。
下一讲将向大家介绍新生助手应用中用到的storyboard和动态磁帖设计，通过它们可以制作一些很好的动画效果。
