View To Pixel (Android Summit & DroidconUk 2017)

View To Pixel (Android Summit & DroidconUk 2017)

3142db3adb711e247e371153b5777e04?s=128

Britt Barak

August 24, 2017
Tweet

Transcript

  1. 2.
  2. 18.
  3. 19.
  4. 20.
  5. 21.
  6. 28.
  7. 29.

    So What Does That Mean? Measure/ Layout Draw Sync &

    Upload Execute Swap Buffers VSync/Misc
  8. 31.
  9. 32.
  10. 35.

    1. Steps will be called by order 2. A step

    will be called up to once per frame
  11. 38.

    Order Is Guaranteed Choreographer.java void doFrame(long frameTimeNanos, int frame) {

    //... doCallbacks(Choreographer.CALLBACK_INPUT, frameTimeNanos); doCallbacks(Choreographer.CALLBACK_ANIMATION, frameTimeNanos); doCallbacks(Choreographer.CALLBACK_TRAVERSAL, frameTimeNanos); doCallbacks(Choreographer.CALLBACK_COMMIT, frameTimeNanos); //… }
  12. 40.

    Step 1: Measure Goal: obtain view size, including its descendants

    size, agreed by its parent. REF: http://developer.android.com/reference/android/view/View.html#onMeasure(int, int)
  13. 41.

    Multiple measure() Calls measure() may be called more than once

    For example: - Call once with UNSPECIFIED - If size too big/small- evaluate - Call with exact size
  14. 43.

    Step 1: Measure - What’s View SIZE? - width &

    height (aka: drawing width & drawing height) - - Actual size on screen, at drawing time and after layout. REF: http://developer.android.com/reference/android/view/View.html#onMeasure(int, int)
  15. 44.

    Step 1: Measure - What’s View SIZE? - width &

    height (aka: drawing width & drawing height) - - Actual size on screen, at drawing time and after layout. - measured width & measured height - how big a view wants to be within its parent REF: http://developer.android.com/reference/android/view/View.html#onMeasure(int, int)
  16. 46.

    ViewTreeObserver • Provided by the view hierarchy • getViewTreeObserver() •

    Register listeners to view tree global changes https://developer.android.com/reference/android/view/ViewTreeObserver.html
  17. 50.

    Step 2: Layout Goal : set position for view and

    all its children, respect parent’s constraints. REF: http://developer.android.com/reference/android/view/View.html#onLayout(boolean, int, int, int, int)
  18. 52.

    Root View : RelativeLayout 1) By views’ requests • Then

    relativeLayout calculates by relations & weights 2) Determine final positions
  19. 53.

    Root View : RelativeLayout Example: • Every view is RelativeLayout

    • Per Leaf change: 2*2*2 = 8 traversals X2 X2 X2
  20. 57.

    It Usually Works Fine… But... • Root elements • Deep

    view hierarchy • Too many (i.e. list) Can hurt.
  21. 58.

    What can we do? • Flatten hierarchy : ◦ Removing

    unneeded views ◦ Merge on include ◦ flatter layout • Beware of double layout taxation • Minimize requestLayout()
  22. 63.

    Simple VS Complex Layouts • Simple : LinearLayout, FrameLayout, TableLayout

    ◦ → Nesting → Performance Problems • Complex : RelativeLayout , GridLayout ◦ → shouldn’t be @ top hierarchy ◦ → hard to use & maintain
  23. 65.

    Constraint Layout • Api 9+ • Performance oriented: ◦ Reduce

    nesting ◦ Improve measure/layout ◦ Best practice : top level, without nesting layouts • User friendly: ◦ Expressive ◦ New layout Editor!
  24. 68.

    Step3: Draw 1. Heavy onDraw() a. Object allocations 2. Overdraw

    a. Redundant backgrounds / transparency b. Wasteful onDraw - quickReject() - clipRect()
  25. 72.

    GPU Profiling Tool • A graph per visible app •

    A bar per frame • 16ms benchmark • Crossing = skipping frame https://developer.android.com/studio/profile/dev-options-rendering.html
  26. 75.
  27. 76.

    Frame Metrics On Android N+ - Per-Frame data: - Windos.OnFrameMetricsAvailableListener()

    - Aggregated data: - FrameMetricsAggregator (Support lib v26)
  28. 80.

    How Does A View Display On Screen? Screen GPU Polygons

    Textures CPU new Button() DisplayList
  29. 81.
  30. 82.