WP7 Panorama control sliding lagging when hiding Application Bar

Question

I have a Windows Phone app with panorama control.

Panorama currently has two pages.

One page should have a visible application bar with buttons, and another one should not.

I use the panorama's SelectionChanged event to chage the IsVisible property of the ApplicationBar.

private void Panorama_SelectionChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
        {
            ApplicationBar.IsVisible = Panorama.SelectedIndex == 0;
        }

The functionality I get is as desired, but with such behaviour, I get a terrible lagging (a momentary freeze of sliding animation) of my panorama. This probably happens due to the fact that the UI thread has to operate the very windows phone "native" application bar.

What is the best way to avoid this problem?

Should I call the ApplicationBar.IsVisible = Panorama.SelectedIndex == 0; in a separate thread? Or should I use the item's ManipulationStarted and ManipulationCompleted events to hide the app bar?

Thanks.

Answer 1

I was able to get smooth animation by removing/adding the application bar icons instead of hiding the application bar itself.

Answer 2

Try to set the opacity of app bar to 0.999999 instead of default value (1.0). It should works.

Answer 3

Just in case anyone else runs into this, datou.guo is right. The details on opacity explain it here: AppBar Documentation

They recommend using 0, .5, or 1 for app bar opacity. When opacity is at 1, the page is actually resized when there is a change to the App Bar, which would explain the lag. If the opacity is at .5, that won't happen. They don't specifically mention any other opacity values, but I gave it a try at 0.99 and it did prevent the lagging.

Note that you'll probably have to update the layout to have some margin at the bottom of the page, since the app bar no longer takes up space on the page when it's transparent.

Answer 4

You should design your application to not use the application bar on the same page as a panorama control.

The two are not designed to be used together. This is for both design and technical reasons. (Because they should never be used toghether for design reasons, there are technical issues when using them both which are highly unlikley to ever be addressed.) You've found one such issue.

If you have content on a panorama item that the user should interact with then move the controls onto the item or a separate page (if linked to by selecting that content).

Update
Before anyone points out - some of the hubs (office & people) combine panoramas and application bars in the current mango builds. There is no official comment on this from Micorsoft. (I just asked.) Design guidelines for Mango have not yet been released. There is unlikely to be any more info until they are.
The panorama template with the mango beta SDK still includes a comment indicating that you shouldn't combine an application bar and a panorama though.

Answer 5

Running that piece of code in a separate thread won't help because at the end of the day you will need to use Deployment.Current.Dispatcher.BeginInvoke() to apply the effect on UI thread (otherwise you will get cross thread exception).

But for this lagging issue, I would say try changing the visibility after like 200 ms of delay. Thay may help.

Answer 6

Here I found advise for your case Panorama Control Design Guidelines for Windows Phone which tells that if you use an Application Bar in your Panorama, set the Mode to Minimized. This mode is designed specifically to maximize screen space on a Panorama page.