Mobile Computing With Android ACST 4550 Bitmaps, Fonts and Gestures

Slides:



Advertisements
Similar presentations
2D Graphics Drawing Things. Graphics In your GUI, you might want to draw graphics E.g. draw lines, circles, shapes, draw strings etc The Graphics class.
Advertisements

Graphics You draw on a Graphics object The Graphics object cannot directly be created by your code, instead one is generated when the method paintComponent.
Working with images and scenes CS 5010 Program Design Paradigms “Bootcamp” Lesson 2.5 TexPoint fonts used in EMF. Read the TexPoint manual before you delete.
Graphics Programming. Introduction GOAL: Build the Indexer Client Event-driven vs. Sequential programs Terminology – Top-level windows are called “frame.
1 Drawing C Sc 335 Object-Oriented Programming and Design Rick Mercer.
1 Cascading Style Sheets Continued Different kinds of selectors in a style sheet –Simple- Pseudo-Class –Contextual- Pseudo-Element –Class Image Styles.
Basic 2D Graphics in Android. Android Graphics Programming There are many ways to do graphics programming in Android – 2D vs. 3D – static vs. dynamic.
© by Pearson Education, Inc. All Rights Reserved. continued …
©The McGraw-Hill Companies, Inc. Permission required for reproduction or display. Topics  Applets  Classes used for graphics Graphics Point Dimension.
Exercise 1 Checklist Dreamweaver - Local Root Folder –Make sure it is properly specified in Dreamweaver  Verify Otherwise can cause problems with local.
Painterly Rendering CMPS Assignment 2. OpenGL OpenGL is a cross-language, cross- platform specification defining and API for 2D and 3D graphics.
Graphics and Multimedia. Introduction The language contains many sophisticated drawing capabilities as part of namespace System.Drawing and the other.
Designing a Classroom Web Site Using NVU Beginning Level.
XP Tutorial 7 New Perspectives on Microsoft Windows XP 1 Microsoft Windows XP Working with Graphics Tutorial 7.
Basic Drawing Techniques
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Introduction to Android (Part.
2D Graphics: Part 2.
20-753: Fundamentals of Web Programming Copyright © 1999, Carnegie Mellon. All Rights Reserved. 1 Lecture 16: Java Applets & AWT Fundamentals of Web Programming.
SDL Programming Introduction. Initialization 2  The first thing you must do is initialize SDL  int SDL_Init( SDL_INIT_EVERYTHING )  This will return.
Exploring 2D Graphics: The Sudoku Example Content taken from book: “Hello, Android” by Ed Burnette Third Edition.
2D Graphics: Rendering Details
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Using Android XML Resources.
App Inventor MIT App Inventor.
CSE 219 Computer Science III Images. HW1 Has been posted on Blackboard Making a Game of Life with limited options.
Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 5 Working with Images Starting Out with Games & Graphics in.
Computer Science 112 Fundamentals of Programming II Graphics Programming.
Laboratory Exercise # 9 – Inserting Graphics to Documents Office Productivity Tools 1 Laboratory Exercise # 9 Inserting Graphics to Documents Objectives:
Android Graphics Library. Color Android colors are represented with four numbers, one each for alpha, red, green, and blue (ARGB). Each component can.
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Review of Graphics in Java,
Resources and RelativeLayouts. Resources Android Resources We’ve already talked about the different types of Android Resources DirectoryResource Type.
Graphic Basics in C ATS 315. The Graphics Window Will look something like this.
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Introduction to Android (Part.
Graphics Concepts CS 2302, Fall /17/20142 Drawing in Android.
Android View Stuff. TextViews Display text Display images???
Copyright © Texas Education Agency, All rights reserved.1 Web Technologies Motion Graphics & Animation.
Basic 2D Graphics in Android. Android Graphics Programming There are many ways to do graphics programming in Android – 2D vs. 3D – static vs. dynamic.
Graphics JavaMethods An Introduction to Object-Oriented Programming Maria Litvin Gary Litvin Copyright © 2003 by Maria Litvin, Gary Litvin, and Skylight.
10/20/2005week71 Graphics, mouse and mouse motion events, KeyEvent Agenda Classes in AWT for graphics Example java programs –Graphics –Mouse events –Mouse.
Part 4 Text & Fonts © UNT in partnership with TEA1IT: Web Technologies - HTML Scripting.
Sprites (Images) and Sounds
INTRO to PIXLR.com.
TUTORIAL ON MULTITOUCH AND SWIPE GESTURES
Logo with Curved Text.
Images.
Computer Graphics Lecture 3 Computer Graphics Hardware
Scratch for Interactivity
Inserting and Working with Images
Mobile Computing With Android ACST Intro to Android, Part 2
2D Graphics: Part 2.
Chapter 2 – Introduction to the Visual Studio .NET IDE
Creation of an Android App By Keith Lynn
Graphics and Multimedia
Gimp Guide Mr Hall.
Mobile Computing With Android ACST 4550 Android Logs and Gestures
Chapter 5 Working with Images
Basic Graphics Drawing Shapes 1.
CS 106A, Lecture 12 More Graphics
Android Programming Lecture 6
CASE Tools Graphical User Interface Programming Using C#
AWT Components and Containers
Tutorial 6 Creating Dynamic Pages
Images.
Chapter 8: Graphics, Animations, Sounds, and Gaming
More programming with "Processing"
Chapter 7: Touches and Swipes
Working with Symbols and Interactivity
CS297 Graphics with Java and OpenGL
Working with images and scenes
CIS 470 Mobile App Development
Presentation transcript:

Mobile Computing With Android ACST 4550 Bitmaps, Fonts and Gestures

Bitmaps In the Canvas class, Bitmap objects are used instead of standard Java Image objects to show images. PNG, GIF and JPEG images are supported. To load an image file, you must put it in one of the “drawable” folders and then use a command like the following that does not include the image’s file extension in the filename: Bitmap bmp = BitmapFactory.decodeResource(resource, R.drawable.filename); Ex: Bitmap carRight = BitmapFactory.decodeResource(resource, R.drawable.carright); The resource object is somewhat like the this keyword in that it accesses the current objects resource folders. You usually retrieve it using the getResources() method if you are in a View or the getApplicationResources() method in an Activity.

Bitmaps Once you have the Bitmap object you can place it anywhere on the canvas using its (x,y) coordinate. For instance, you could display the bitmap at position (40,20) as its top left corner like so: canvas.drawBitmap(carRight,40,20,paint); See SnowmanCarView.java

Bitmaps If you want to resize the bitmap, you need to create a Rect or RectF object that has the new width and height size dimensions in it, along with the (x,y) top left component. Then you can use that object to determine the location and the size of the bitmap like so: Rect newDim = new Rect(x,y,x+newWidth,y+newHeight); canvas.drawBitmap(carRight,null,newDim,paint);

Bitmaps If you want to draw just a portion of the bitmap, you can provide two Rect objects, where the first has the portion of the original Bitmap dimensions you wish to use, the second has the place you would like two draw that portion on the canvas. The following lines draws the top left quarter corner of a bitmap onto the top left corner of the screen at whatever new dimensions are desired: Rect oldDim = new Rect(0,0,bmpWidth/2,bmpHeight/2); Rect newDim = new Rect(0,0,newWidth,newHeight); canvas.drawBitmap(bmp,oldDim,newDim,paint);

Bitmaps If you want a bitmap to blend into its background, you can do so by setting the alpha value of the paint to whatever transparency level you want. The following example draws the bitmap at a half transparent alpha value because 128 is about half of 255: paint.setColor(Color.argb(128,0,0,0)); canvas.drawBitmap(bmp,x,y,paint);

Fonts Although you can load your own font files into the values resource folder, the Android OS only comes loaded with 3 basic fonts: MONOSPACE => fixed width font SERIF => fancier font (like Times Roman) SANS_SERIF => fancier font without feet You can use the following TypeFace styles with these fonts: TypeFace.NORMAL TypeFace.BOLD TypeFace.ITALIC TypeFace.BOLD_ITALIC See FontDemoView.java

FontMetrics The FontMetrics class provides you with information about the rendering of a particular Font using a particular Paint object. The FontMetrics object is returned by the getFontMetrics() method of the Paint class. There are no FontMetrics methods, but it provides the following 5 fields which give you the Font’s ascent and descent details : ascent, bottom, descent, leading and top. The FontMetrics class doesn’t provide a stringWidth() method to help with centering text on a Canvas, so instead you would use the measureText(String) method of the Paint class to do this like so, at some vertical position (vPos): paint.setTypeface(Typeface.create("SANS_SERIF",Typeface.BOLD)); paint.setTextSize(24); int labelWidth = (int) paint.measureText(label); int scrWidth = canvas.getWidth(); canvas.drawText(label,(scrWidth-labelWidth)/2, vPos, paint);

onTouchEvent() The onTouchEvent() handler is a simple method for handling touch screen motion events. If the screen is touched in a specific view, this method for that view is called. The argument sent to this method if a MotionEvent object. The method returns a boolean becauseiIf this method handles the event (by responding to it) the method should return true. The MotionEvent class has a getAction() method that reports a number of actions that might have occurred to trigger this event. We will only address three of them: ACTION_UP - A pressed gesture has finished ACTION_DOWN - A pressed gesture has started ACTION_MOVE - A change happened during a press gesture

onTouchEvent() The MotionEvent class also has a getX() and a getY() method that reports the x and y coordinate (in floats) of the point where the touch event occurred. Example: public boolean onTouchEvent(MotionEvent event) { if (event.getAction() == MotionEvent.ACTION_DOWN) { int x = (int) event.getX(); int y = (int) event.getY(); // Here you would use the touch coordinates for some action } return true;

onSizeChanged() The onSizeChanged() handler is a simple method that is called whenever the size of the view has changed. You can use this method to find out the size of your view window because when the size of the view is first determined as your app is first starting up, this method is called. The following are the fields sent to this method: w the current width of this view h the current height of this view oldw the old width of this view, zero if first time oldh the old height of this view, zero if first time