UWP Template10 Hide FontIcon element when the menu "IsOpen" - binding

Question

I have the following xaml construct.
<Controls:HamburgerMenu x:Name="MyHamburgerMenu">
<Controls:HamburgerMenu.PrimaryButtons>
<Controls:HamburgerButtonInfo x:Name="searchButton">
<FontIcon x:Name="searchButtonIcon" Width="48"
Height="48"
Glyph=""
Visibility="{Binding IsOpen, ???"/>
<AutoSuggestBox PlaceholderText="Search" QueryIcon="Find"/>
<Controls:HamburgerButtonInfo x:Name="searchButton">
</Controls:HamburgerMenu.PrimaryButtons>
</Controls:HamburgerMenu>
When the menu "IsOpen", the FontIcon element should be collapsed. If the menu not "IsOpen", the FontIcon element should be visible.
The groove music app has such a behaviour (see image in groove music app with opened menu).
Which are the parameters for the binding? An explanation for hiding the hamburger button is described in UWP Template10 Hide hamburger button when menu is open.
I guess that it's a template10 behaviour. I tried the following within the template10's Shell.xaml page.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock x:Name="txt-1" Text="{Binding IsOpen, ElementName=MyHamburgerMenu}" Grid.Row="0"/>
<Controls:HamburgerMenu x:Name="MyHamburgerMenu" Grid.Row="1">
<Controls:HamburgerMenu.PrimaryButtons>
<Controls:HamburgerButtonInfo>
<TextBlock x:Name="txt-2" Text="{Binding IsOpen, ElementName=MyHamburgerMenu}"/>
</Controls:HamburgerButtonInfo>
</Controls:HamburgerMenu.PrimaryButtons>
</Controls:HamburgerMenu>
</Grid>
The TextBlock txt-1 displays the correct state of the HamburgerMenu's IsOpen property whereas the TextBlock txt-2 is empty.

Answer 1

You could use an IValueConverter to convert the IsOpen to a visibility
public class BooleanToVisibilityConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
return (!(bool)value) ? Visibility.Visible : Visibility.Collapsed;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
return value;
}
}
This article explains IValueConverters and how to use them in your XAML
https://learn.microsoft.com/en-us/uwp/api/Windows.UI.Xaml.Data.IValueConverter

Answer 2

So it works.
Change the binding to x:bind and reference it to "MyHamburgerMenu".
<Controls:HamburgerMenu x:Name="MyHamburgerMenu">
<Controls:HamburgerMenu.PrimaryButtons>
<Controls:HamburgerButtonInfo x:Name="searchButton">
<SymbolIcon Width="48"
Height="48"
Symbol="Find"
Visibility="{x:Bind MyHamburgerMenu.IsOpen, Mode=TwoWay, Converter={StaticResource BooleanToVisibilityConverter}, ConverterParameter=false}"/>
<AutoSuggestBox PlaceholderText="Search" QueryIcon="Find"/>
</Controls:HamburgerButtonInfo>
</Controls:HamburgerMenu.PrimaryButtons>
</Controls:HamburgerMenu>
and use a invertable BooleanToVisibilityConverter like that