SlideShare ist ein Scribd-Unternehmen logo
1 von 20
Android Programming




  Lesson 12

2D Graphics
 NGUYEN The Linh
Android Programming


Contents


       1   CustomView


       2   SurfaceView


       3   Exercise 12




                         2
Android Programming


2D Graphics




              2D Graphics




                  3
Android Programming


CustomView

 Creating a custom view




                           4
Android Programming


CustomView

 Creating a custom view




                           5
Android Programming


CustomView

 Override onDraw()
    The most important step in drawing a custom view is to override
     the onDraw() method.

    The parameter to onDraw() is a Canvas object that the view can
     use to draw itself.

    The Canvas class defines methods for drawing text, lines,
     bitmaps, and many other graphics primitives. You can use these
     methods in onDraw() to create your custom user interface (UI).

                                 6
Android Programming


CustomView

 Create Drawing Objects
    The android.graphics framework divides drawing into two areas:
       • What to draw, handled by Canvas
       • How to draw, handled by Paint.


    For instance, Canvas provides a method to draw a line,
     while Paint provides methods to define that line's color.

    Canvas has a method to draw a rectangle, while Paint defines
     whether to fill that rectangle with a color or leave it empty.

                                    7
Android Programming


CustomView

 Create Drawing Objects
    Simply put, Canvas defines shapes that you can draw on the
     screen, while Paint defines the color, style, font, and so forth of
     each shape you draw.

     Creating objects ahead of time is an important optimization. Views
      are redrawn very frequently, and many drawing objects require
      expensive initialization. Creating drawing objects within
      your onDraw() method significantly reduces performance and can
      make your UI appear sluggish.


                                   8
Android Programming


CustomView

 Handle Layout Events
    In order to properly draw your custom view, you need to know
     what size it is.

    You should never make assumptions about the size of your view
     on the screen.

    App needs to handle different screen sizes, multiple screen
     densities, and various aspect ratios in both portrait and landscape
     mode.

                                  9
Android Programming


CustomView

 Handle Layout Events
    In order to properly draw your custom view, you need to know
     what size it is.

    You should never make assumptions about the size of your view
     on the screen.

    App needs to handle different screen sizes, multiple screen
     densities, and various aspect ratios in both portrait and landscape
     mode.

                                 10
Android Programming


CustomView

 Handle Layout Events
    Although View has many methods for handling measurement,
     most of them do not need to be overridden. If your view doesn't
     need special control over its size, you only need to override one
     method: onSizeChanged().

     onSizeChanged() is called when your view is first assigned a
      size, and again if the size of your view changes for any reason.




                                  11
Android Programming


CustomView

 Draw!
    Once you have your object creation and measuring code defined,
     you can implement onDraw().

    Every view implements onDraw() differently, but there are some
     common operations that most views share:




                                12
Android Programming


CustomView

 Draw!
    Draw text using drawText(). Specify the typeface by
     calling setTypeface(), and the text color by calling setColor().

     Draw primitive shapes using drawRect(), drawOval(),
      and drawArc(). Change whether the shapes are filled, outlined, or
      both by calling setStyle().




                                  13
Android Programming


2D Graphics

 Draw!
    Draw more complex shapes using the Path class. Define a shape
     by adding lines and curves to a Path object, then draw the shape
     using drawPath(). Just as with primitive shapes, paths can be
     outlined, filled, or both, depending on the setStyle().

    Define gradient fills by creating LinearGradient objects.
     Call setShader() to use your LinearGradient on filled shapes.

    Draw bitmaps using drawBitmap().

                                14
Android Programming


CustomView

 Example 12.1




                 15
Android Programming


2D Graphics




              SurfaceView




                  16
Android Programming


SurfaceView

 Difference between SurfaceView and View?
    Views are all drawn on the same GUI thread which is also used
     for all user interaction.

    So if you need to update GUI rapidly or if the rendering takes too
     much time and affects user experience then use SurfaceView.

    The main difference is that SurfaceView can be drawn on by
     background threads but Views can't.


                                 17
Android Programming


SurfaceView

 Example 12.2




                 18
Android Programming


Exercise 12

 Example 12.2
    Kill Ants




                 19
Android Programming

Weitere ähnliche Inhalte

Was ist angesagt?

Utilizing Layers in AutoCAD Prototype Package
Utilizing Layers in AutoCAD Prototype PackageUtilizing Layers in AutoCAD Prototype Package
Utilizing Layers in AutoCAD Prototype Package
Brian Mitchell
 
Tutorial 1 - Computer Aided Design (Final Release)
Tutorial 1 - Computer Aided Design (Final Release)Tutorial 1 - Computer Aided Design (Final Release)
Tutorial 1 - Computer Aided Design (Final Release)
Charling Li
 
