WPF/E CTP Quick Start - 第五部分:公有图形属性(翻译)

简介:
Opacity属性
   Opacity属性能够让您控制一个 UIElement对象的alpha值或者透明的程度。您可以为 Opacity设置一个0到1之间的数,该值越接近0.0,该对象就越接近完全透明,当 Opacity属性为0时,对象就完全不可见了。默认的 Opactiy属性的值为1.0,意味着对象完全不透明。下面的例子创建了两个不同透明程度的形状。
<Canvas Width="300" Height="300"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Rectangle Opacity="1.0" Height="100" Width="100" Canvas.Left="30" Canvas.Top="30"
Stroke="Black" StrokeThickness="10" Fill="SlateBlue"/>
<Rectangle Opacity="0.6" Height="100" Width="100" Canvas.Left="70" Canvas.Top="70"
Stroke="Black" StrokeThickness="10" Fill="SlateBlue" />
</Canvas>
 
OpacityMask属性
   OpacityMask属性能够让您控制一个 UIElement不同部分的alpha值。例如,您可以使用 OpacityMask使一个元素从右往左淡入或淡出。 OpacityMask属性具有一个 Brush对象,这个画刷将元素和画刷的每一个像素的alpha通道进行映射,以确定元素上对应像素的透明结果。如果画刷的某一部分是透明的,那么元素的那一部分会变得透明。
  您可以为 OpacityMask使用不同类型的画刷,不过 LinearGradientBrushRadialGradientBrushImageBrush最为常用。
  下面的示例将一个应用了 LinearGradientBrush的opacity mask作用在一个 Rectangle对象上。
<Canvas Width="300" Height="300"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Rectangle Height="100" Width="100" Canvas.Left="30" Canvas.Top="30"
Stroke="Black" StrokeThickness="10" Fill="SlateBlue">
<Rectangle.OpacityMask>
<LinearGradientBrush>
<GradientStop Offset="0.25" Color="#00000000"/>
<GradientStop Offset="1" Color="#FF000000"/>
</LinearGradientBrush>
</Rectangle.OpacityMask>
</Rectangle>
</Canvas>
 
Clip属性
   Clip属性能够使您有选择则绘制元素的一部分。使用 Clip属性时,您需要提供一个 Geometry对象用于描述绘制区域,任何超过绘制区域的部分都会被隐藏,或者说是“被修剪(clipped)”了。
  下面的示例使用了一个 RectangleGeometry作为 Ellipse元素的 Clip属性。其结果是:只有 EllipseRectangleGeometry定义的区域内的部分才被显示出来,超出 RectangleGeometry的部分则被切除了。
<Canvas Width="300" Height="300"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Ellipse Height="200" Width="200" Canvas.Left="30" Canvas.Top="30"
Stroke="Black" StrokeThickness="10" Fill="SlateBlue">
<Ellipse.Clip>
<RectangleGeometry Rect="0, 0, 100, 100"/>
</Ellipse.Clip>
</Ellipse>
</Canvas>
 
RenderTransform属性
   RenderTransform属性让您可以使用 Transform对象对一个元素进行旋转,倾斜,缩放或移动。下面的列表描述了您可以使用在 RenderTransform属性上的不同的 Transform对象
  • RotateTransform:将一个对象旋转特定的角度。
  • SkewTransform:将一个对象相对于X轴或Y轴进行倾斜
  • ScaleTransform:将一个对象在水平或垂直方向进行放大或缩小。
  • TranslateTransform:将一个对象在水平或垂直方向进行移动。 
  还有另外一种变换, TransformGroup,您可以使用它将多种变换应用在单个对象上。
  下面的示例将 Transform对象应用在 Rectangle元素上,展示了每个 Transform对象的不同效果。
<Canvas Width="300" Height="300"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Rectangle Height="100" Width="100" Canvas.Left="70" Canvas.Top="10"
Fill="Black">
<Rectangle.RenderTransform>
<RotateTransform Angle="45"/>
</Rectangle.RenderTransform>
</Rectangle>

