SlideShare a Scribd company logo

Xaml Tutorial By Allan

•Download as PPT, PDF•
•
Cat Chen
Cat Chen
Technology
1 of 38
XAML 基础 Allan Li
主要内容 ,[object Object],[object Object],[object Object],[object Object]
XAML 简介
XAML = e X tensible A pplication M arkup L anguage 可扩展应用程序标记语言
XAML 最主要的作用 Designer Developer
使用 XAML 绘制图形和界面
XAML 示例 ,[object Object],<Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; Fill=“White&quot; /> <Ellipse Width=&quot;200&quot; Height=&quot;150&quot; Stroke=&quot;Orange&quot; /> </Canvas>
XAML : 由 Tags 构建而成 可以直接使用 Tags 进行图形的绘制 Tags 表现为单独元素 (Rectangle…) 或容器类元素 (Canvas…) XAML 的 tags 中 , 除了描述图形 , 也有其它功能性 tags (Storyboard/Trigger…)
XAML 基础标签 Canvas 画布 Brushes 笔刷 基础图形 :Rectangle,Ellipse,Line,Polygon,etc. TextBlock 文本框 Image 图像 Layout Color Shape Content Media
Canvas (1) ,[object Object],<Canvas Width=&quot;250&quot; Height=&quot;200&quot; Background=&quot;#FF747474&quot;> <Rectangle Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;Black&quot; /> </Canvas> ,[object Object],[object Object],The Canvas The Rectangle
Canvas (2) <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;Black&quot; /> <Ellipse Width=&quot;200&quot; Height=&quot;150&quot; Stroke=&quot;Orange&quot; /> </Canvas> ,[object Object]
Canvas (3) ,[object Object],<Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot; Background=&quot;LightGray&quot;> <Rectangle Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;Black&quot; /> <Canvas Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;150&quot; Height=&quot;100&quot; Background=&quot;Orange&quot;> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;150&quot; Height=&quot;75&quot; Fill=&quot;Red&quot; /> </Canvas> </Canvas>
图形 (Shape) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Brushes ( 1 ) 用于声明对象的 填充 / 描边方式 对于 形 来说 , 可以设定其填充方式 对于 线 来说 , 可以设定其描边方式 Brushes 支持 单色填充 (Solid) , 渐变填充 , 及 图像填充
Brushes ( 2 ) ,[object Object],[object Object],[object Object],<Rectangle Width=&quot;200&quot; Height=&quot;150&quot; > <Rectangle.Fill> <SolidColorBrush Color=&quot;Black&quot; /> </Rectangle.Fill> </Rectangle> <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;Black&quot; /> <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;#FFFFFF&quot; />
Brushes ( 3 ) ,[object Object],[object Object],[object Object],<Rectangle Width=&quot;200&quot; Height=&quot;150&quot; > <Rectangle.Fill> <LinearGradientBrush StartPoint=&quot;0,0&quot; EndPoint=&quot;1,1&quot;> <LinearGradientBrush.GradientStops> <GradientStop Color=&quot;Red&quot; Offset=&quot;0&quot; /> <GradientStop Color=&quot;Black&quot; Offset=&quot;1&quot; /> </LinearGradientBrush.GradientStops> </LinearGradientBrush> </Rectangle.Fill> </Rectangle>
Brushes ( 4 ) <RadialGradientBrush /> 与线性渐变语法一致 <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; > <Rectangle.Fill> <RadialGradientBrush> <RadialGradientBrush.GradientStops> <GradientStop Color=&quot;Red&quot; Offset=&quot;0&quot; /> <GradientStop Color=&quot;Black&quot; Offset=&quot;1&quot; /> </RadialGradientBrush.GradientStops> </RadialGradientBrush> </Rectangle.Fill> </Rectangle>
Brushes ( 5 ) <ImageBrush /> <Ellipse Width=&quot;200&quot; Height=&quot;75&quot; > <Ellipse.Fill> <ImageBrush ImageSource=&quot;Assets/members.jpg&quot; /> </Ellipse.Fill> </Ellipse>
使用文本 <TextBlock /> <TextBlock>Hello</TextBlock> Hello <TextBlock FontSize=&quot;18&quot;>Hello</TextBlock> Hello <TextBlock FontFamily=&quot;Courier New&quot;>Hello</TextBlock> Hello <TextBlock TextWrapping=&quot;Wrap&quot; Width=&quot;100&quot;> Hello there, how are you? </TextBlock> Hello there, how are you? <TextBlock> Hello there,<LineBreak/>how are you? </TextBlock> Hello there, how are you?
使用图像 <Image /> 与图像填充的显示方式类似 , 但显示完整矩形图像 <Image Width=“200” Source=“Assets/Grass.jpg&quot; />
使用 XAML 进行 图形变换
图形变换 对对象实施图形变换效果 , 包括变形 , 旋转等 <Rectangle Width=&quot;200&quot; Height=&quot;100&quot; Fill=“Red&quot;> <Rectangle.RenderTransform> <RotateTransform CenterX=&quot;25&quot; CenterY=&quot;100&quot; Angle=&quot;45&quot; /> </Rectangle.RenderTransform> </Rectangle>
图形变换 (2) 可以成组进行图形变换 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.RenderTransform> <RotateTransform Angle=&quot;-45&quot; CenterX=&quot;50&quot; CenterY=&quot;50&quot;/> </Canvas.RenderTransform> <Ellipse Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;65&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Line X1=&quot;25&quot; Y1=&quot;75&quot; X2=&quot;75&quot; Y2=&quot;75&quot; Stroke=&quot;Black&quot; /> </Canvas>
图形变换 (3) 图形变换类型 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
图形变换 (4) <TransformGroup /> 成组多个变换方式 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.RenderTransform> <TransformGroup> <RotateTransform Angle=&quot;-45&quot; CenterX=&quot;50&quot; CenterY=&quot;50&quot;/> <ScaleTransform ScaleX=&quot;1.5&quot; ScaleY=&quot;2&quot; /> </TransformGroup> </Canvas.RenderTransform> <Ellipse Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;65&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> </Canvas>
嵌入媒体 <MediaElement /> 用于显示视频或音频 , 不需要其它控件 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <MediaElement Source=“Assets/silverlight.wmv&quot; /> </Canvas>
使用 XAML 创建动画
使用 XAML 制作动画 可以通过 XAML 语言创建复杂的动画方式 动画本身基于 XAML 动画播放的事件触发器基于 XAML
使用 XAML 制作动画 – 示例 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.Triggers> <EventTrigger RoutedEvent=&quot;Canvas.Loaded&quot;> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName=&quot;theCircle&quot; Storyboard.TargetProperty=&quot;Width&quot; From=&quot;200&quot; To=&quot;1&quot; Duration=&quot;0:0:2&quot; AutoReverse=&quot;True&quot;/> </Storyboard> </BeginStoryboard> </EventTrigger> </Canvas.Triggers> <Ellipse x:Name=&quot;theCircle&quot; Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> </Canvas>
Triggers( 触发器 ) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Storyboard( 故事板 ) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
动画类型 ,[object Object],[object Object],<DoubleAnimation Storyboard.TargetName=&quot;theCircle&quot; Storyboard.TargetProperty=&quot;Width&quot; From=&quot;200&quot; To=&quot;1&quot; Duration=&quot;0:0:2&quot; AutoReverse=&quot;True&quot;/>
动画类型 (2) ,[object Object],[object Object],... <ColorAnimation Storyboard.TargetName=&quot;circleBrush&quot; Storyboard.TargetProperty=&quot;Color&quot; From=“Yellow&quot; To=&quot;LightGray&quot; Duration=&quot;0:0:2&quot; /> ... <Ellipse x:Name=&quot;theCircle&quot; Width=&quot;100&quot; Height=&quot;100&quot;> <Ellipse.Fill> <SolidColorBrush x:Name=&quot;circleBrush&quot; Color=&quot;Yellow&quot; /> </Ellipse.Fill> </Ellipse>
动画类型 (3) ,[object Object],[object Object],... <PointAnimation Storyboard.TargetName=&quot;myBrush&quot; Storyboard.TargetProperty=&quot;StartPoint&quot; From=&quot;0,0&quot; To=&quot;1,1&quot; Duration=&quot;0:0:2&quot; AutoReverse=&quot;True&quot; /> ... <LinearGradientBrush x:Name=&quot;myBrush&quot; StartPoint=&quot;0,0&quot; EndPoint=&quot;1,1&quot;> <LinearGradientBrush.GradientStops> ... </LinearGradientBrush.GradientStops> </LinearGradientBrush> ...
关键帧动画 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
关键帧类型 ,[object Object],[object Object],[object Object]
关键帧类型 (Demo) ... <DoubleAnimationUsingKeyFrames Storyboard.TargetName=&quot;theCircle&quot; Storyboard.TargetProperty=&quot;Width&quot;> <DoubleAnimationUsingKeyFrames.KeyFrames> <SplineDoubleKeyFrame Value=&quot;10&quot; KeyTime=&quot;0:0:1&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> <SplineDoubleKeyFrame Value=&quot;50&quot; KeyTime=&quot;0:0:2&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> <SplineDoubleKeyFrame Value=&quot;150&quot; KeyTime=&quot;0:0:4&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> </DoubleAnimationUsingKeyFrames.KeyFrames> </DoubleAnimationUsingKeyFrames>...
[object Object],[object Object]

