#887 – The Difference between Disabled and Hidden Scrollbar Visibility

August 19, 2013 1 Comment

A ScrollViewer allows setting the horizontal or vertical scrollbar visibility to Auto, Disabled, Hidden or Visible.  The Disabled and Hidden options are similiar, but subtly different.

  • Hidden – Scrollbar is not shown, but content is allowed to scroll (e.g. using arrow keys).  Content in ScrollViewer is given an infinite amount of space in the scrolling direction.  (E.g. Infinite width if HorizontalScrollBarVisibility is set to Hidden).
  • Disabled – Content cannot scroll and is not allowed to be larger than the ScrollViewer’s size in the scrolling direction.

We can see how this works by placing a horizontally-oriented WrapPanel inside a ScrollViewer.  When the HorizontalScrollBarVisibility is set to Hidden, the WrapPanel is infinitely wide and therefore never wraps.  (You can still scroll the content using the arrow keys).

887-001

If the HorizontalScrollBarVisibility is set to Disabled, the WrapPanel can’t scroll horizontally and its width is constrained to the width of the ScrollViewer, causing it to wrap.

887-002

Advertisement

Filed under Controls Tagged with , , , , ,

#493 – Setting the Visibility of a User Interface Element

February 13, 2012 2 Comments

You can set the visibility of any element that inherits from UIElement by settings its Visibility property to one of the three values listed below.  Because every child hosted in a panel derives from UIElement, this is how you hide/show child elements in a panel.

Values for Visibility (of type System.Windows.Visibility):

  • Visible – element is displayed
  • Hidden – element is not displayed, but the space where it is located is preserved
  • Collapsed – element is not displayed and space for it is not preserved

Below is an example that lets a user toggle between the three possible values for the Visibility of the middle Label.

    <StackPanel>
        <StackPanel Orientation="Horizontal" Margin="10">
            <Label Content="Snoopy" Margin="3" Background="BurlyWood"/>
            <Label Content="Waldo" Margin="3" Background="Thistle"
                   Visibility="{Binding ElementName=cboVisibility, Path=SelectedValue, Converter={StaticResource cboVisibilityConverter}}"/>
            <Label Content="Dagwood" Margin="3" Background="LightGreen"/>
        </StackPanel>
        <ComboBox Name="cboVisibility" HorizontalAlignment="Center" SelectedIndex="0">
            <ComboBox.Items>
                <ComboBoxItem Content="Visible"/>
                <ComboBoxItem Content="Collapsed"/>
                <ComboBoxItem Content="Hidden"/>
            </ComboBox.Items>
        </ComboBox>
        <Label Content="Select visibility of middle Label" HorizontalAlignment="Center"/>
    </StackPanel>



Filed under Controls Tagged with , , , , ,