原文:零元学Expression Blend 4 - Chapter 36 来玩捉迷藏吧!!!看看ScrollBar的Disabled与Hidden之差异

本次要针对Disabled以及Hidden作讨论



很多人会把Disabled当成是不显示，因为选单内容有个Visible(翻译为可见or显示)



但其实Disabled是禁用而非不显示，若是想要使之不显示，请使用Hidden作隐藏即可



我想，不显示跟隐藏的意思是雷同的，但与禁用却是相差很远，所以请不要搞混喔~



隐藏与禁用，在实务上使用起来就是有差别!!



差在哪里呢?看下去就知道

?

?

先前在Chapter10有介绍过ScrollViewer的属性以及功能

(回顾请点我)

?

其重点设定的内容为

Auto = 当内容过多时，自动显示bar

Disabled = 禁用bar

Hidden = 隐藏bar

Visible =显示bar

?

本次要针对Disabled以及Hidden作讨论

很多人会把Disabled当成是不显示，因为选单内容有个Visible(翻译为可见or显示)

但其实Disabled是禁用而非不显示，若是想要使之不显示，请使用Hidden作隐藏即可

我想，不显示跟隐藏的意思是雷同的，但与禁用却是相差很远，所以请不要搞混喔~

隐藏与禁用，在实务上使用起来就是有差别!!

差在哪里呢?看下去就知道

?

01

延续Ch10的作法，请在ScrollViewer内放入StackPanel，并在StackPanel内放入数个Button

?

完成後，请全部选取後复制出另一个ScrollViewer，好为我们等等的比较做准备

(下图为还没有设定Hidden以及Disabled属性的状态)

还没有设定Hidden以及Disabled属性的Xaml如下：

   1: <ScrollViewer x:Name="HiddenScview" Margin="0" ScrollViewer.VerticalScrollBarVisibility="Auto" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Width="250" Height="200">

   2:     <StackPanel Background="#FF525252">

   3:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF0029A9"/>

   4:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFA300F3"/>

   5:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF8F002E"/>

   6:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF086A00"/>

   7:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF786800"/>

   8:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFB16100"/>

   9:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="Red"/>

  10:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFFFBC79"/>

  11:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF521E00"/>

  12:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3"/>

  13:     </StackPanel>

  14: </ScrollViewer>

  15: <ScrollViewer x:Name="HiddenScview" Margin="0" ScrollViewer.VerticalScrollBarVisibility="Auto" Grid.Column="1"  Grid.Row="1"HorizontalAlignment="Center" VerticalAlignment="Center" Width="250" Height="200">

  16:     <StackPanel Background="#FF525252">

  17:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF0029A9"/>

  18:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFA300F3"/>

  19:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF8F002E"/>

  20:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF086A00"/>

  21:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF786800"/>

  22:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFB16100"/>

  23:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="Red"/>

  24:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFFFBC79"/>

  25:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF521E00"/>

  26:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3"/>

  27:     </StackPanel>

  28: </ScrollViewer>

  29:  

  30:

?

02

点选左边的ScrollViewer後从Properties->Layout->选择Show advanced Properties-> VerticalScrollBarVisibility

可以看到由上至下Disabled 、Auto、Hidden 以及Visible 四种设定

?

这里，请选择Hidden

?

而右边的ScrollViewer请选择Disabled

?

完成後，按下F5试试看到底哪边不一样

附上实作范例，试试看左边跟右边的差异

?

请点击左边ScrollViewer内的Button後，在ScrollViewer内卷动一下滑鼠滚轮

再点击右边ScrollViewer内的Button，也在右边的ScrollViewer内卷动一下滑鼠滚轮

?

很抱歉，阁下使用的浏览器并不支援 IFrame，不能正常浏览我的网页

?

