wp———图片切换效果
此篇文章主要是记录一下使用XamlReader加载动画时遇到的一些问题。
首先呢，把源码附上
<phone:PhoneApplicationPage
x:Class="PicChangedAnimation.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot 是包含所有页面内容的根网格-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Image x:Name="image" Stretch="Fill" Source="/Image/a.jpg" RenderTransformOrigin="0.5,0.5">
<Image.RenderTransform>
<CompositeTransform/>
</Image.RenderTransform>
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragCompleted="GestureListener_DragCompleted_1"/>
</toolkit:GestureService.GestureListener>
</Image>
<Image x:Name="image1" Stretch="Fill" Source="/Image/b.jpg" RenderTransformOrigin="0.5,0.5">
<Image.RenderTransform>
<CompositeTransform/>
</Image.RenderTransform>
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragCompleted="GestureListener_DragCompleted_2"/>
</toolkit:GestureService.GestureListener>
</Image>
</Grid> </phone:PhoneApplicationPage>
using System;
using System.Windows;
using System.Windows.Markup;
using System.Windows.Controls;
using Microsoft.Phone.Controls;
using System.Windows.Navigation;
using System.Windows.Media.Animation; namespace PicChangedAnimation
{
public partial class MainPage : PhoneApplicationPage
{
// 构造函数
public MainPage()
{
InitializeComponent();
} // ====================================================================================================================
private void GestureListener_DragCompleted_1(object sender, DragCompletedGestureEventArgs e) {
if (e.HorizontalChange < - && e.HorizontalVelocity < ) {
//LeftSlideStoryboard.Begin();
string moveLeft = -(LayoutRoot.ActualWidth) + "";
Storyboard sb = InitLeftSlideStoryboard(moveLeft, image1, image);
if (sb != null) {
try {
sb.Begin();
} catch (Exception ex) {
System.Diagnostics.Debug.WriteLine(ex.Message);
}
}
e.Handled = true;
} else if (e.HorizontalChange > && e.HorizontalVelocity > ) {
string moveLeft = LayoutRoot.ActualWidth + "";
Storyboard sb = InitLeftSlideStoryboard(moveLeft, image1, image);
if (sb != null) {
try {
sb.Begin();
} catch (Exception ex) {
System.Diagnostics.Debug.WriteLine(ex.Message);
}
}
e.Handled = true;
}
} private void GestureListener_DragCompleted_2(object sender, DragCompletedGestureEventArgs e) {
if (e.HorizontalChange < - && e.HorizontalVelocity < ) {
//LeftSlideStoryboard.Begin();
string moveLeft = -(LayoutRoot.ActualWidth) + "";
Storyboard sb = InitLeftSlideStoryboard(moveLeft, image, image1);
if (sb != null) {
try {
sb.Begin();
} catch (Exception ex) {
System.Diagnostics.Debug.WriteLine(ex.Message);
}
}
e.Handled = true;
} else if (e.HorizontalChange > && e.HorizontalVelocity > ) {
string moveLeft = LayoutRoot.ActualWidth + "";
Storyboard sb = InitLeftSlideStoryboard(moveLeft, image, image1);
if (sb != null) {
try {
sb.Begin();
} catch (Exception ex) {
System.Diagnostics.Debug.WriteLine(ex.Message);
}
}
e.Handled = true;
}
} // ====================================================================================================================
// // {0}-{-480}
// private string LEFT_SLIDE_STORYBOARD =
// @"<Storyboard x:Name=""LeftSlideStoryboard""
// xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
// xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
// xmlns:phone=""clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone""
// xmlns:shell=""clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone""
// xmlns:d=""http://schemas.microsoft.com/expression/blend/2008""
// xmlns:mc=""http://schemas.openxmlformats.org/markup-compatibility/2006""
// mc:Ignorable=""d"" >
// <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.Opacity)"">
// <EasingDoubleKeyFrame KeyTime=""0"" Value=""0""/>
// <EasingDoubleKeyFrame KeyTime=""0:0:0.6"" Value=""1""/>
// </DoubleAnimationUsingKeyFrames>
// <DoubleAnimation Duration=""0:0:0.6"" To=""0"" Storyboard.TargetProperty=""(UIElement.Opacity)"" d:IsOptimized=""True""/>
// <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.RenderTransform).(CompositeTransform.TranslateX)"">
// <EasingDoubleKeyFrame KeyTime=""0:0:0.6"" Value=""{0}""/>
// <EasingDoubleKeyFrame KeyTime=""0:0:0.61"" Value=""0""/>
// </DoubleAnimationUsingKeyFrames>
// </Storyboard>";
private string LEFT_SLIDE_STORYBOARD =
@"<Storyboard x:Name=""LeftSlideStoryboard""
xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
xmlns:phone=""clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone""
xmlns:shell=""clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone""
xmlns:d=""http://schemas.microsoft.com/expression/blend/2008""
xmlns:mc=""http://schemas.openxmlformats.org/markup-compatibility/2006""
mc:Ignorable=""d"" >
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.Opacity)"">
<EasingDoubleKeyFrame KeyTime=""0"" Value=""0""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.01"" Value=""0""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.6"" Value=""1""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.61"" Value=""1""/>
</DoubleAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.Visibility)"">
<DiscreteObjectKeyFrame KeyTime=""0"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.01"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.6"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.61"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.Opacity)"">
<EasingDoubleKeyFrame KeyTime=""0"" Value=""1""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.01"" Value=""1""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.6"" Value=""0""/>
</DoubleAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.Visibility)"">
<DiscreteObjectKeyFrame KeyTime=""0"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.01"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.6"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime=""0:0:0.61"">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty=""(UIElement.RenderTransform).(CompositeTransform.TranslateX)"">
<EasingDoubleKeyFrame KeyTime=""0:0:0.6"" Value=""{0}""/>
<EasingDoubleKeyFrame KeyTime=""0:0:0.61"" Value=""0""/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>"; public Storyboard InitLeftSlideStoryboard(string moveLeft, Image backCtrl, Image frontCtrl) {
string displayXaml = string.Format(LEFT_SLIDE_STORYBOARD, moveLeft);
Storyboard storyboard = null;
try {
storyboard = XamlReader.Load(displayXaml) as Storyboard;
Storyboard.SetTarget(storyboard.Children[], backCtrl);
Storyboard.SetTarget(storyboard.Children[], backCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
} catch (Exception e) {
System.Diagnostics.Debug.WriteLine(e.Message);
}
return storyboard;
} }
}
然后呢，说下遇到的问题：
1、“System.Windows.Markup.XamlParseException”类型的第一次机会异常在 System.Windows.ni.dll 中发生undeclared prefix [Line: 1 Position: 42]
问题出在，加载xaml语句时，存在没有声明就使用的类型前缀
我们添加上下面的引用就可以了
xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
xmlns:phone=""clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone""
xmlns:shell=""clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone""
xmlns:d=""http://schemas.microsoft.com/expression/blend/2008""
xmlns:mc=""http://schemas.openxmlformats.org/markup-compatibility/2006""
mc:Ignorable=""d""
2、“System.InvalidOperationException”类型的第一次机会异常在 System.Windows.ni.dll 中发生Animation target not specified.
问题出在，没有指定动画的目标控件，但即使我们在xaml中指定了，但一样会出现这样的问题，原因在上面的xaml中没有控件的声明。
解决方法可以采用c#代码中指定，如下
storyboard = XamlReader.Load(displayXaml) as Storyboard;
Storyboard.SetTarget(storyboard.Children[], backCtrl);
Storyboard.SetTarget(storyboard.Children[], backCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
Storyboard.SetTarget(storyboard.Children[], frontCtrl);
wp———图片切换效果的更多相关文章
- js鼠标滚轮滚动图片切换效果
效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...
- 精致3D图片切换效果，最适合企业产品展示
这是一个精致的立体图片切换效果,特别适合企业产品展示,可立即用于实际项目中.支持导航和自动播放功能, 基于 CSS3 实现,推荐使用最新的 Chrome,Firefox 和 Safari 浏览器浏览效 ...
- jquery简单的图片切换效果，支持pc端、移动端的banner图片切换开发
详细内容请点击 无意中看见了两年前写的一个图片切换,那会儿刚刚学习网页制作,可以说是我的第一个处女座的jquery图片切换效果.无聊之余对它的宽度稍稍做了一下修改,变成了支持pc端.手机端全屏的ban ...
- 100种不同图片切换效果插件pageSwitch
分享100种不同图片切换效果插件pageSwitch.这是一款适用于全屏切换场景,即一切一屏,并且实现了超过一百种切换效果,支持自定义切页动画.效果图如下: 在线预览 源码下载 实现的代码. ht ...
- Flash 用FLASH遮罩效果做图片切换效果
本教程是关于FLASH应用遮罩效果制作好看的图片切换效果.该教程选用FLASH遮罩中最简单的一种作为例子,当然你可以用自己的想象力来做出更多更好的图片动画.希望本教程能带你带来帮助. 让我们先看看效果 ...
- 10款好用的 jQuery 图片切换效果插件
jQuery 是一个非常优秀的 Javascript 框架,使用简单灵活,同时还有许多成熟的插件可供选择.其中,最令人印象深刻的应用之一就是对图片的处理,它可以让帮助你在你的项目中加入一些让人惊叹的效 ...
- js原生带缩略图的图片切换效果
js原生带缩略图的图片切换效果 本例中用到的 moveElement(elementID,final_x,final_y,interval)是来自<JavaScript DOM编程艺术(中文第二 ...
- jquery带按钮的图片切换效果
<!doctype html> <html> <head> <meta charset="gb2312"> <title> ...
- javascript马赛克遮罩图片切换效果:XMosaic.js(转)
新鲜出炉的javascript图片切换特效,实现的是马赛克遮罩切换.在flash里,好实现遮罩动画很简单,不过JS实现起来就有些困难了. XMosaic.js,与XScroll.js和XScroll2 ...
随机推荐
- hdu 5492 Find a path（dp+少量数学）2015 ACM/ICPC Asia Regional Hefei Online
题意: 给出一个n*m的地图,要求从左上角(0, 0)走到右下角(n-1, m-1). 地图中每个格子中有一个值.然后根据这些值求出一个最小值. 这个最小值要这么求—— 这是我们从起点走到终点的路径, ...
- Delphi 注册文件类型 设置文件图标
{------------------------------------------------------------------------------- @过程名: slpert -& ...
- Linux系统上安装Python
1.下载Python安装包,官网下:http://www.python.org/getit/ http://jingyan.baidu.com/article/eae07827f7f2d01fec54 ...
- IOS中UIScrollView的详细使用
UIScrollView 是可以滚动的View 要想让UIScrollView可以滚动,必须设置UIScrollView的contentSize contentSize : 表示UIScrollVie ...
- R 环境内存限制的更改
由于R语言非常消耗内存,所以做较大数据的处理时需要增加内存空间,有以下种方式: 一. 在未开启R之前,在cmd中,输入下面指令 r −−max−mem− s i z e =4Gb 二. 在开启R之后, ...
- Request、Request.Form、Request.QueryString 用法的区别
Request.Form:获取以POST方式提交的数据. Request.QueryString:获取地址栏参数(以GET方式提交的数据). Request:包含以上两种方式(优先获取GET方式提交的 ...
- Chapter9：顺序容器
现代C++程序应该使用标准库容器,而不是更原始的数据结构,例如内置数组. 新标准库容器的性能几乎肯定与最精心优化过的同类数据结构一样好. 当我们用一个对象来初始化容器时,或将一个对象插入到容器中时,实 ...
- Eralng 小知识点
文件属性 提取方法:Module:module_info/1 头文件 包含头文件 -include(FileName). %% FileName为绝对路径或相对路径 引入库中包含文件 -include ...
- 深入理解PHP Opcode缓存原理
什么是opcode缓存? 当解释器完成对脚本代码的分析后,便将它们生成可以直接运行的中间代码,也称为操作码(Operate Code,opcode).Opcode cache的目地是避免重复编译,减少 ...
- js 控制 table style css
var table = objj.getElementsByTagName('table'); alert(table[i].width); if(table==null) return; for(v ...