1 / 36

2D Graphics and Custom Views

2D Graphics and Custom Views. Or I want to make something pretty and interactive. MCS: Texas A&M simulation and graphics Software engineer here at Valtech. Overview. Android View and Graphics Architecture Quick review of Creating Custom Components Handling Multiple Screen Sizes

kathy
Download Presentation

2D Graphics and Custom Views

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 2D Graphics and Custom Views Or I want to make something pretty and interactive

  2. MCS: Texas A&M simulation and graphics Software engineer here at Valtech

  3. Overview Android View and Graphics Architecture Quick review of Creating Custom Components Handling Multiple Screen Sizes Improving Performance

  4. Architecture of Views and Android Graphics What's going on under the covers?

  5. View Basics Image from Android Developers website http://developer.android.com/guide/topics/ui/overview.html

  6. View Group to the Screen

  7. Invalidate

  8. Draw When onDraw is called -Walks down view tree drawing invalid views -Draws front to back

  9. From App to Surface

  10. Surface to Screen Based on about hardware architecture http://developer.mips.com/2012/04/11/learning-about-android-graphics-subsystem/

  11. Review of June Creating Custom Views Or what do you remember from last time?

  12. June Meet-up Recording: Custom UI Controls by Luke Wallace on the Dallas Android Developers meet-up site under pages/recording of past meetings http://www.meetup.com/Dallas-Android-Development-Group/pages/Recordings_Of_Past_Meetings/ or on our youtube channel at http://www.youtube.com/user/DallasAndroidDevelop?feature=watch

  13. Extend a View object an Override • OnMeasure • OnDraw • Invalidate when you need to update • Also might want to look into • onSizeChanged • onAttach

  14. Resources of different densities • Nine patches • Vector Graphics • Canvas and Paint Huge-cube by MI-wikier

  15. Standard Approach Different Resources for different screen sizes and densities -specify dps or wrap content layout not pixels -Don't want resource scaled? Use nodpi From Android Developer website http://developer.android.com/guide/practices/screens_support.html

  16. Nine Patches -Grow an image by reproducing sections of it -draw9patch available in android sdk Image from android developers draw 9 patch documentation

  17. Are SVG usable on Android? • Why not do everything using SVG files?

  18. Library called SVG-Android • Open source • Library is 16.4 kb • It isn't usable in icons Source: http://code.google.com/p/svg-android/ Image is part of SVG-Android landing page

  19. in between pixels problem Different sizes might need to be structurally different image from http://www.pushing-pixels.org/2011/11/04/about-those-vector-icons.html there is also an interesting article

  20. Canvas • What to draw Paint • How to draw it Good overview of Android 2D pipeline at http://www.xenomachina.com/2011/05/androids-2d-canvas-rendering-pipeline.html

  21. These made with Canvas/Paints From MindTheRobot www.mindtherobot.com Look under Thermometer and AnalogDial– includes source

  22. Test Different Screens Cheap Preview in eclipse/ emulator Android Design preview tool http://code.google.com/p/android-ui-utils/ ADB shell am display-size 1023X768 -bluetooth keyboard

  23. Getting Graphics to Manipulate Work on Personal Projects? Art training?

  24. See what's free Look whats on Android Developers Wikimedia Commons • licensing • different densities Remember you don't have to use the whole thing! • Good for textures • Combine parts of images

  25. Use Free Tools • GIMP • Inkscape • Remember you can take pictures • http://www.guru.com/

  26. Tips • Tools • Surface/Texture View

  27. Other Tips to Improve Performance -don't use new in onDraw! -use cliprect on invisible areas -turn on hardware aceleration -avoid to much overdraw -get heavy processing off of main UI thread -Recyle your bitmaps when done -Avoid blending as much as possible

  28. Invalidate with Hardware Acceleration This Image Modified from Google IO 2011 Accelerated Android Rendering Roman Guy and Chet Hasse

  29. Use four-parameter variant of invalidate() rather than the version that takes no parameters • Image from For Butter or Worse Google IO 2012 Chet Hasse Roman Guy

  30. Hardware Acceleration -Must have GPU -Doesn't support everything -easy to turn on

  31. Tools lint Developer Options Show Overdraw Profile GPU rendering HierarchyViewer

  32. Image from developer.android.com on hierarchy viewer

  33. Using Profile GPU Rendering Set using developer options settings on your phone 4.2 1) adb shell dumpsys gfxinfo com.your.app from terminal 2) Kill your app 3) look for section profile data in ms 4) chart in excel http://www.curious-creature.org/2012/12/01/android-performance-case-study/

  34. Surface/Texture Views -More responsive, don't wait for view update -heavy weight -manage calling onDraw yourself -lock the surface do work unlock

  35. Thank you. Questions?

More Related