更改为Hidden以及Disabled属性的Xaml如下：

   1: <ScrollViewer x:Name="HiddenScview" Margin="0" ScrollViewer.VerticalScrollBarVisibility="Hidden" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Width="250" Height="200">

   2:     <StackPanel Background="#FF525252">

   3:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF0029A9"/>

   4:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFA300F3"/>

   5:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF8F002E"/>

   6:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF086A00"/>

   7:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF786800"/>

   8:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFB16100"/>

   9:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="Red"/>

  10:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFFFBC79"/>

  11:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF521E00"/>

  12:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3"/>

  13:     </StackPanel>

  14: </ScrollViewer>

  15: <ScrollViewer x:Name="DisableScview" Margin="0" ScrollViewer.VerticalScrollBarVisibility="Disabled" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Width="250" Height="200">

  16:     <StackPanel Background="#FF525252">

  17:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF0029A9"/>

  18:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFA300F3"/>

  19:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF8F002E"/>

  20:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF086A00"/>

  21:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FF786800"/>

  22:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="#FFB16100"/>

  23:         <Button Content="请点按钮一下再滚动滑鼠" Margin="5,3" Foreground="Red"/>

  24:         <Button Content="Button" Margin="5,3" Foreground="#FFFFBC79"/>

  25:         <Button Content="Button" Margin="5,3"/>

  26:         <Button Content="Button" Margin="5,3"/>

  27:     </StackPanel>

  28: </ScrollViewer

?

由此可知

虽然看不见ScrollBar，不过设定为Hidden的卷轴使用滑鼠滚轮滚动还是可以看到所有的内容

但是设定为Disabled的卷轴却已经完全没有反应了唷!

?

------------------------------------------------------03/21更新--------------------------------------------------------------

?

为了让大家更了解Disabled 、Auto、Hidden 以及Visible 四种设定间的差异

特别多做了一个四合一的比较：

感谢Ouch的技术协助

请拖动Slider更改颜色区块的大小，看出四种设定的差异

Auto = 当内容过多时，才会显示bar

Disabled = 就算内容超过容器大小，也完全禁用bar

Hidden = 隐藏bar ，但可以使用滑鼠滚轮卷动，观看超过容器大小的内容

Visible =不管内容是否有超过容器大小，永远都显示bar

?

很抱歉，阁下使用的浏览器并不支援 IFrame，不能正常浏览我的网页

?

?

?

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

一步一步迈向HIE之路

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

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

 

最新文章

  1. Lookup component 用法
  2. Effective Java 58 Use checked exceptions for recoverable conditions and runtime exceptions for programming errors
  3. int integer string间的转换
  4. Python入门和基础
  5. POJ 3211 Washing Clothes【01背包】
  6. OSGI容器与插件
  7. 9个Java性能优化工具汇总
  8. Android开发之旅：android架构
  9. spring aop 笔记2
  10. 新一代自平衡电动代步工具Solo wheel!
  11. ecshop网站建设手机版wap版出现lib.debug.php on line 303
  12. 使用JsonConfig控制JSON lib序列化
  13. sort()没有返回值
  14. malloc() 和 calloc()有啥区别
  15. xsyProblem A: 密集子图(graph)
  16. github链接
  17. shell脚本--变量与数组
  18. HashMap（JDK1.8）
  19. TP5中文件的写入路径有的会被自动重定向到首页
  20. nodejs 环境配置技巧

热门文章

  1. 【9309】求Y=X1/3
  2. spark 基于key排序的wordcount
  3. ERROR sqoop.Sqoop: Got exception running Sqoop: java.lang.RuntimeException: java.lang.RuntimeException: java.sql.SQLException: The connection property &#39;zeroDateTimeBehavior&#39; acceptable values are: &#39;CO
  4. bootstrap 模态框 video视频测试
  5. [Android]使用ViewPager实现图片滑动展示
  6. C#中的yield关键字
  7. cocos2d-x创建第一个项目
  8. jQuery怎么选择两个class属性
  9. CUDA atomic原子操作
  10. DB 查询分析器 轻松创建DB2定义他们自己的函数