Google I/O 2013 - Android Graphics Performance

5,946 views

Published on

Engineers from the Android UI Graphics team will show some tips, tricks, tools, and techniques for getting the best performance and smoothest UI for your Android applications.

Published in: Technology, Business
0 Comments
15 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,946
On SlideShare
0
From Embeds
0
Number of Embeds
43
Actions
Shares
0
Downloads
117
Comments
0
Likes
15
Embeds 0
No embeds

No notes for slide

Google I/O 2013 - Android Graphics Performance

  1. 1. &Graphics Performance
  2. 2. &Chet Haase Romain Guy
  3. 3. Architecture
  4. 4. Reordering & merging
  5. 5. Save Cancel Maximize compatibility Include metadata
  6. 6. Include metadata Maximize compatibility CancelSave Order of drawing commands
  7. 7. Include metadata Maximize compatibility CancelSave 1. Re-ordering
  8. 8. Include metadata Maximize compatibility Cancel Save 2. Merging
  9. 9. Multi-threading
  10. 10. Drawing
  11. 11. Drawing Shadows Shadows Shadows Shadows
  12. 12. Drawing Paths Paths Shadows Shadows Shadows Shadows
  13. 13. Non-rectangular clipping
  14. 14. @Override protected void onDraw(Canvas canvas) { // Clip with a shape Path clip = getPath(); canvas.clipPath(clip); // Draw the content for (int i = 0; i < mLines,length; i++) { TextLine line = mLines[i]; canvas.drawText(line.text, line.x, line.y, mPaint); } }
  15. 15. Developer Tools 2
  16. 16. Overdraw
  17. 17. Overdraw
  18. 18. Overdraw
  19. 19. Overdraw Blue Green Red Deep Red 1x 2x 3x 4x
  20. 20. 0 3 6 9 12 15 Timeinms Frames Update display lists Process display lists Swap buffers
  21. 21. performTraversals draw getDL drawDisplayList systrace flush drawing commands
  22. 22. android:sdk $ cd platform-tools/ android:platform-tools $ ./systrace.py gfx view freq sched
  23. 23. import android.os.Trace; @Override public View getView(int pos, View view, ViewGroup parent) { Trace.beginSection("getView"); if (view == null) { view = createView(); } // Trace time spent binding data Trace.beginSection("bind"); bindView(pos, view); Trace.endSection(); Trace.endSection(); return view; }
  24. 24. android:sdk $ cd platform-tools/ android:platform-tools $ ./systrace.py -a com.example.myapp
  25. 25. Tips & Tricks 3
  26. 26. Overdraw demo
  27. 27. Trilinear filtering
  28. 28. Off On
  29. 29. private void loadData() { // Load bitmap Bitmap b = getBitmap(); // Enable trilinear filtering b.setHasMipMap(true); }
  30. 30. <bitmap android:mipMap="true" android:src="@drawable/my_drawable" />
  31. 31. Canvas layers
  32. 32. @Override protected void onDraw(Canvas canvas) { // Create a clipped layer canvas.save(); canvas.saveLayer(x, y, width, height, Canvas.CLIP_TO_LAYER_SAVE_FLAG); // Draw stuff canvas.drawBitmap(bugDroid, 0.0f, 0.0f, null); canvas.restore(); }
  33. 33. saveLayer()
  34. 34. @Override protected void onDraw(Canvas canvas) { // Create an unclipped layer canvas.save(); canvas.saveLayer(x, y, width, height, 0); // Draw stuff canvas.drawBitmap(bugDroid, 0.0f, 0.0f, null); canvas.restore(); }
  35. 35. saveLayer()
  36. 36. Using alpha with care
  37. 37. view.setAlpha(0.5f); View.ALPHA.set(view, 0.5f); ObjectAnimation.ofFloat(view, "alpha", 0.5f) view.animate().alpha(0.5f); view.setAnimation(new AlphaAnimation(1.0f, 0.5f));
  38. 38. view.setAlpha(0.5f); View.ALPHA.set(view, 0.5f); ObjectAnimation.ofFloat(view, "alpha", 0.5f) view.animate().alpha(0.5f); view.setAnimation(new AlphaAnimation(1.0f, 0.5f)); Canvas.saveLayerAlpha(l, t, r, b, 127, Canvas.CLIP_TO_LAYER_SAVE_FLAG); ==
  39. 39. lternatives
  40. 40. // Not this textView.setAlpha(alpha); // But this int newTextColor = (int) (0xFF * alpha) << 24 | baseTextColor & 0xFFFFFF; textView.setTextColor(newTextColor);
  41. 41. // Not this imageView.setAlpha(alpha); // But this imageView.setImageAlpha((int) (alpha * 255));
  42. 42. // Not this customView.setAlpha(alpha); // But this int alpha = (int) (255 * slider.getProgress() / 100.0f); paint.setAlpha(alpha); canvas.draw*(..., paint);
  43. 43. // Or use a layer view.setLayerType(View.LAYER_TYPE_HARDWARE, null); // Transient layer view.animate().alpha(0).withLayer();
  44. 44. // API level 16+ @Override public boolean hasOverlappingRendering() { // Don't lie to us! return false; }
  45. 45. 640 dp 400dp Canvas
  46. 46. @Override protected void onDraw(Canvas canvas) { // Get the dimensions of the Canvas int w = canvas.getWidth(); int h = canvas.getHeight(); canvas.drawRect(0, 0, w, h, mPaint); }
  47. 47. 1280 px 800px View 300px 600 px
  48. 48. With hardware rendering 600x300 px (size of the View)
  49. 49. With hardware rendering With software rendering 600x300 px 1280x800 px (size of the View) (size of the window)
  50. 50. ✂ Clipping
  51. 51. @Override protected void onDraw(Canvas canvas) { // Keep the jellybeans canvas.clipRect(l, t, r, b); // Rotate the jar canvas.rotate(-30.0f, pX, pY); // Draw the jar canvas.drawBitmap(mJellyBeans, x, y, null); }
  52. 52. 1. Clip
  53. 53. 2. Rotate
  54. 54. 3. Draw
  55. 55. @Override protected void onDraw(Canvas canvas) { // Rotate the jar canvas.rotate(-30.0f, pX, pY); // Keep the jellybeans canvas.clipRect(l, t, r, b); // Draw the jar canvas.drawBitmap(mJellyBeans, x, y, null); }
  56. 56. 1. Rotate
  57. 57. 2. Clip
  58. 58. 3. Draw
  59. 59. Stencilbuffer
  60. 60. Stencilbuffer
  61. 61. 640 px 400px View
  62. 62. Invalidate 640 px 400px (170,125) (470,275)
  63. 63. @Override protected void onDraw(Canvas canvas) { // Query the current clip Rect clip = canvas.getClipBounds(); // ??? Log.d("I/O", "clip = " + clip); }
  64. 64. With hardware rendering 0, 0, 640, 400 (bounds of the View)
  65. 65. With hardware rendering With software rendering 0, 0, 640, 400 170,125, 470, 275 (bounds of the View) (bounds of the dirty rect)
  66. 66. Reordering barriers
  67. 67. Non-rectangular clips
  68. 68. saveLayer()
  69. 69. More info Parleys.com For Butter or Worse Google I/O 2012 Various Android GUI & performance talks Accelerated Android Rendering Google I/O 2011
  70. 70. More info Romain’s Tips & Tricks www.curious-creature.org Chet’s Tips & Tricks goo.gl/y9JZr Android Performance Case Study graphics-geek.blogspot.com
  71. 71. Q&A google.com/+ChetHaase google.com/+RomainGuy @chethaase @romainguy
  72. 72. Developers

×