Recommended

JavaScript Patterns
JavaScript PatternsJavaScript Patterns
JavaScript PatternsCat Chen
 
D2分享：让前端开发更高效
D2分享：让前端开发更高效D2分享：让前端开发更高效
D2分享：让前端开发更高效Berg Ray
 
Baidu Map API Introduction
Baidu Map API IntroductionBaidu Map API Introduction
Baidu Map API IntroductionCat Chen
 
Baidu前端交流会－百度基础平台分享
Baidu前端交流会－百度基础平台分享Baidu前端交流会－百度基础平台分享
Baidu前端交流会－百度基础平台分享Berg Ray
 
Where to meet pretties
Where to meet prettiesWhere to meet pretties
Where to meet prettiesCat Chen
 
知道你为什么找不到好工作吗？
知道你为什么找不到好工作吗？知道你为什么找不到好工作吗？
知道你为什么找不到好工作吗？Cat Chen
 
浏览器渲染与web前端开发
浏览器渲染与web前端开发浏览器渲染与web前端开发
浏览器渲染与web前端开发Duoyi Wu
 
高工的个人发展规划
高工的个人发展规划高工的个人发展规划
高工的个人发展规划Duoyi Wu
 

Recommended

JavaScript Patterns
JavaScript PatternsJavaScript Patterns
JavaScript PatternsCat Chen
 
