Search code examples
c#xamluwpwin-universal-app

UWP Binding not showing empty value


I have a ListView containing a list of Music (my ViewModel), and Music has a string property Album.

However, when Album is empty, meaning that it is simply "", the container (a HyperTextButton) that holds Album is not showing an empty value. Instead, it shows the value of Music.ToString(). And although it is showing the Music string, the content of the HyperTextButton is actually empty as expected, which can be confirmed in the click event of the HyperTextButton.

How can I make it properly display the empty string?

This is the ItemTemplate of the ListView:

    <local:PlaylistControlItem DataContext="{x:Bind}" ShowAlbumText="{Binding ElementName=PlaylistController, Path=ShowAlbumText}">
        <local:PlaylistControlItem.ContextFlyout>
            <MenuFlyout Opening="OpenMusicMenuFlyout" />
        </local:PlaylistControlItem.ContextFlyout>
    </local:PlaylistControlItem>

And this is the Control that shows Album:

    <HyperlinkButton
        x:Name="AlbumTextButton"
        Grid.Row="0"
        Grid.Column="2"
        Margin="0,0,10,0"
        VerticalAlignment="Center"
        Click="Album_Click"
        Content="{Binding Album}"
        Foreground="{Binding IsPlaying, Converter={StaticResource PlaylistRowColorConverter}, ConverterParameter=Gray, Mode=OneWay}"
        Style="{StaticResource TextButtonStyle}"
        Visibility="{x:Bind ShowAlbumText, Converter={StaticResource VisibilityConverter}, Mode=OneWay}" />

The source code of ListView is here.

ItemTemplate is here.


Solution

  • By checking your code, the main problem is in TextButtonStyle. In TextButtonStyle, you also use the textBlock to implement the binding. Its DataContext is Music, so it sometimes calls the Music.toString method, and in the toString method which you have rewritten returns Path, so this happens.

    The quickest solution is to set the DataContext of the AlbumTextButton to Music.Album(What is changed here is just the DataContext of the AlbumTextButton , not the context of the Page.), so that the textBlock will be bound to the album. In this case, you don't need to bind the Album to the content of the Button. Or you can modify the content in the style.

    TextButton.xaml:

    <HyperlinkButton
                x:Name="AlbumTextButton"
                Grid.Row="0"
                Grid.Column="2"
                Margin="0,0,10,0"
                VerticalAlignment="Center"
                Click="Album_Click"
                DataContext="{Binding Album}"
                Foreground="{Binding IsPlaying, Converter={StaticResource PlaylistRowColorConverter}, ConverterParameter=Gray, Mode=OneWay}"
                Style="{StaticResource TextButtonStyle}"
                Visibility="{x:Bind ShowAlbumText, Converter={StaticResource VisibilityConverter}, Mode=OneWay}" />
    

    Update: Method two

    If you want to remove the underline, you can try to use the TextBlockButtonStyle which is the System provides. This usage will also not display the underline.

    .xaml:

    <HyperlinkButton
                x:Name="AlbumTextButton"
                Grid.Row="0"
                Grid.Column="2"
                Margin="0,0,10,0"
                VerticalAlignment="Center"
                Click="Album_Click"
                Content="{Binding Album}"
                Foreground="{Binding IsPlaying, Converter={StaticResource PlaylistRowColorConverter}, ConverterParameter=Gray, Mode=OneWay}"
                Style="{StaticResource TextBlockButtonStyle}"
                Visibility="{x:Bind ShowAlbumText, Converter={StaticResource VisibilityConverter}, Mode=OneWay}" />