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

本文通过实例详细解析了WPF应用程序中Visibility属性的三种状态：Visible、Hidden与Collapsed的区别。并通过具体步骤展示了它们对布局的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

由此可知

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

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

MSDN提到：

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

(MSDN对Visibility的介绍原文)

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

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

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

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

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

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

我们开始吧!

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

为什麽?看下去就知道!

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

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

如下图

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

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

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

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

接着在StackPanel里置入四个Rectangle

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

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

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

选取蓝色的Rectangle，设定为Hidden

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

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

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

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

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

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

由此可知

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

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

MSDN提到：

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

(MSDN对Visibility的介绍原文)

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

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

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

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

 
<StackPanel x:Name="SettingStakPnl" Margin="20" Background="#FF444444" Grid.Column="1"> 
    
    <Rectangle x:Name="PinkBox1" Fill="#FFFF00A4" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0"/> 
    
    <Rectangle x:Name="BlueBox1" Fill="#FF0004FF" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0" Visibility="Hidden"/> 
    
    <Rectangle x:Name="YellowBox1" Fill="#FFFFF500" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0" Visibility="Collapsed"/> 
    
    <Rectangle x:Name="GreenBox1" Fill="#FF00E403" Height="75" Width="150" Margin="5,6,5,1" StrokeThickness="0"/> 
    
</StackPanel>