D2分享：让前端开发更高效
D2分享：让前端开发更高效D2分享：让前端开发更高效
D2分享：让前端开发更高效Berg Ray
 
Baidu Map API Introduction
Baidu Map API IntroductionBaidu Map API Introduction
Baidu Map API IntroductionCat Chen
 
Baidu前端交流会－百度基础平台分享
Baidu前端交流会－百度基础平台分享Baidu前端交流会－百度基础平台分享
Baidu前端交流会－百度基础平台分享Berg Ray
 
Where to meet pretties
Where to meet prettiesWhere to meet pretties
Where to meet prettiesCat Chen
 
知道你为什么找不到好工作吗？
知道你为什么找不到好工作吗？知道你为什么找不到好工作吗？
知道你为什么找不到好工作吗？Cat Chen
 
浏览器渲染与web前端开发
浏览器渲染与web前端开发浏览器渲染与web前端开发
浏览器渲染与web前端开发Duoyi Wu
 
高工的个人发展规划
高工的个人发展规划高工的个人发展规划
高工的个人发展规划Duoyi Wu
 
读书文化Div入门培训
读书文化Div入门培训读书文化Div入门培训
读书文化Div入门培训Steven Lin
 
Drag And Drop
Drag And DropDrag And Drop
Drag And DropGaspard Lu
 
