How to use BooleanToVisibilityConverter in UWP

Question

In order to make a hamburger button in a UWP application, I try to use BooleanToVisibilityConverter to change the state of the hamburger button, just like RSSReader Example.

The problem is, when I created BooleanToVisibilityConverter.cs in the folder Common and wrote:

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Data;

namespace UWPTest.Common {
    public class BooleanToVisibilityConverter : IValueConverter {
        public object Convert(object value, Type targetType, object parameter, string language) =>
            (bool)value ^ (parameter as string ?? string.Empty).Equals("Reverse") ?
                Visibility.Visible : Visibility.Collapsed;

        public object ConvertBack(object value, Type targetType, object parameter, string language) =>
            (Visibility)value == Visibility.Visible ^ (parameter as string ?? string.Empty).Equals("Reverse");

    }
}

then import it into MainPage.xaml :

<Page
    x:Class="UWPTest.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UWPTest"
    xmlns:common="using:UWPTest.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Page.Resources>
        <common:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
    </Page.Resources>
    <Grid Background="Transparent">
        <ToggleButton x:Name="TogglePaneButton"
            Visibility="{x:Bind ViewModel.IsInDetailsMode, Mode=OneWay, ConverterParameter=Reverse, Converter={StaticResource BooleanToVisibilityConverter}}"
            Margin="0"
            TabIndex="1" 
            Checked="{x:Bind CheckTogglePaneButtonSizeChanged}"
            Unchecked="{x:Bind CheckTogglePaneButtonSizeChanged}"
            IsChecked="{Binding IsPaneOpen, ElementName=RootSplitView, Mode=TwoWay}"
            AutomationProperties.Name="Menu" ToolTipService.ToolTip="Menu"
            Style="{StaticResource SplitViewTogglePaneButtonStyle}"/>
    </Grid>
</Page>

IntelliSense says The name "BooleanToVisibilityConverter" does not exist in the namespace "using:UWPTest.Common". I can't figure out the reason why the class is not found.

The picture of IntelliSense's words in Chinese:

Visually

IntelliSense isn't always accurate. Can you build the project without errors? – Mississippian

Just to be sure. The code won't compile or crashes when run? Sometimes intellisense displays errors like these but the code is OK and runs well. – Famagusta

Also, just an FYI, if you're targeting SDK version 14393 or later, x:Bind will automatically convert Boolean to Visibility values without you needing to write an IValueConverter. – Mississippian

I can't compile either. There is also "The name 'BooleanToVisibilityConverter' does not exist in the namespace 'using:UWPTest.Common'." in the error list. – Visually

Just a note, UWP now has a built-in conversion from Boolean to Visibility. So just Visibility="{x:Bind ViewModel.IsInDetailsMode, Mode=OneWay}" should work. – Algor

Answer 1

When you add BooleanToVisibilityConverter to resources you set it's Key to boolean:

<common:BooleanToVisibilityConverter x:Key="boolean" />

So binding should looks like:

Converter={StaticResource boolean}

Or you can change Key value to BooleanToVisibilityConverter as it's done in example.

Halley

Sorry, that was my stupid fault. The original code in the example is Converter={StaticResource BooleanToVisibilityConverter}. The error seems to be irrelated with the ToggleButton part. – Visually

The problem still exists after I fixed my fault. – Visually

@Visually in that case I can only advice standard solutions: 1. Rebuild solution; 2. Remove converter from xaml rebuild solution and try to add it again; 3. Check spelling in name and namespace with some string comparator (there are some different characters that looks identical); 4. Restart Visual Studio. You can also think about removing converter as Decade Moon suggested, but you'll need reverse value, sorry for lack of help, I'll think about other solutions. – Halley

Answer 2

Acctually you don't need to implement your own converter. Just use the existing one provided by Micorsoft.

Complete list of the UWP converters is here.

XAML example

<Page
    x:Class="YourPageClass"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:core="using:Microsoft.Xaml.Interactions.Core"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:converters="using:Microsoft.Toolkit.Uwp.UI.Converters"
    xmlns:extensions="using:EtherClient.Extensions"      
    NavigationCacheMode="Enabled" VerticalAlignment="Stretch"
    mc:Ignorable="d"  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Page.Resources>
        <converters:BoolToVisibilityConverter x:Key="MyBooleanToVisibilityConverter"/>
        
 <Border BorderBrush="LightGreen" BorderThickness="1" Visibility="{x:Bind YourBoolPropertyGoesHere, Mode=OneWay, Converter={StaticResource MyBooleanToVisibilityConverter}}" >
                        <FontIcon FontSize="12" Margin="2,0,2,0" FontFamily="Segoe MDL2 Assets"  Foreground="LightGreen" Glyph="&#xf003;"/>
                        
</Border>
...

Electrotherapy