原文:零元学Expression Blend 4 - Chapter 34 啊~!!我不要毛毛的感觉!-使用布局修整「UseLayoutRounding」

本章将介绍UseLayoutRounding,中文我把它翻译为「布局修整」



英文原文为:Gets or sets a value that determines whether to use rounding behavior that aligns layout to whole pixels.

?

本章将介绍UseLayoutRounding,中文我把它翻译为「布局修整」

?

根据MSDN对UseLayoutRounding的介绍

UseLayoutRounding:为取得或设定值,这个值决定是否要使用将配置对齐整数像素的进位行为

?

我查了一下英文原文为:

Gets or sets a value that determines whether to use rounding behavior that aligns layout to whole pixels.

?

我想,应该还有更好的表达方式

让我来带大家看看何谓UseLayoutRounding吧!

?

就是要让不会的新手都看的懂!

?

01

请在专案的工作区中放入两个Rectangle

宽高皆设定为:100.7

按下进阶箭头,你可以在延伸的功能中找到UseLayoutRounding

如下图:

?

请设定一个Rectangle勾选UseLayoutRounding,另一个Rectangle则不勾选

你也可以直接复制下面的Xaml

   1: <Grid x:Name="LayoutRoot" Background="White">

   2:? 


   3: <Grid.ColumnDefinitions>


   4:? 


   5: <ColumnDefinition Width="0.5*"/>


   6:? 


   7: <ColumnDefinition Width="0.5*"/>


   8:? 


   9: </Grid.ColumnDefinitions>


  10:? 


  11: <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Center" Margin="0" Stroke="Black" Width="100.7" Height="100.7" VerticalAlignment="Center" StrokeThickness="10"/>


  12:? 


  13: <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Center" Margin="0" Stroke="Black" Width="100.7" UseLayoutRounding="False" Height="100.7" Grid.Column="1" VerticalAlignment="Center" StrokeThickness="10"/>


  14:? 


  15: </Grid>


?

请把工作区的大小倍数拉大,或是仔细看

发现不一样的地方了吗?

?

左边的Rectangle边框是清楚的,但右边的边框有点模糊

看右边的Rectangle时会感觉好像是眼睛度数不够一样,物件边框会雾化,不够精细

?

这就是UseLayoutRounding设定值的差异

UseLayoutRounding可以改善边框锯齿状与雾化的状态,取而代之的是明亮乾净的画面

?

我将画面截下来使用绘图软体放大到300倍以上

差异就很明显了

下图是右边未使用UseLayoutRoundin的左上角

?

右边没有使用UseLayoutRounding的Rectangle周围出现了灰色的线条

但左边有使用UseLayoutRounding的Rectangle周围却是很平整的

?

有的布局会用切Grid或百分比的方式来切割版面(Grid的介绍请看这里)

假如说切三等分,那每一等份就是0.33333333,不会是一个整数

?

所以在里面的物件大小也就不会是整数,画出来就会有毛毛的感觉

有使用UseLayoutRounding的话,绘图引擎会强制把它用整数画出来

看起来就不会毛毛的

?

但另一个布局容器Canvas里面的物件就不会被影响到,因为Canvas不会影响布局

想了解更多Canvas请到这里

?

UseLayoutRounding是个很容易被忽略的设定项目

但若能注意到很小的设定,会对你Silverlight的制作加分喔!

?

?

本篇的教学就到此。

?

?

?

(若有任何错误的地方,请各位前辈或同好能不吝指教,小女子都会虚心接受;若是你喜欢我的教学,请给我点鼓励,谢谢。)

一步一步迈向HIE之路

喜欢我文章请推我一下或给我个回应,你的鼓励会给我无限的动力喔!

若是您有其他问题或是特别需要,请在文章回应处留言,我会尽快回覆您

 

