A few months ago, I published an article Love your battery. Use Dark Mode that talked about extending smart phone battery life by using dark mode or switching between modes when building Power Apps.
This works well, but may cause an inconsistent experience when loading the app in Teams. For example, if the app was set to default in light mode but Teams was set to dark mode, then the user would need to manually change it when they load the app.
Now that it’s possible to create Teams-aware Power Apps, you can use the theme parameter to determine the theme mode that Teams is set to and adjust your app accordingly. In my example, all I had to do is the following during start-up of my app
Set(showColourToggle,true);
Set(darkMode, false);
If(Param("source") = "teamstab",
Set(showColourToggle,false);If(Param("theme") = "dark", Set(darkMode,true),Set(darkMode,false)),
Set(showColourToggle,true);Set(darkMode,false)
)
In essence, this code segment achieves two tasks. First, it checks to see the source is set to teamstab which indicates that the app is embedded inside a tab in a channel. In this case, the theme should be determined by the Team’s theme parameter and the colour toggle should be hidden (set showColourToggle to false). If I were to launch the app from a browser directly, then the source would be set to portal. In this case, I need to expose the colour toggle and let the user choose the setting manually.
The one caveat is that, as you can see in the video, the theme does not change immediately in the app once you change the theme in Teams. You need to reload the app by switching tabs or channels.
Originally published on Medium
Haniel Croitoru 