RCB_16T3_AB2_ID063_AADIL
RCB_16T3_AB2_ID063_AADILRCB_16T3_AB2_ID063_AADIL
RCB_16T3_AB2_ID063_AADIL
Aadil Sukry
 
DUSPviz 2012 Illustrator
DUSPviz 2012 IllustratorDUSPviz 2012 Illustrator
DUSPviz 2012 Illustrator
DUSPviz
 
What is corel
What is corelWhat is corel
What is corel
poonam09
 

Was ist angesagt? (12)

Utilizing Layers in AutoCAD Prototype Package
Utilizing Layers in AutoCAD Prototype PackageUtilizing Layers in AutoCAD Prototype Package
Utilizing Layers in AutoCAD Prototype Package
 
Tutorial 1 - Computer Aided Design (Final Release)
Tutorial 1 - Computer Aided Design (Final Release)Tutorial 1 - Computer Aided Design (Final Release)
Tutorial 1 - Computer Aided Design (Final Release)
 
RCB_16T3_AB2_ID063_AADIL
RCB_16T3_AB2_ID063_AADILRCB_16T3_AB2_ID063_AADIL
RCB_16T3_AB2_ID063_AADIL
 
Lighting with Photoshop
Lighting with PhotoshopLighting with Photoshop
Lighting with Photoshop
 
DUSPviz 2012 Illustrator
DUSPviz 2012 IllustratorDUSPviz 2012 Illustrator
DUSPviz 2012 Illustrator
 
AUTO CAD CIVIL ENGINEERING PPT REPORT
AUTO CAD CIVIL ENGINEERING PPT REPORTAUTO CAD CIVIL ENGINEERING PPT REPORT
AUTO CAD CIVIL ENGINEERING PPT REPORT
 
What is corel
What is corelWhat is corel
What is corel
 
Print17 slides p2
Print17 slides p2Print17 slides p2
Print17 slides p2
 
Adobe InDesign Primer
Adobe InDesign PrimerAdobe InDesign Primer
Adobe InDesign Primer
 
2 d autocad_2009
2 d autocad_20092 d autocad_2009
2 d autocad_2009
 
editing commands in auto cad
editing commands in auto cadediting commands in auto cad
editing commands in auto cad
 
Corel Draw Training Hyderabad, Corel Draw Classes, Corel Draw training Instit...
Corel Draw Training Hyderabad, Corel Draw Classes, Corel Draw training Instit...Corel Draw Training Hyderabad, Corel Draw Classes, Corel Draw training Instit...
Corel Draw Training Hyderabad, Corel Draw Classes, Corel Draw training Instit...
 

Andere mochten auch

Framing the canvas - DroidCon Paris 2014
Framing the canvas - DroidCon Paris 2014Framing the canvas - DroidCon Paris 2014
Framing the canvas - DroidCon Paris 2014
Paris Android User Group
 

Andere mochten auch (20)

It's the arts! Playing around with the Android canvas
It's the arts! Playing around with the Android canvasIt's the arts! Playing around with the Android canvas
It's the arts! Playing around with the Android canvas
 
Framing the canvas - DroidCon Paris 2014
Framing the canvas - DroidCon Paris 2014Framing the canvas - DroidCon Paris 2014
Framing the canvas - DroidCon Paris 2014
 
Gamemaker lesson 1
Gamemaker lesson 1Gamemaker lesson 1
Gamemaker lesson 1
 
2D graphics
2D graphics2D graphics
2D graphics
 
Introducción a mobclix
Introducción a mobclixIntroducción a mobclix
Introducción a mobclix
 
Admob y yo
Admob y yoAdmob y yo
Admob y yo
 
Realm or: How I learned to stop worrying and love my app database
Realm or: How I learned to stop worrying and love my app databaseRealm or: How I learned to stop worrying and love my app database
Realm or: How I learned to stop worrying and love my app database
 
Android master class
Android master classAndroid master class
Android master class
 
My way to clean android (EN) - Android day salamanca edition
My way to clean android (EN) - Android day salamanca editionMy way to clean android (EN) - Android day salamanca edition
My way to clean android (EN) - Android day salamanca edition
 
[C++ GUI Programming with Qt4] chap8
[C++ GUI Programming with Qt4] chap8[C++ GUI Programming with Qt4] chap8
[C++ GUI Programming with Qt4] chap8
 
Rasterization
RasterizationRasterization
Rasterization
 
Quad Core Processors - Technology Presentation
Quad Core Processors - Technology PresentationQuad Core Processors - Technology Presentation
Quad Core Processors - Technology Presentation
 
Computer_Graphics_basic_definitions_summary
Computer_Graphics_basic_definitions_summaryComputer_Graphics_basic_definitions_summary
Computer_Graphics_basic_definitions_summary
 
