首页 技术 正文
技术 2022年11月15日
0 收藏 467 点赞 3,873 浏览 1901 个字

原文:零元学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之路

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

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

 

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,492
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,907
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,740
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,493
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:8,132
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:5,295