分享给朋友：通用代码: <input id="link4" type="text" class="form_input form_input_s" value="" />复 制flash地址: 复 制html代码: <input type="text" class="form_input form_input_s" id="link3" value="" />复 制分享视频到站外获取收益&&手机扫码分享视频二维码2小时内有效AR模型内容制作：Blend3D软件下载至电脑扫码用手机看用或微信扫码在手机上继续观看二维码2小时内有效AR模型内容制作：Blend3D软件扫码用手机继续看用或微信扫码在手机上继续观看二维码2小时内有效，扫码后可分享给好友没有优酷APP？立即下载请根据您的设备选择下载版本
药品服务许可证(京)-经营- 节目制作经营许可证京字670号 请使用者仔细阅读优酷、、Copyright(C)2017 优酷
版权所有不良信息举报电话:2588人阅读
Silverlight（12）
&&&&& 今天我们先实现一个3D的主场景远处的背景随机抖动如图:
&&&&& 1、素材准备(远景图片、飞机图，树图)：
&&&&& 2、打开blend设计工具先将UserControl根容器面板改为Canvas以方便我们布局和动画制作;
&&&&& 3、在blend中绘制一个矩形并将矩形转换为Path应用由远及近渐变色（注意图片中的红色框选区域）:
&&&&& 4、导入远景图片并应用渐变滤镜(OpacityMask)参考如图：
&&&&& 5、创建一个背景抖动变换的动画（可在BLEND中设计动画），为了简单我在VS中写了一个如：
&&& &Storyboard x:Name=&farBgAnimation& &
&DoubleAnimation
BeginTime=&00:00:00& Duration=&00:00:00.5000000& To=&6& Storyboard.TargetName=&image& Storyboard.TargetProperty=&(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)& /&
&/Storyboard&
&&&&& 6、在页面Page_Load事件中播放动画并注册动画播放完成事件动态修改动画RotateTransform.Angle属性以更随机一些如：
& &&&&Storyboard x:Name=&farBgAnimation& &
&DoubleAnimation
BeginTime=&00:00:00& Duration=&00:00:00.5000000& To=&6& Storyboard.TargetName=&image& Storyboard.TargetProperty=&(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)& /&
&/Storyboard&
完整XAML代码：
&UserControl
xmlns=&/winfx/2006/xaml/presentation&
xmlns:x=&/winfx/2006/xaml&
xmlns:d=&/expression/blend/2008& xmlns:mc=&http://schemas.openxmlformats.org/markup-compatibility/2006&
mc:Ignorable=&d& xmlns:CityFly_UControl=&clr-namespace:CityFly.UControl& x:Class=&CityFly.MainPage&
d:DesignWidth=&600& d:DesignHeight=&600&&
&UserControl.Resources&
&Storyboard x:Name=&farBgAnimation& &
&DoubleAnimation
BeginTime=&00:00:00& Duration=&00:00:00.5000000& To=&6& Storyboard.TargetName=&image& Storyboard.TargetProperty=&(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)& /&
&/Storyboard&
&/UserControl.Resources&
&Canvas x:Name=&LayoutRoot&&
&Path Stretch=&Fill& Stroke=&{x:Null}& Height=&600& Width=&800& Canvas.Left=&-108& Data=&M0,0 L800,0 L800,600 L0,600 z&&
&Path.Fill&
&LinearGradientBrush EndPoint=&0.5,1& StartPoint=&0.5,0&&
&GradientStop Color=&#0C4E747A& Offset=&0.152&/&
&GradientStop Color=&#FF13525B& Offset=&1&/&
&/LinearGradientBrush&
&/Path.Fill&
&Image x:Name=&image& Height=&348& Width=&1452&
Source=&Image/head.png& Stretch=&Fill& RenderTransformOrigin=&0.5,0.5& Canvas.Left=&-428& Canvas.Top=&-46&&
&Image.OpacityMask&
&LinearGradientBrush EndPoint=&0.5,1& StartPoint=&0.5,0&&
&GradientStop Color=&Black& Offset=&0&/&
&GradientStop Color=&Transparent& Offset=&1&/&
&GradientStop Color=&#A35B5B5B& Offset=&0.796&/&
&GradientStop Color=&#FF2E2E2E& Offset=&0.563&/&
&/LinearGradientBrush&
&/Image.OpacityMask&
&Image.RenderTransform&
&TransformGroup&
&ScaleTransform/&
&SkewTransform/&
&RotateTransform Angle=&0&/&
&TranslateTransform/&
&/TransformGroup&
&/Image.RenderTransform&
&/UserControl&
完整CS代码：
using System.Collections.G
using System.L
using System.N
using System.W
using System.Windows.C
using System.Windows.D
using System.Windows.I
using System.Windows.M
using System.Windows.Media.A
using System.Windows.S
using CityFly.M
using CityFly.UC
using System.Windows.T
namespace CityFly
public partial class MainPage : UserControl
public MainPage()
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
void MainPage_Loaded(object sender, RoutedEventArgs e)
rand = new Random(DateTime.Now.Millisecond);
farBgAnimation.Begin();
pleted += new EventHandler(ManBgAnimation_Completed);
//动态修改远景抖动
void ManBgAnimation_Completed(object sender, EventArgs e)
(farBgAnimation.Children[0] as DoubleAnimation).To = rand.Next(-2, 2);
farBgAnimation.Begin();
下一节我们将使用一个自定义控件实现3D变换（飞机飞出，树木飞入）
&&相关文章推荐
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：156196次
积分：2088
积分：2088
排名：第16774名
原创：37篇
评论：258条
(1)(2)(3)(1)(2)(3)(1)(3)(4)(9)(2)(3)(3)}