CODEWITHSUNDEEP
.netxamarinmaui
Simon Bob
Simon Bob

Reputation: 405

IsVisible binding can only hide element in Android

I have an element on a page in .NET MAUI, which should only be shown when a user has unread notifications. I have set a property on my viewmodel and is binding it to the isVisible property of element like this:

IsVisible="{Binding HasUnreadNotifications}"

The property is being requestet from the server, so it will take a short while until the HasUreadNotifications will be set. However when it is set to true and raised (invoke the OnPropertyChanged event), then the element does not show.

I have figured out, that if the default state is true, and the server responds false, then the element is correctly hidden.

So it seems that in android the IsVisible can only hide elements. Can this really be true?

The project is an upgrade from a previous Xamarin-project.

My property is very plain:

public bool _hasUnreadNotifications = false;
    public bool HasUnreadNotifications 
    { 
        get
        {
            return _hasUnreadNotifications;
        }
        set
        {
            _hasUnreadNotifications = value;
            RaisePropertyChanged(nameof(HasUnreadNotifications));
        }
    }

I use prism with my view-models inheriting from BindableBase, which has Raise property changed.

The setter is invoked after a service call:

private async Task GetNotificationStatisticsAsync()
{
    try
    {
       var result = await _notificationsService.GetLastSeenNotificationStatistics();
       UnreadNotificationsCount = result.Count;
       HasUnreadNotifications = result.Count > 0;
    }
    catch (Exception ex)
    {
        UnreadNotificationsCount = 0;
    }
}

The service call is invoked in the navigate callback:

public void OnNavigatedTo(INavigationParameters parameters)
{
    Task.Run(async () => await DoUpdateUserInformation());
}

The item I'm trying to show is in a regular ContentPage housed within a couple of grinds for layout:

<ContentPage ...>    
    <Grid Grid.Column="2" ColumnDefinitions="Auto, AutColumnSpacing="12">
        <controls:ArterIconButton Grid.Column="0"  Command="{Binding ShowNotificationsCommand}" Icon="{StaticResource Fa-Bell}" />
        <Border Grid.Column="0" InputTransparent="True" IsVisible="{Binding HasUnreadNotifications}" HorizontalOptions="End" HeightRequest="25" WidthRequest="25" StrokeShape="RoundRectangle 12.5" VerticalOptions="End" BackgroundColor="{StaticResource Red}">
            <Label HorizontalOptions="Center" TextColor="White" VerticalOptions="Center" Style="{StaticResource TextSmallBold}" Text="{Binding UnreadNotificationsCount}"/>
        </Border>
    </Grid>
</ContentPage>

P.s: In iOS the behavior is as expected: The property can be false and then the element is hidde, but when it is set to true, the element is shown.

Upvotes: 0

Views: 396

Answers (2)

Simon Bob
Simon Bob

Reputation: 405

We ended up migrating the entire app to Flutter, which is far more stable and easy to work with.

Upvotes: 0

Michael
Michael

Reputation: 11

I've come across this issue in a project migrated from Xamarin to Maui. So far the closest I've been able to find is a workaround for the issue where you put the image or button affected inside a StackLayout and set the visibility on the StackLayout while leaving the original Image or Button always visible.

This approach seems to work better for Buttons than it does for Images. For images it seems better to leave them off of the page and then dynamically add them when needed. There still seems to be edge cases where if the image is added while an OnDisappearing is happening it will not appear when navigating back to the page.

Upvotes: 0

Related Questions