Introduction of Android View
Introduction of Android ViewIntroduction of Android View
Introduction of Android View
 
Android Thread
Android ThreadAndroid Thread
Android Thread
 
GRPHICS01 - Introduction to 3D Graphics
GRPHICS01 - Introduction to 3D GraphicsGRPHICS01 - Introduction to 3D Graphics
GRPHICS01 - Introduction to 3D Graphics
 
Lect6 transformation2d
Lect6 transformation2dLect6 transformation2d
Lect6 transformation2d
 
Introduction to 2D/3D Graphics
Introduction to 2D/3D GraphicsIntroduction to 2D/3D Graphics
Introduction to 2D/3D Graphics
 
Multicore Processor Technology
Multicore Processor TechnologyMulticore Processor Technology
Multicore Processor Technology
 
Android data binding
Android data bindingAndroid data binding
Android data binding
 

Ähnlich wie [Android] 2D Graphics

Computer Graphics Practical
Computer Graphics PracticalComputer Graphics Practical
Computer Graphics Practical
Neha Sharma
 

Ähnlich wie [Android] 2D Graphics (20)

[Android] Basic Widgets and Containers
[Android] Basic Widgets and Containers[Android] Basic Widgets and Containers
[Android] Basic Widgets and Containers
 
3.2 ws WMS.pdf
3.2 ws WMS.pdf3.2 ws WMS.pdf
3.2 ws WMS.pdf
 
Marakana Android User Interface
Marakana Android User InterfaceMarakana Android User Interface
Marakana Android User Interface
 
Computer graphics
Computer graphicsComputer graphics
Computer graphics
 
Android training day 3
Android training day 3Android training day 3
Android training day 3
 
[Android] Using Selection Widgets
[Android] Using Selection Widgets[Android] Using Selection Widgets
[Android] Using Selection Widgets
 
How to Become the MacGyver of Android Custom Views
How to Become the MacGyver of Android Custom ViewsHow to Become the MacGyver of Android Custom Views
How to Become the MacGyver of Android Custom Views
 
Computer Graphics Practical
Computer Graphics PracticalComputer Graphics Practical
Computer Graphics Practical
 
Supporting multiple screens on android
Supporting multiple screens on androidSupporting multiple screens on android
Supporting multiple screens on android
 
[Android] Introduction to Android Programming
[Android] Introduction to Android Programming[Android] Introduction to Android Programming
[Android] Introduction to Android Programming
 
Android canvas-chapter20
Android canvas-chapter20Android canvas-chapter20
Android canvas-chapter20
 
hema ppt (2).pptx
hema ppt (2).pptxhema ppt (2).pptx
hema ppt (2).pptx
 
Tech Talk Project Work
Tech Talk Project WorkTech Talk Project Work
Tech Talk Project Work
 
AutoCAD 2D training report
AutoCAD 2D training reportAutoCAD 2D training report
AutoCAD 2D training report
 
WMP_MP02_revd_03(10092023).pptx
WMP_MP02_revd_03(10092023).pptxWMP_MP02_revd_03(10092023).pptx
WMP_MP02_revd_03(10092023).pptx
 
Advance ui development and design
Advance ui  development and design Advance ui  development and design
Advance ui development and design
 
Technology and Android.pptx
Technology and Android.pptxTechnology and Android.pptx
Technology and Android.pptx
 
Android Apps Training - Day Four (Design)
Android Apps Training - Day Four (Design)Android Apps Training - Day Four (Design)
Android Apps Training - Day Four (Design)
 
Processing for Android: Getting Started
Processing for Android: Getting StartedProcessing for Android: Getting Started
Processing for Android: Getting Started
 
Android design lecture #3
Android design   lecture #3Android design   lecture #3
Android design lecture #3
 

Mehr von Nikmesoft Ltd

Mehr von Nikmesoft Ltd (15)

[iOS] Networking
[iOS] Networking[iOS] Networking
[iOS] Networking
 
[iOS] Data Storage
[iOS] Data Storage[iOS] Data Storage
[iOS] Data Storage
 
[iOS] Multiple Background Threads
[iOS] Multiple Background Threads[iOS] Multiple Background Threads
[iOS] Multiple Background Threads
 
[iOS] Navigation
[iOS] Navigation[iOS] Navigation
[iOS] Navigation
 
[iOS] Basic UI Elements
[iOS] Basic UI Elements[iOS] Basic UI Elements
[iOS] Basic UI Elements
 
[iOS] Introduction to iOS Programming
[iOS] Introduction to iOS Programming[iOS] Introduction to iOS Programming
[iOS] Introduction to iOS Programming
 
[Android] Multimedia Programming
[Android] Multimedia Programming[Android] Multimedia Programming
[Android] Multimedia Programming
 
