Android Layouts 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS 1

Android Drawing App Implement Drawing The core features of this app will include: Draw – Users will be able to draw on a blank canvas (whiteboard) . Erase – Users will be able to erase what has been drawn. Undo – Users will be able to undo and redo drawing paths. Color – Users will be able to draw using a color of their choice from at least these colors: black, dark gray, light gray, blue, red, and green, orange, yellow . Share – Users will be able to capture a screen shot and email it to a friend. Implement Drawing To draw something on the screen, you have to respond to or override one of such events – the onDraw() event which is where every view draws itself. The Three components that you must understand to effectively create an Android drawing app. Canvas Paint Path Canvas – as the name implies, the Canvas is what you draw upon Paint – after you obtain the surface to draw upon – the Canvas, you also need something to draw with – the Pain Path  – now that you have the surface to draw upon and the drawing object to use to draw upon that, you need to decide what direction that you want to draw. Do you want to go up, down, left or right. 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

Make a basic single touch drawing app for Android 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

The basics about using the onTouch event Creating a custom view The basics about using the onTouch event The first thing we want to do now is create a custom View. We can do this by creating a new class that extends the View class. 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

In the designer view of your main activity 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

Using the onTouch event to draw on a canvas Now that we have our view created we can implement the code to draw on a Canvas. We need to: Set a paint style Listen for a touch event Create a new starting point when we touch the screen Draw a path when we move our finger Redraw the view when the onTouchEvent fires. First, let’s declare some variables and override the onDraw and onTouchEvent functions. We want the onTouchEvent to fire the onDraw method to update the view with the new information. For this we can just call invalidate() from onTouchEvent. 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

We need the onDraw event to draw the path on the canvas. 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

Of course now we still need to make sure our paint variable gets a color, style and width. We will define this upon construction the view. Edit your constructor like this: We now have defined that our path will be stroked with a black color  that is 5dpi in width. The points of the path we draw will be joined and rounded. Now all that is left is to make sure that we add points to the path when we move our finger over the screen! Edit the onTouchEvent like this: 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS

Thank You 24 July 2018 S.RENUKADEVI/AP/SCD/ANDROID LAYOUTS