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

由此可知



Hidden为隐藏项目,但也保留项目的配置空间



而Collapsed为隐藏项目,但因为没有保留项目的配置空间,所以会使得绿色区块位置改变











MSDN提到:



Visibility 值为 Collapsed 的项目不会占用任何配置空间。



(MSDN对Visibility的介绍原文)







配置空间指的是项目存在画面上的位置



所以就算是该项目使用Collapsed,项目不会占用任何配置空间



但是与是否会耗损资源并没有任何的绝对关系!!!!





就算不存在画面上,检查Xaml时,会发现已设定为Collapsed的项目还是存在的

?

很多时候,当设计版面或是动画的需要利用Appearance的Visibility来达到效果

本篇就是要跟大家介绍Visibility的三种配置效果

?

我们开始吧!

?

01

跟之前不一样的是,这次我们要开启的新专案需使用WPF Application

为什麽?看下去就知道!

?

New Project->选取WPF Application->命名後按下OK

?

现在就先来说明为甚麽要使用WPF专案

如下图

左边是Silverlight专案下的Visibility,只有Visible与Collapsed两种

右边是WPF专案下的Visibility,有Visible、Hidden与Collapsed三种

?

为了要比较这三种设定的明显不同,所以本篇我们使用WPF专案

?

?

02

专案开启後,在主要工作区放入一个StackPanel

?

接着在StackPanel里置入四个Rectangle

?

?

为了方便对照,请复制整个StackPanel,放置於画面上对称的位置

?

?

03

我们开始设定Visible、Hidden与Collapsed吧!

粉红色与绿色我们不动它,使之保持预设值Visible

?

选取蓝色的Rectangle,设定为Hidden

?

设定为Hidden的蓝色Rectangle已经消失了

但是其它颜色的Rectangle并没有因为蓝色Rectangle的设定有任何的改变

?

?

04

再来,选取黄色Rectangle,设定为Collapsed

?

?

设定为Collapsed的黄色Rectangle已经消失了

并且因为黄色Rectangle的设定,使得其他颜色的Rectangle位子也因此有所改变

?

?

05

请看下图的整理的差异分析

?

由此可知

Hidden为隐藏项目,但也保留项目的配置空间

而Collapsed为隐藏项目,但因为没有保留项目的配置空间,所以会使得绿色区块位置改变

?

?

MSDN提到:

Visibility 值为 Collapsed 的项目不会占用任何配置空间。

(MSDN对Visibility的介绍原文)

?

配置空间指的是项目存在画面上的位置

所以就算是该项目使用Collapsed,项目不会占用任何配置空间

但是与是否会耗损资源并没有任何的绝对关系!!!!

?

就算不存在画面上,检查Xaml时,会发现已设定为Collapsed的项目还是存在的

   1: <StackPanel x:Name="SettingStakPnl" Margin="20" Background="#FF444444" Grid.Column="1">

   2:     <Rectangle x:Name="PinkBox1" Fill="#FFFF00A4" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0"/>

   3:     <Rectangle x:Name="BlueBox1" Fill="#FF0004FF" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0" Visibility="Hidden"/>

   4:     <Rectangle x:Name="YellowBox1" Fill="#FFFFF500" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0" Visibility="Collapsed"/>

   5:     <Rectangle x:Name="GreenBox1" Fill="#FF00E403" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0"/>

   6: </StackPanel>

?

?

?

?

?

以上对Visibility的介绍,希望能达到初学者对正确观念的厘清唷!

?

?

?

?

?

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

一步一步迈向HIE之路

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

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

 

零元学Expression Blend 4 - Chapter 39 虾米?!同款?不同师傅!告诉你Visible、Hidden与Collapsed的差异!的更多相关文章

  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 38 看如何使用Clip修出想要的完美曲线(下)

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

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

    原文:零元学Expression Blend 4 - Chapter 37 看如何使用Clip修出想要的完美曲线(上) 几何外部的 UIElement 会在呈现的配置中以视觉化方式裁剪. 几何不一定要 ...

随机推荐

  1. [NPM] Pass arguments to npm scripts

    Often times you’ll have variations that you’ll want to make to your npm scripts and repeating yourse ...

  2. 二叉苹果树 - 二叉树树型DP

    传送门 中文题面: 题目描述 有一棵苹果树,如果树枝有分叉,一定是分 2 叉(就是说没有只有 1 个儿子的结点,这棵树共有N 个结点(叶子点或者树枝分叉点),编号为1-N,树根编号一定是1. 我们用一 ...

  3. Scala入门到精通——第二十七节 Scala操纵XML

    本节主要内容 XML 字面量 XML内容提取 XML对象序列化及反序列化 XML文件读取与保存 XML模式匹配 1. XML 字面量 XML是一种很重要的半结构化数据表示方式,眼下大量的应用依赖于XM ...

  4. 【t095】拯救小tim

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 小tim在游乐场,有一天终于逃了出来!但是不小心又被游乐场的工作人员发现了... 所以你的任务是安全地 ...

  5. Apparatus, system, and method for automatically minimizing real-time task latency and maximizing non-real time task throughput

    An apparatus, system, and method are provided for automatically minimizing Real-Time (RT) task laten ...

  6. Visual Studio for Mac第四预

    微软发布Visual Studio for Mac第四预览版 去年 11 月,微软发布了 Visual Studio for Mac 的首个预览版本,并且承诺后续数月会带来更多功能.而今天,随着 Vi ...

  7. 停止学习Wireshark

    下载和安装好Wireshark之后,启动Wireshark而且在接口列表中选择接口名,然后開始在此接口上抓包.比如.假设想要在无线网络上抓取流量,点击无线接口.点击Capture Options能够配 ...

  8. mysql安装出现应用程序无法正常启动(oxc000007b)的解决方案

    原文:mysql安装出现应用程序无法正常启动(oxc000007b)的解决方案 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/IUNIQUE/art ...

  9. c语言学习笔记(6)——for和while循环

    for和while等价替换 -------------------------- int i = 1; for (i; i<=100; i++){ sum = sum + 1; } ------ ...

  10. wxWindows

    用C++编写跨平台程序 中文版说明 本教程由Gxl117翻译并将继续维护,这是本教程的第一稿,假设发现错误请与我(Email:gxl117@yahoo.com.cn)联系让我能及时修正它.之后还会对这 ...