[Android] Android Animation
[Android] Android Animation[Android] Android Animation
[Android] Android Animation
 
[Android] Services and Broadcast Receivers
[Android] Services and Broadcast Receivers[Android] Services and Broadcast Receivers
[Android] Services and Broadcast Receivers
 
[Android] Web services
[Android] Web services[Android] Web services
[Android] Web services
 
[Android] Multiple Background Threads
[Android] Multiple Background Threads[Android] Multiple Background Threads
[Android] Multiple Background Threads
 
[Android] Maps, Geocoding and Location-Based Services
[Android] Maps, Geocoding and Location-Based Services[Android] Maps, Geocoding and Location-Based Services
[Android] Maps, Geocoding and Location-Based Services
 
[Android] Data Storage
[Android] Data Storage[Android] Data Storage
[Android] Data Storage
 
[Android] Intent and Activity
[Android] Intent and Activity[Android] Intent and Activity
[Android] Intent and Activity
 
[Android] Widget Event Handling
[Android] Widget Event Handling[Android] Widget Event Handling
[Android] Widget Event Handling
 

Kürzlich hochgeladen

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

Kürzlich hochgeladen (20)

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 

[Android] 2D Graphics

  • 1. Android Programming Lesson 12 2D Graphics NGUYEN The Linh
  • 2. Android Programming Contents 1 CustomView 2 SurfaceView 3 Exercise 12 2
  • 6. Android Programming CustomView  Override onDraw()  The most important step in drawing a custom view is to override the onDraw() method.  The parameter to onDraw() is a Canvas object that the view can use to draw itself.  The Canvas class defines methods for drawing text, lines, bitmaps, and many other graphics primitives. You can use these methods in onDraw() to create your custom user interface (UI). 6
  • 7. Android Programming CustomView  Create Drawing Objects  The android.graphics framework divides drawing into two areas: • What to draw, handled by Canvas • How to draw, handled by Paint.  For instance, Canvas provides a method to draw a line, while Paint provides methods to define that line's color.  Canvas has a method to draw a rectangle, while Paint defines whether to fill that rectangle with a color or leave it empty. 7
  • 8. Android Programming CustomView  Create Drawing Objects  Simply put, Canvas defines shapes that you can draw on the screen, while Paint defines the color, style, font, and so forth of each shape you draw.  Creating objects ahead of time is an important optimization. Views are redrawn very frequently, and many drawing objects require expensive initialization. Creating drawing objects within your onDraw() method significantly reduces performance and can make your UI appear sluggish. 8
  • 9. Android Programming CustomView  Handle Layout Events  In order to properly draw your custom view, you need to know what size it is.  You should never make assumptions about the size of your view on the screen.  App needs to handle different screen sizes, multiple screen densities, and various aspect ratios in both portrait and landscape mode. 9
  • 10. Android Programming CustomView  Handle Layout Events  In order to properly draw your custom view, you need to know what size it is.  You should never make assumptions about the size of your view on the screen.  App needs to handle different screen sizes, multiple screen densities, and various aspect ratios in both portrait and landscape mode. 10
  • 11. Android Programming CustomView  Handle Layout Events  Although View has many methods for handling measurement, most of them do not need to be overridden. If your view doesn't need special control over its size, you only need to override one method: onSizeChanged().  onSizeChanged() is called when your view is first assigned a size, and again if the size of your view changes for any reason. 11
  • 12. Android Programming CustomView  Draw!  Once you have your object creation and measuring code defined, you can implement onDraw().  Every view implements onDraw() differently, but there are some common operations that most views share: 12
  • 13. Android Programming CustomView  Draw!  Draw text using drawText(). Specify the typeface by calling setTypeface(), and the text color by calling setColor().  Draw primitive shapes using drawRect(), drawOval(), and drawArc(). Change whether the shapes are filled, outlined, or both by calling setStyle(). 13
  • 14. Android Programming 2D Graphics  Draw!  Draw more complex shapes using the Path class. Define a shape by adding lines and curves to a Path object, then draw the shape using drawPath(). Just as with primitive shapes, paths can be outlined, filled, or both, depending on the setStyle().  Define gradient fills by creating LinearGradient objects. Call setShader() to use your LinearGradient on filled shapes.  Draw bitmaps using drawBitmap(). 14
  • 17. Android Programming SurfaceView  Difference between SurfaceView and View?  Views are all drawn on the same GUI thread which is also used for all user interaction.  So if you need to update GUI rapidly or if the rendering takes too much time and affects user experience then use SurfaceView.  The main difference is that SurfaceView can be drawn on by background threads but Views can't. 17
  • 19. Android Programming Exercise 12  Example 12.2  Kill Ants 19