SnackBar

[VladislavAntonyuk]

Fix #118

Platform	Default setings	Custom visual options
Android
iOS/MacCatalyst

[pictos]

Hey there, please wait until we define what we will migrate to this repo and how. If I'm not wrong this repo isn't even with the XCT

[VladislavAntonyuk]

@pictos, @jfversluis, @brminnick please review.

[jfversluis]

Hey @maxkoshevoi would you mind using the code review feature and post all comments at once instead of each one separately and killing my notifications? :)

thanks!

[maxkoshevoi]

Hi @jfversluis, sorry about that! 😅
Will use it from now on.

[VladislavAntonyuk]

@brminnick Could you please update the task requirements according to the discussion (Use native Snackbar/toast for Android and popup for other platforms)

[TheCodeTraveler]

Thanks for the reminder! I'll update the detailed design this weekend.

Just curious - would you then be closing this PR and splitting it into two separate PRs; one for SnackBar and one for Toast?

[VladislavAntonyuk]

actually, snack bar and toast only differ with the action button. maybe I will update this PR with the snack bar implementation only and then add toast.

[TheCodeTraveler]

Thanks Vlad!

Just some quick semantic feedback since it looks like you're still working on it 🙌

[VladislavAntonyuk]

@brminnick what do you think if we split this feature on parts based on Platforms? for example this PR is only for Android. In that case we can deliver the feature earlier. possibly receive some feedback.

[pictos]

@VladislavAntonyuk Do you plan to implement it using the handler approach? Using property mapper and all that jazz?

[TheCodeTraveler]

@brminnick what do you think if we split this feature on parts based on Platforms? for example this PR is only for Android.

I think it's important to include all platforms in the pull request. Excluding platforms adds complexity and confusion for the users.

Do you plan to implement it using the handler approach?

💯 All custom controls in the .NET MAUI toolkit must be done using Handlers. We made a commitment to the community that we would always use Handlers and no Renderers.

[TheCodeTraveler]

Thanks Vlad!

The Windows Sample didn't work on my machine. Can you double check that?
Edit: User error

We also need more unit tests to ensure we've covered every public API on Snackbar and ISnackbar.

I also recommend moving the UI elements in Popup.macos.ios.cs to PopupView.macos.ios.cs. This'll ensure that Popup contains the functionality for the popup (eg timer, duration, show/dismiss), and that PopupView contains all of the UI elements.

Video of Snackbar on Windows Sample App

Here's an update video of the Snackbar on Windows.

FYI - clicking the Action Button opens a new instance of the app:

[pictos]

@brminnick does this PR implements the pop-up control from XCT or will be a pop-up version of snackbar?

[VladislavAntonyuk]

@pictos, it is a based popup (not specific to snackbar). Just RoundedUIView.
It allows adding any Children. It can be used for Popup like Container.

[pictos]

@VladislavAntonyuk but this will be limited to one action, and a text message, right?

Since I was on vacation I probably lost something in the way, so I just to make sure that this doesn't obsolete the pop-up control

[TheCodeTraveler]

Yup! That Popup class is a base class for Snackbar (which is basically just a popup that only contains Text and a Button).

@pictos I recommend leveraging Popup.ios.macos.cs for your implementation of Popup.shared.cs. You're obviously welcome to tweak it for your implementation.

We'll be sure to check that the Snackbar still works properly when reviewing the Popup PR 💯

[VladislavAntonyuk]

Popup class here is just a container. it doesn't contain any code specific to snackbar. PopupView class can be used as a container for any content
Snackbar is limited to 1 action and 1 message

[pictos]

@brminnick I'm working on porting our pop-up to handler. That will take me a few more days, and I'll share a draft PR when I have the android part done. That way we can talk as a team and talk how that should like.

I was just concerned if one will overlap other, but looks like that isn't true.

I'll take a depper look on this PR asap to be more familiar with the control and architecture

Resolved ✅

[TheCodeTraveler]

Looks good to me! Excellent job, @VladislavAntonyuk!!

@pictos Do you want to give this one more review before we merge it?

[pictos]

@brminnick no, we can merge it. And I can rebate against my branch and take a look there.

[emorell96]

Thanks Vlad!

The Windows Sample didn't work on my machine. Can you double check that? Edit: User error

We also need more unit tests to ensure we've covered every public API on Snackbar and ISnackbar.

