Return to Video

Animating our Transitions (solution)

  • 0:00 - 0:02
    All right, you're done!
  • 0:02 - 0:03
    Let me show you what I did.
  • 0:04 - 0:06
    So the first thing I did
    was create some new themes.
  • 0:06 - 0:10
    I created an AppTheme.Main and
    AppTheme.Details.
  • 0:10 - 0:12
    And those are both
    derived from AppTheme.
  • 0:12 - 0:15
    And I have put them in the main
    styles just so I can keep them there.
  • 0:15 - 0:18
    And I'm mostly keeping this stuff out
    just because it's nice to keep all this
  • 0:18 - 0:22
    v21 stuff out of the old,
    old Android Stuff.
  • 0:22 - 0:25
    So then we go to v21, and
  • 0:26 - 0:31
    I have actually created
    these styles now with name.
  • 0:31 - 0:34
    Just turning
    windowContentTransitions on, and
  • 0:34 - 0:37
    then details referencing these enter and
    return transitions.
  • 0:37 - 0:39
    Which look a lot like
    the ones that I showed you.
  • 0:40 - 0:45
    So if we look at our transitions we
    actually now have transition resources.
  • 0:45 - 0:50
    As you can see we have two different
    kinds of transitions, one for
  • 0:50 - 0:53
    v21 and one for
    landscape v21 which is pretty cool.
  • 0:54 - 0:58
    So, in the case that we are in
  • 0:58 - 1:01
    non-landscape it's
    pretty straight forward.
  • 1:02 - 1:03
    It's exactly what I showed you before.
  • 1:03 - 1:05
    We're ordering them together.
  • 1:05 - 1:06
    It's a half second long,
  • 1:06 - 1:10
    we're going to fade everything that's
    not the status bar and nav bar.
  • 1:10 - 1:14
    We're going to slide
    the toolbar from the top,
  • 1:14 - 1:18
    and we're going to slide the additional
    pane in from the bottom.
  • 1:18 - 1:19
    So very, very straightforward.
  • 1:19 - 1:22
    And for landscape, the only difference
    is we're going to slide the additional
  • 1:22 - 1:25
    pane in from the right,
    because that looks a lot nicer.
  • 1:26 - 1:28
    Then for the return transition,
  • 1:28 - 1:32
    we slide that one out from
    the bottom in the case of portrait.
  • 1:32 - 1:35
    And in landscape, we slide it off right.
  • 1:35 - 1:37
    So, very, very straightforward there,
    in terms of adding the transition set.
  • 1:37 - 1:39
    And then the only question really is,
  • 1:40 - 1:45
    where do we actually go to
    kick off our animation?
  • 1:45 - 1:49
    And, of course, a good spot for
    that is in MainActivity.
  • 1:49 - 1:51
    MainActivity knows a lot
    about what's going on, but
  • 1:51 - 1:54
    it also is a thing that actually
    is responsible for launching this.
  • 1:54 - 1:58
    MainActivity, if we're
    not in two pane mode,
  • 1:58 - 2:01
    is actually responsible for
    launching that next activity.
  • 2:01 - 2:05
    And we just call ActivityOptionsCompat,
    makeSceneTransitionAnimation and
  • 2:05 - 2:06
    then start the activity.
  • 2:06 - 2:08
    And we are done.
  • 2:08 - 2:10
    And we have a very,
    very simple transition.
Title:
Animating our Transitions (solution)
Description:

06-42 Animate Your Transitions - Solution

more » « less
Video Language:
English
Team:
Udacity
Project:
UD855 - Android Fundamentals 2
Duration:
02:11

English subtitles

Revisions Compare revisions