Drag And Drop
Drag And DropDrag And Drop
Drag And DropGaspard Lu
 
Vim get start_1.0
Vim get start_1.0Vim get start_1.0
Vim get start_1.0longhao
 
Cms and HTML
Cms and HTMLCms and HTML
Cms and HTMLzaiyou
 
Cms and Html
Cms and HtmlCms and Html
Cms and Htmlzaiyou
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)François Jourde
 
Javascript Training
Javascript TrainingJavascript Training
Javascript Trainingbeijing.josh
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)François Jourde
 

More Related Content

Similar to Xaml Tutorial By Allan

读书文化Div入门培训
读书文化Div入门培训读书文化Div入门培训
读书文化Div入门培训Steven Lin
 
Vim get start_1.0
Vim get start_1.0Vim get start_1.0
Vim get start_1.0longhao
 
Cms and HTML
Cms and HTMLCms and HTML
Cms and HTMLzaiyou
 
Cms and Html
Cms and HtmlCms and Html
Cms and Htmlzaiyou
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)François Jourde
 
Javascript Training
Javascript TrainingJavascript Training
Javascript Trainingbeijing.josh
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)François Jourde
 

Similar to Xaml Tutorial By Allan (9)

读书文化Div入门培训
读书文化Div入门培训读书文化Div入门培训
读书文化Div入门培训
 
Drag And Drop
Drag And DropDrag And Drop
Drag And Drop
 
Drag And Drop
Drag And DropDrag And Drop
Drag And Drop
 
Vim get start_1.0
Vim get start_1.0Vim get start_1.0
Vim get start_1.0
 
Cms and HTML
Cms and HTMLCms and HTML
Cms and HTML
 
Cms and Html
Cms and HtmlCms and Html
Cms and Html
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)
 
Javascript Training
Javascript TrainingJavascript Training
Javascript Training
 
Echanges (cours de philosophie)
Echanges (cours de philosophie)Echanges (cours de philosophie)
Echanges (cours de philosophie)
 

