How to selectively display Gallery items based on Gallery state, popup or inline

Categories: DotNetBar for Windows Forms, How To

Sometimes you need to display Gallery items only when Gallery is in certain state. For example you want to display the button inside the gallery only if gallery is in popup mode, i.e. it is expanded and it shows its children on resizable popup.

You can implement this functionality by binding the child button Visiblity property to the Gallery.IsPopupOpen property. Since they are different types, you need to provide the custom converter which also give you a chance to for example invert the behavior i.e. display certain child items of the Gallery only when gallery is in inline mode and hide the items when gallery is in popup mode.

This is sample code for an custom converter that will convert the bool value true to the Visibility.Visible property and bool value false to the Visibility.Collapsed:

public class BoolToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        bool b = (bool)value;
 
        if (targetType == typeof(string))
        {
            return b.ToString();
        }
        else if (targetType == typeof(Visibility))
        {
            if (b)
                return Visibility.Visible;
            else
                return Visibility.Collapsed;
        }
 
        return null;
    }
 
    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (value is Visibility)
        {
            Visibility v = (Visibility)value;
 
            if (v == Visibility.Visible)
                return true;
            else
                return false;
        }
 
        throw new Exception("The method or operation is not implemented.");
    }
}

Public Class BoolToVisibilityConverter
    Implements IValueConverter
    Public Function Convert(value As Object, targetType As Type, parameter As Object, culture As System.Globalization.CultureInfo) As Object
        Dim b As Boolean = CBool(value)
 
        If targetType = GetType(String) Then
            Return b.ToString()
        ElseIf targetType = GetType(Visibility) Then
            If b Then
                Return Visibility.Visible
            Else
                Return Visibility.Collapsed
            End If
        End If
 
        Return Nothing
    End Function
 
    Public Function ConvertBack(value As Object, targetType As Type, parameter As Object, culture As System.Globalization.CultureInfo) As Object
        If TypeOf value Is Visibility Then
            Dim v As Visibility = DirectCast(value, Visibility)
 
            If v = Visibility.Visible Then
                Return True
            Else
                Return False
            End If
        End If
 
        Throw New Exception("The method or operation is not implemented.")
    End Function
End Class

You would include this custom converter in the resources of your window like so:

<local:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" />

This assumes that ‘local’ is your local name space. Then you will bind the Visibility of Gallery child item to the IsPopupOpen property like so:

<dc:Gallery Header="Quick Styles" Height="56" SuggestedContainerWidth="600">
  <dc:Gallery.Image>
    <Image Source="images/ChangeStyles32.png"/>
  </dc:Gallery.Image>
  <dc:ButtonDropDown Header="Apex" ImagePosition="Top" PartVisibility="ImageOnly"
Visibility="{Binding  Path=IsPopupOpen, RelativeSource={RelativeSource AncestorType={x:Type  dc:Gallery}}, Converter={StaticResource BoolToVisibilityConverter}}">
    <dc:ButtonDropDown.Image>
      <Image Source="images/Apex.png"/>
    </dc:ButtonDropDown.Image>
  </dc:ButtonDropDown>

DevComponents Knowledge Base

How to selectively display Gallery items based on Gallery state, popup or inline

Leave a Reply!