I also recommend moving the UI elements in Popup.macos.ios.cs to PopupView.macos.ios.cs. This'll ensure that Popup contains the functionality for the popup (eg timer, duration, show/dismiss), and that PopupView contains all of the UI elements.

Video of Snackbar on Windows Sample App

Here's an update video of the Snackbar on Windows.

FYI - clicking the Action Button opens a new instance of the app:

Was this ever figured out? I am using snackbar source code as inspiration for a custom implementation but I have the same issue. The MAUI app will just create a new window.

[pictos]

@emorell96 if I'm not wrong the fix for this is comming (:

[emorell96]

@pictos is it this?

Maui/samples/CommunityToolkit.Maui.Sample/Platforms/Windows/App.xaml.cs

Line 24 in a6d46f4

protected override void OnLaunched(LaunchActivatedEventArgs args)

So basically if a new process is started, the idea is to kill it as it starts?

Do you know if the events available in UWP are available on MAUI? Usually on UWP you can just override the OnActivated and hook up there in order to handle the activation as shown here: https://docs.microsoft.com/en-us/windows/apps/design/shell/tiles-and-notifications/send-local-toast?tabs=uwp#step-3-handling-activation

And if it's different with MAUI, is it possible to use ToastNotificationManagerCompat.OnActivated as shown in the docs?

The reason I ask is that I was trying to get this to work with setting the activation type to Background but then the Activated event wouldn't trigger.

[pictos]

@VladislavAntonyuk do you know the answers for this?

[emorell96]

@VladislavAntonyuk do you know the answers for this?

I just wanted to share a little what I've discovered after quite a bit of experimentation. I thought it might be useful for your nuget.

On Windows there's two kind of activations for UWP apps: foreground and background. The former will use the current app but you need to modify the package.appxmanifext file if you want to use ToastNotificationManagerCompat.OnActivated. You must both modify the appxmanifest as indicated here in order to make this work without opening a new window. The background activation uses background tasks instead but they require the background tasks to be either registered as an In-Process background task or Out-of-Process background task as shown here.

For my use case the background task sounded ideal, but I was unable to make it work with MAUI (at least for the In-Process Background tasks). I kept getting argument out of range exception.

I might try the out-of-process background tasks later.

In any case, one way I found to solve this issue using the foreground activation (the one currently used here), you need to make this change to the package.appxmanifest:

in the Package element this needs to be added:

xmlns:desktop="http://schemas.microsoft.com/appx/manifest/desktop/windows10" 
xmlns:com="http://schemas.microsoft.com/appx/manifest/com/windows10"
IgnorableNamespaces="uap rescap com desktop"

Inside of the applications:

<Applications>
    <Application Id="App" Executable="$targetnametoken$.exe" EntryPoint="$targetentrypoint$">
      <uap:VisualElements />
     <Extensions>

        <!-- Specify which CLSID to activate when toast clicked -->
        <desktop:Extension Category="windows.toastNotificationActivation">
          <desktop:ToastNotificationActivation ToastActivatorCLSID="guid-used-in-maui-csproj" /> 
        </desktop:Extension>

        <!--Register COM CLSID LocalServer32 registry key-->
        <com:Extension Category="windows.comServer">
          <com:ComServer>
            <com:ExeServer Executable="filename-used-for-the-exe-usually-the-assembly-name.exe" Arguments="-ToastActivated" DisplayName="Toast activator">
              <com:Class Id="guid-used-in-maui-csproj" DisplayName="Toast activator"/>
            </com:ExeServer>
          </com:ComServer>
        </com:Extension>

      </Extensions>
    </Application>
  </Applications>

Using $targetnametoken$.exe for the executable in com:ExeServer didn't work. I had to manually enter the assembly name.

Finally I register in the MauiProgram.cs the event:

using Microsoft.Toolkit.Uwp.Notifications;
builder.
... (every other build action)
.ConfigureLifecycleEvents(configure =>
            {
				configure.AddWindows(c =>
				{
					c.OnLaunched((window, args) =>
					{
						ToastNotificationManagerCompat.OnActivated += WindowsNotificationService.OnActivated;
					});
                });
            });

I made this minimal repo that works:
https://github.com/emorell96/MauiWithWindowsToasts

Hope it helps.

Thanks for the replies!

[pictos]

@emorell96 do you mind to open a issue and move the last post into it?

[emorell96]

@pictos done: #353