Xaml Tutorial By Allan

  • 2.
  • 4. XAML = e X tensible A pplication M arkup L anguage 可扩展应用程序标记语言
  • 5. XAML 最主要的作用 Designer Developer
  • 7.
  • 8. XAML : 由 Tags 构建而成 可以直接使用 Tags 进行图形的绘制 Tags 表现为单独元素 (Rectangle…) 或容器类元素 (Canvas…) XAML 的 tags 中 , 除了描述图形 , 也有其它功能性 tags (Storyboard/Trigger…)
  • 9. XAML 基础标签 Canvas 画布 Brushes 笔刷 基础图形 :Rectangle,Ellipse,Line,Polygon,etc. TextBlock 文本框 Image 图像 Layout Color Shape Content Media
  • 10.
  • 11.
  • 12.
  • 13.
  • 14. Brushes ( 1 ) 用于声明对象的 填充 / 描边方式 对于 形 来说 , 可以设定其填充方式 对于 线 来说 , 可以设定其描边方式 Brushes 支持 单色填充 (Solid) , 渐变填充 , 及 图像填充
  • 15.
  • 16.
  • 17. Brushes ( 4 ) <RadialGradientBrush /> 与线性渐变语法一致 <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; > <Rectangle.Fill> <RadialGradientBrush> <RadialGradientBrush.GradientStops> <GradientStop Color=&quot;Red&quot; Offset=&quot;0&quot; /> <GradientStop Color=&quot;Black&quot; Offset=&quot;1&quot; /> </RadialGradientBrush.GradientStops> </RadialGradientBrush> </Rectangle.Fill> </Rectangle>
  • 18. Brushes ( 5 ) <ImageBrush /> <Ellipse Width=&quot;200&quot; Height=&quot;75&quot; > <Ellipse.Fill> <ImageBrush ImageSource=&quot;Assets/members.jpg&quot; /> </Ellipse.Fill> </Ellipse>
  • 19. 使用文本 <TextBlock /> <TextBlock>Hello</TextBlock> Hello <TextBlock FontSize=&quot;18&quot;>Hello</TextBlock> Hello <TextBlock FontFamily=&quot;Courier New&quot;>Hello</TextBlock> Hello <TextBlock TextWrapping=&quot;Wrap&quot; Width=&quot;100&quot;> Hello there, how are you? </TextBlock> Hello there, how are you? <TextBlock> Hello there,<LineBreak/>how are you? </TextBlock> Hello there, how are you?
  • 20. 使用图像 <Image /> 与图像填充的显示方式类似 , 但显示完整矩形图像 <Image Width=“200” Source=“Assets/Grass.jpg&quot; />
  • 21. 使用 XAML 进行 图形变换
  • 22. 图形变换 对对象实施图形变换效果 , 包括变形 , 旋转等 <Rectangle Width=&quot;200&quot; Height=&quot;100&quot; Fill=“Red&quot;> <Rectangle.RenderTransform> <RotateTransform CenterX=&quot;25&quot; CenterY=&quot;100&quot; Angle=&quot;45&quot; /> </Rectangle.RenderTransform> </Rectangle>
  • 23. 图形变换 (2) 可以成组进行图形变换 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.RenderTransform> <RotateTransform Angle=&quot;-45&quot; CenterX=&quot;50&quot; CenterY=&quot;50&quot;/> </Canvas.RenderTransform> <Ellipse Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;65&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Line X1=&quot;25&quot; Y1=&quot;75&quot; X2=&quot;75&quot; Y2=&quot;75&quot; Stroke=&quot;Black&quot; /> </Canvas>
  • 24.
  • 25. 图形变换 (4) <TransformGroup /> 成组多个变换方式 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.RenderTransform> <TransformGroup> <RotateTransform Angle=&quot;-45&quot; CenterX=&quot;50&quot; CenterY=&quot;50&quot;/> <ScaleTransform ScaleX=&quot;1.5&quot; ScaleY=&quot;2&quot; /> </TransformGroup> </Canvas.RenderTransform> <Ellipse Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;25&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> <Ellipse Canvas.Top=&quot;25&quot; Canvas.Left=&quot;65&quot; Width=&quot;10&quot; Height=&quot;10&quot; Fill=&quot;Black&quot; /> </Canvas>
  • 26. 嵌入媒体 <MediaElement /> 用于显示视频或音频 , 不需要其它控件 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <MediaElement Source=“Assets/silverlight.wmv&quot; /> </Canvas>
  • 28. 使用 XAML 制作动画 可以通过 XAML 语言创建复杂的动画方式 动画本身基于 XAML 动画播放的事件触发器基于 XAML
  • 29. 使用 XAML 制作动画 – 示例 <Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Canvas.Triggers> <EventTrigger RoutedEvent=&quot;Canvas.Loaded&quot;> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName=&quot;theCircle&quot; Storyboard.TargetProperty=&quot;Width&quot; From=&quot;200&quot; To=&quot;1&quot; Duration=&quot;0:0:2&quot; AutoReverse=&quot;True&quot;/> </Storyboard> </BeginStoryboard> </EventTrigger> </Canvas.Triggers> <Ellipse x:Name=&quot;theCircle&quot; Width=&quot;100&quot; Height=&quot;100&quot; Fill=&quot;Yellow&quot; /> </Canvas>
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37. 关键帧类型 (Demo) ... <DoubleAnimationUsingKeyFrames Storyboard.TargetName=&quot;theCircle&quot; Storyboard.TargetProperty=&quot;Width&quot;> <DoubleAnimationUsingKeyFrames.KeyFrames> <SplineDoubleKeyFrame Value=&quot;10&quot; KeyTime=&quot;0:0:1&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> <SplineDoubleKeyFrame Value=&quot;50&quot; KeyTime=&quot;0:0:2&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> <SplineDoubleKeyFrame Value=&quot;150&quot; KeyTime=&quot;0:0:4&quot; KeySpline=&quot;0.5,0,0.5,0.5&quot; /> </DoubleAnimationUsingKeyFrames.KeyFrames> </DoubleAnimationUsingKeyFrames>...
  • 38.