零元学Expression Blend 4 - Chapter 34 啊~!!我不要毛毛的感觉!-使用布局修整「UseLayoutRounding」的更多相关文章

  1. 零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步

    原文:零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步 如果需要经常的使用某一项工具,总会希望能够更快速的使用各项设定达到效果 今天要介绍 ...

  2. 零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果

    原文:零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果 有网友问我如何在Blend内制作出倒影效果 我提供了 ...

  3. 零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下)

    原文:零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下) 抱歉久等了!!!! 终於到了动画MenuBar ...

  4. 零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗?

    原文:零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗? ListBox里的排列不是垂直就是水平,觉得这样的排列很枯燥乏味吗? 想要它变聪明吗? ...

  5. 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画

    原文:零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形 ...

  6. 零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中)

    原文:零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中) 我们接着进行动画MenuBar的制作 接续着上 ...

  7. 零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上)

    原文:零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上) 一直以来都有人拿Flash的动画问我Blend ...

  8. 零元学Expression Blend 4 - Chapter 39 虾米?!同款?不同师傅!告诉你Visible、Hidden与Collapsed的差异!

    原文:零元学Expression Blend 4 - Chapter 39 虾米?!同款?不同师傅!告诉你Visible.Hidden与Collapsed的差异! 由此可知 Hidden为隐藏项目,但 ...

  9. 零元学Expression Blend 4 - Chapter 38 看如何使用Clip修出想要的完美曲线(下)

    原文:零元学Expression Blend 4 - Chapter 38 看如何使用Clip修出想要的完美曲线(下) 你可以把Clip想成是一个遮罩,运用遮罩达到我们想要的效果 所以在这里我们把文字 ...

随机推荐

  1. js进阶 9 js操作表单知识点总结

    js进阶 9 js操作表单知识点总结 一.总结 一句话总结:熟记较常用的知识点,对于一些不太常用的知识点可以在使用的时候查阅相关资料,在使用和练习中去记忆. 1.表单中学到的元素的两个对象集合石什么? ...

  2. form的get与post方式的区别(转)

    form元素的method属性用来指定发送form的http方法 使用get时,form数据集被附加到form元素的action属性所指定的URL后面,仅仅是拼接一个URL,然后直接向服务区请求数据, ...

  3. 增删改查 T-SQL最基本操作

    use test --操作test表 go --查询 select * from stu -- 查询stu里的所有数据 select top 3 * from stu -- 查询stu里前三行数据 s ...

  4. 使用ant编译项目技能

    ant编译时指定jdk的版本号 系统的jdk版本号是1.6,而项目使用的jdk版本号是1.5.所以在编译时须要指定jdk的版本号为1.5,能够使用以下的方法为javac 任务指定fork和execut ...

  5. 【hdu2825】ac自动机 + 状压dp

    传送门 题目大意: 给你一些密码片段字符串,让你求长度为n,且至少包含k个不同密码片段串的字符串的数量. 题解: 因为密码串不多,可以考虑状态压缩 设dp[i][j][sta]表示长为i的字符串匹配到 ...

  6. hdu1693插头dp(多回路)

    题意:在n*m的矩阵中,有些格子有树,没有树的格子不能到达,找一条或多条回路,吃全然部的树,求有多少中方法. 这题是插头dp,刚刚学习,不是非常熟悉,研究了好几天才明确插头dp的方法,他们老是讲一些什 ...

  7. Oracle停止一个JOB

    Oracle如何停止一个JOB 相关表.视图 dba_jobs all_jobs user_jobs 包含登录用户所有的JOB信息 dba_jobs_running 包含正在运行job相关信息 注意 ...

  8. PAT 1031-1040 题解

    早期部分代码用 Java 实现.由于 PAT 虽然支持各种语言,但只有 C/C++标程来限定时间,许多题目用 Java 读入数据就已经超时,后来转投 C/C++.浏览全部代码:请戳 本文谨代表个人思路 ...

  9. WPF的逻辑树与视觉树(3)Visual呈现

    原文:WPF的逻辑树与视觉树(3)Visual呈现 这篇就点到为止,挑重点讲 绘图方式有两种 1.继承UIElement,重写OnRender方法 public partial class Windo ...

  10. sdk manager 打不开

    解决方法1: 提示 [SDK Manager] Failed to convert path to a short DOS path: C:\windows\system32\java.exe 打开t ...