WP8.1 Appbar HideCommands Issue

Question

I am writing a WP8.1 app using WinJS and the navigation template in Visual Studio. I have an appbar in my app and when I navigate to different pages I use hideCommands/showCommands to customize the appbar with commands that are appropriate for the page. The issue is that the commands to be hidden are not completely hidden before the commands to be shown are shown. This creates a momentary flash of the buttons to be hidden.

 var commands = [appbar.winControl.getCommandById("commandA"), appbar.winControl.getCommandById("commandB"), appbar.winControl.getCommandById("commandC")];
 appbar.winControl.hideCommands(commands);
 appbar.winControl.showCommands("commandD");

Any help would be appreciated.

Answer 1

Same thing happened to me. I used to think having only one AppBar would be better than creating one for every page so I had the same approach you did using the showOnlyCommands. That worked fine on Windows 8 (& 8.1) but definitely does not work as expected in WinPhone 8.1

So what I ended up doing is having my AppBar markup in every page I where needed an AppBar.

<div data-win-control="WinJS.UI.AppBar"></div>

I do have some code to show/hide commands from the AppBars using the showOnlyCommands method which has worked with no problems ever since.

One tip of advice: showOnlyCommands can receive an array of either the commads ID (as string) or the AppBarCommands themselves. I found the later worked as expected. Had a little issues with the IDs