c# - Setting Visibility="Collapsed" doesn't hide the Button. Update: Fixed by myself but I want to know the reason for the issue

Question

I am creating a custom transport controls. In that, I have added an AppBarButton. To change the visibility of that I have created a Property for it, but for some reason, it doesn't work. The AppBarButton is always visible.

Code of the Property

//To change Visibility for CompactOverlayButton
public bool IsCompactOverlayButtonVisible
{
    get
    {
        return compactOverlayButton != null && compactOverlayButton.Visibility == Visibility.Visible;
    }
    set
    {
        if (compactOverlayButton != null)       //To neglect the Visibility check before the Template has been applied
        {
            compactOverlayButton.Visibility = value ? Visibility.Visible : Visibility.Collapsed;
        }
    }
}

So I started debugging it. I can't find any error in the C# part, so I set Visibility="Collapsed" for AppBarButton in the XAML part. I am surprised, Even though I set Visibility="Collapsed" the AppBarButton is still visible.

Here is my code in XAML part

<AppBarButton x:Name='CompactOverlayButton'
    Style='{StaticResource AppBarButtonStyle}'
    MediaTransportControlsHelper.DropoutOrder='17' Visibility="Collapsed">
    <AppBarButton.Icon>
        <FontIcon Glyph="&#xEE40;"/>
    </AppBarButton.Icon>
</AppBarButton>

Update:

I found out the line of code which is causing it. It is from the C# part of the page where I have used this CustomMediaTransportControls.

The Line which causing this is

var youtubeUrl = await YouTube.GetVideoUriAsync("QTYVJhy04rs", YouTubeQuality.Quality144P, videoQuality);

I have fixed the issue problem by setting CustomMediaControl.IsCompactOverlayButtonVisible = false; after the above line of code. Still, I want to how the above line is affecting my program. The entire code the been included in the for reference part

For Reference:

Here is my entire code

1. CustomMediaTransportControls.cs - Derived class from MediaTransportControls
2. MediaPlayerDictionary.xaml - ResourceDictionary
3. VideosPage.xaml - C# part of the page where I have used this CustomMediaTransportControls

Answer 1

I am not sure if removing this one line resolved the issue since i had the same issue without this line of code. However i found a workaround for this problem:

Add a Property for the visibility as well as the according listener:

public Visibility CompactOverlayButtonVisibility
{
    get { return (Visibility)GetValue(CompactOverlayButtonVisibilityProperty); }
    set { SetValue(CompactOverlayButtonVisibilityProperty, value); }
}

public static readonly DependencyProperty CompactOverlayButtonVisibilityProperty =
    DependencyProperty.Register(nameof(CompactOverlayButtonVisibility) , typeof(Visibility), typeof(CustomMediaTransportControls), new PropertyMetadata(Visibility.Visible, OnVisibisityChanged));


internal static void OnVisibisityChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){
    if (((CustomMediaTransportControls)d).compactOverlayButton != null)
    {
        if ((Visibility)e.NewValue != Visibility.Visible)
            ((CustomMediaTransportControls)d).commandBar.PrimaryCommands.Remove(((CustomMediaTransportControls)d).compactOverlayButton);
        else if (!((CustomMediaTransportControls)d).commandBar.PrimaryCommands.Contains(((CustomMediaTransportControls)d).compactOverlayButton))
            ((CustomMediaTransportControls)d).commandBar.PrimaryCommands.Insert(4, ((CustomMediaTransportControls)d).compactOverlayButton);
        ((CustomMediaTransportControls)d).compactOverlayButton.Visibility = Visibility.Visible;
    }

And add the following to your OnApplyTemplateMethod:

commandBar = GetTemplateChild("MediaControlsCommandBar") as CommandBar;
        compactOverlayButton = GetTemplateChild("CompactOverlayButton") as AppBarButton;
if (CompactOverlayButtonVisibility != Visibility.Visible)
    commandBar.PrimaryCommands.Remove(compactOverlayButton);
else if(!commandBar.PrimaryCommands.Contains(compactOverlayButton))
    commandBar.PrimaryCommands.Insert(4, compactOverlayButton);
compactOverlayButton.Visibility = Visibility.Visible;

However you might want to investigate why the Visibility is changed from code despite being set in the xaml code. Maybe this is true for all AppBarButtons maybe not. You could try that out and then look into the relevant sourcecode here. If you found the reason you might figure out a better solution.