Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

English subtitles

← TODO Adding Elevation

Get Embed Code
6 Languages

Showing Revision 3 created 05/25/2016 by Udacity Robot.

  1. Right now, we have material sliding
    through material on the same elevation,
  2. which is something the spec frowns upon.
  3. What we'd like to do is
    something more like this.
  4. As you can see, the app bar gains
    in elevation, casts a shadow,
  5. when the content slides under.
  6. Fortunately, we have a callback for
    when the RecyclerView is scrolling.
  7. I just realized there might be a small
    percentage of you that would feel
  8. intellectually compromised if you
    didn't get to implement this effect.
  9. This is your chance to
    pause the video and
  10. attempt to do it yourself
    before I show you the answer.
  11. Okay, last chance, and here goes.
  12. Here's how I did this.
  13. Inside of onCreateView,
    right after our parallax stuff,
  14. I checked to see we have an app bar.
  15. If we have one,
    I start by setting its elevation to 0.
  16. I then I add an OnScrollListener here.
  17. And whenever we scroll it we check
    the vertical offset of the RecyclerView.
  18. If it's zero then we know
    we're not underscrolled and
  19. we set the app bar elevation to zero.
  20. Otherwise, we're underscrolled and we
    actually set it to its TargetElevation,
  21. which is something that app
    bars do that's kind of cool.
  22. And with that,
    we get this nice underscrolling effect.
  23. It's a little hard to see
    on the tablet perhaps, but
  24. there's actually a little shadow
    there you can see that's being cast.
  25. It's a subtle detail, but once again,
    I always say when we're doing these
  26. final steps, it's that last 10% that
    really makes an enormous difference.
  27. And sometimes, it's the last 1%.