Question

WP 7.5 app. I have two Storyboard animations – one on image and another on Text.

Issue1: When I move to next page and go back, the image and text blinks.

Solution1: So I added OnNavigateFrom and explicity Stop the animations and also reset any properties involved in animations to 0.

Issue2: Now say the screen goes to lock-mode and when I unlock it, since I set opacity of one of my element to 0 in OnNavigatedFrom the element is hidden, which actually should be visible until the user moves to next page.

Solution2: I handled Obscured and UnObscured handler like below in the code and added a flag to see if app is going to obscured mode, do not stop animation or reset properties.

public class Page2 :PhoneApplicationPage
    {
         private bool _isObscured = false;
         public Page2()
        {
            (Application.Current as App).RootFrame.Obscured += OnObscured;
            (Application.Current as App).RootFrame.Unobscured += OnUnobscured;
            InitializeComponent();
        }

        protected override void OnNavigatedFrom(System.Windows.Navigation.NavigationEventArgs e)
        {
            //Stop animations and reset properties only if not going to obscure mode.
            if (!_isObscured)
            {
                //stop animaiton
                Storyboard1.Stop();
                Storyboard2.Stop();
                //Reset all transform properties to 0
                Text1.Opacity = 0;
                Image1.RenderTransform.SetValue(CompositeTransform.ScaleXProperty, 0.0);
                Image1.RenderTransform.SetValue(CompositeTransform.ScaleYProperty, 0.0);
            }
            base.OnNavigatedFrom(e);
        }

        void OnObscured(object sender, ObscuredEventArgs e)
        {
            Storyboard1.Pause();
            Storyboard2.Pause();
            _isObscured = true;
        }

        void OnUnobscured(object sender, EventArgs e)
        {
            Storyboard1.Resume();
            Storyboard2.Resume();
            _isObscured = true;
        }
    }

Question: Is this the corret way to go or is there a better way? Can there be any certification issue for doing it this way?

Any help really appreciated.

Answer 1

More easiest way is to add IsLeave boolean property and set it to true in click event that calls NavigateTo method. Also, stop animations in the same function too.

Than you can be sure that, that when you to come back, IsLeave property says you to perform animation or not.

private bool IsLeave = false;

 OnNavigatedTo()
 {
      if (IsLeave)
      {
           //We come back. Reset animations
           IsLeave = false;
      }
 }

.

 ClickEvent()
 {
      IsLeave = true;
      //Permorm all you need with animations. We leave this page
      NavigationService.NavigateTo()
 }