270 likes | 389 Views
Mobile Computing. Lecture#12 Graphics & Animation. Lecture Contents. Graphics & Animations Drawing Shapes Programmatically Drawing Shapes through XML Frame Animation Bouncing Globe Example Tween Animation Example. Drawing a Shape. Import the graphics packages Create a View
E N D
Mobile Computing Lecture#12 Graphics & Animation
Lecture Contents • Graphics & Animations • DrawingShapesProgrammatically • DrawingShapesthrough XML • Frame Animation • Bouncing Globe Example • Tween Animation Example
Drawing a Shape • Import the graphics packages • Create a View • Create a ShapeDrawable to hold our Drawable • Create any Shape and assign it to mDrawable • The onDraw method is called to draw the graphics • Set the boundaries and draw the shape on the canvas
Drawing through XML <?xml version="1.0" encoding="utf-8"?> <ScrollViewxmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content"> <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content"> <ImageViewandroid:layout_width="fill_parent" android:layout_height="50dip" android:src="@drawable/rect1" /> </LinearLayout> </ScrollView>
Drawing through XML <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" type="rectangle"> <solid android:color="#FF0000FF"/> </shape>_______________________ public class Main extends Activity { @Override protected void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.xmlrectangle); } }
Multiple Shapes SHAPE1<shape xmlns:android=“XXX” type="oval" > <solid android:color="#FFFFCC55"/> <padding android:left="10sp" android:top="4sp" android:right="10sp" android:bottom="4sp" /> <stroke android:width="1dp" android:color="#FFFFFFFF"/> </shape> SHAPE5 <shape xmlns:android="http://schemas.android.com/apk/res/android" type="oval"> <gradient android:startColor="#FFFF0000" android:endColor="#80FF00FF" android:angle="270"/> <padding android:left="7dp" android:top="7dp" android:right="7dp" android:bottom="7dp" /> <corners android:radius="8dp" /> </shape>
Multiple Shapes SHAPE2<shape xmlns:android=“xxxxx"> <solid android:color="#FF0000FF"/> <stroke android:width="4dp" android:color="#FFFFFFFF" android:dashWidth="1dp" android:dashGap="2dp" /> <padding android:left="7dp" android:top="7dp" android:right="7dp" android:bottom="7dp" /> <corners android:radius="4dp" /> </shape> LINE <shape xmlns:android=“xxxx" type="line" > <solid android:color="#FF00FF00"/> <stroke android:width="1dp" android:color="#FFFFFFFF“ android:dashWidth="1dp" android:dashGap="2dp"/> <padding android:left="1dp" android:top="25dp" android:right="1dp" android:bottom="25dp"/> <size android:height="10dp"/> </shape>
Main Points (Frame Animation Example) • Bind resources to the ImageView. • Call the subclasses MyAnimationRoutine and MyAnimatinoRoutine2 which start and stop the Animation respectively. • MyAnimationRoutineextends TimerTask to allow for a wait time before it starts the animation. • MyAnimationRoutine2 extends TimerTask to allow for a wait time before it stops the animation from running.