<Rectangle Height="100" Width="100" Canvas.Left="130" Canvas.Top="10"
Fill="red">
<Rectangle.RenderTransform>
<SkewTransform AngleX="30"/>
</Rectangle.RenderTransform>
</Rectangle>

<Rectangle Height="100" Width="100" Canvas.Left="10" Canvas.Top="190"
Fill="blue">
<Rectangle.RenderTransform>
<ScaleTransform ScaleX="1.3" ScaleY=".5"/>
</Rectangle.RenderTransform>
</Rectangle>

<Rectangle Height="100" Width="100" Canvas.Left="160" Canvas.Top="130"
Fill="Green">
<Rectangle.RenderTransform>
<TransformGroup>
<RotateTransform Angle="45"/>
<ScaleTransform ScaleX=".5" ScaleY="1.2"/>
<SkewTransform AngleX="30"/>
</TransformGroup>
</Rectangle.RenderTransform>
</Rectangle>

</Canvas>
 
下面该做什么呢?
  在下一部分“ 图像”中,您会了解 Image元素的使用方式,以及您应该如何显示位图。


本文转自 jeffz 51CTO博客,原文链接:http://blog.51cto.com/jeffz/60397,如需转载请自行联系原作者
相关文章
|
8月前
|
C# Windows
WPF技术之图形系列Polygon控件
WPF Polygon是Windows Presentation Foundation (WPF)框架中的一个标记元素,用于绘制多边形形状。它可以通过设置多个点的坐标来定义多边形的形状,可以绘制任意复杂度的多边形。
459 0
|
C# 前端开发
WPF - 图形设计器(Diagram Designer)
原文:WPF - 图形设计器(Diagram Designer)   OpenExpressApp计划中包括建模工具,计划是采用MetaEdit+模型来作为元模型,使用codeproject的《WPF Diagram Designer》一系列文章来做为设计器实现参考,本篇介绍一下codeprojcet的这四个文章,推荐给对图形设计器感兴趣的人去看看,通过WPF的模板功能和其他功能可以很方便的设计出图形编辑器。
3364 0
|
6月前
|
C#
2000条你应知的WPF小姿势 基础篇<57-62 依赖属性进阶>
2000条你应知的WPF小姿势 基础篇<57-62 依赖属性进阶>
20 0
|
6月前
|
存储 开发框架 .NET
2000条你应知的WPF小姿势 基础篇<51-56 依赖属性>
2000条你应知的WPF小姿势 基础篇<51-56 依赖属性>
22 0
|
8月前
|
C# 开发者 Windows
WPF技术之图形系列Path控件
WPF Path是Windows Presentation Foundation (WPF)框架中的一个标记元素,用于绘制复杂的几何路径形状。它可以通过设置一系列的路径命令以及相应的参数来定义形状,可以绘制任意复杂度的路径。
619 0
|
8月前
|
C# Windows
WPF技术之图形系列Line控件
WPF Line是Windows Presentation Foundation (WPF)中的一个图形控件,用于在界面上绘制线条。它可以用来表示直线、分割线、边框等,提供了一种简单但有力的方式来显示和布局线条。
884 0
|
8月前
|
前端开发 C# Windows
WPF技术之图形系列Rectangle控件
WPF Rectangle是Windows Presentation Foundation (WPF)中的一个图形控件,用于在界面上绘制矩形。它是一个非常常见的UI元素,可用于显示、布局和交互。
614 0
|
8月前
|
数据可视化 前端开发 C#
WPF技术之图形系列Ellipse控件
WPF Ellipse是Windows Presentation Foundation (WPF)中的一个图形控件,它用于绘制椭圆形状。在WPF中,Ellipse可以用于创建具有椭圆形状的可视化效果,可以设置其位置、大小、填充颜色等属性。
771 0
|
9月前
|
C#
WPF属性---重复样式和触发器
WPF属性---重复样式和触发器
70 0
WPF项目中不支持 ResizingPanel,未在类型“ResizingPanel”中找到可附加的属性“ResizeWidth”
WPF项目中不支持 ResizingPanel,未在类型“ResizingPanel”中找到可附加的属性“ResizeWidth”