103 - Android Graphics Performance

Google IO 2013

Transcript

3. & Graphics Performance
4. & Chet Haase Romain Guy
5. Architecture
6. Reordering & merging
7. Save Cancel Maximize compatibility Include metadata
9. Include metadata Maximize compatibility Cancel Save Order of drawing commands
10. Include metadata Maximize compatibility Cancel Save 1. Re-ordering
11. Include metadata Maximize compatibility Cancel Save 2. Merging
13. Multi-threading
15. Drawing
16. Drawing Shadows Shadows Shadows Shadows
17. Drawing Paths Paths Shadows Shadows Shadows Shadows
18. Non-rectangular clipping
19. @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); } }
20. Developer Tools 2
21. Overdraw
22. Overdraw
23. Overdraw
24. Overdraw Blue Green Red Deep Red 1x 2x 3x 4x
25. 0 3 6 9 12 15 Time in ms Frames Update display lists Process display lists Swap buffers
28. performTraversals draw getDL drawDisplayList systrace flush drawing commands
29. android:sdk $ cd platform-tools/ android:platform-tools $ 㾑 ./systrace.py gfx view freq sched
31. 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; }
32. android:sdk $ cd platform-tools/ android:platform-tools $ 㾑 ./systrace.py -a com.example.myapp
33. Tips & Tricks 3
34. Overdraw demo
35. Trilinear filtering
37. Off On
38. private void loadData() { // Load bitmap Bitmap b = getBitmap(); // Enable trilinear filtering b.setHasMipMap(true); }
39. <bitmap android:mipMap="true" android:src="@drawable/my_drawable" />
40. Canvas layers
41. @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(); }
42. saveLayer()
45. @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(); }
46. saveLayer()
49. Using alpha with care
51. 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));
52. 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); ==
57. lternatives
58. // Not this textView.setAlpha(alpha); // But this int newTextColor = (int) (0xFF * alpha) << 24 | baseTextColor & 0xFFFFFF; textView.setTextColor(newTextColor);
59. // Not this imageView.setAlpha(alpha); // But this imageView.setImageAlpha((int) (alpha * 255));
60. // Not this customView.setAlpha(alpha); // But this int alpha = (int) (255 * slider.getProgress() / 100.0f); paint.setAlpha(alpha); canvas.draw*(..., paint);
61. // Or use a layer view.setLayerType(View.LAYER_TYPE_HARDWARE, null); // Transient layer view.animate().alpha(0).withLayer();
62. // API level 16+ @Override public boolean hasOverlappingRendering() { // Don't lie to us! return false; }
63. 640 dp 400 dp Canvas
64. @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); }
65. 1280 px 800 px View 300 px 600 px
67. With hardware rendering 600x300 px (size of the View)
68. With hardware rendering With software rendering 600x300 px 1280x800 px (size of the View) (size of the window)
69. ✂ Clipping
70. @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); }
72. 1. Clip
73. 2. Rotate
74. 3. Draw
76. @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); }
78. 1. Rotate
79. 2. Clip
80. 3. Draw
82. Stencil buffer
83. Stencil buffer
84. 640 px 400 px View
85. Invalidate 640 px 400 px (170,125) (470,275)
86. @Override protected void onDraw(Canvas canvas) { // Query the current clip Rect clip = canvas.getClipBounds(); // ??? Log.d("I/O", "clip = " + clip); }
88. With hardware rendering 0, 0, 640, 400 (bounds of the View)
89. With hardware rendering With software rendering 0, 0, 640, 400 170,125, 470, 275 (bounds of the View) (bounds of the dirty rect)
90. Reordering barriers
91. Non-rectangular clips
92. saveLayer()
93. More info Parleys.com For Butter or Worse Google I/O 2012 Various Android GUI & performance talks Accelerated Android Rendering Google I/O 2011
94. 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
95. Q&A google.com/+ChetHaase google.com/+RomainGuy @chethaase @romainguy
96. Developers