Scribd
Upload
420 views21 pages

Drawing and Working With Animation

Uploaded by

Dhavan Ravuri
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
420 views21 pages

Drawing and Working With Animation

Uploaded by

Dhavan Ravuri
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 21

Drawing in Android

Drawing in Android Development

In Android development, drawing allows


developers to create custom UI
components, shapes, text, and images.

Android provides multiple ways to handle


drawing operations, mainly using
Canvas, Paint, and SurfaceView.
Canvas class provides
methods to draw 2D
graphics such as shapes,
Canvas text and images
and Paint
classes Paint class defines color,
style, and effects for
drawing on a canvas.
Common Canvas Methods

Method Description
drawLine(x1, y1, x2, y2, paint) Draws a line
drawRect(left, top, right, bottom,
Draws a rectangle
paint)
drawCircle(cx, cy, radius, paint) Draws a circle
drawText(text, x, y, paint) Draws text
Draws a bitmap
drawBitmap(bitmap, x, y, paint)
(image)
Common Paint Properties

Property Description
Sets the color of
setColor(Color.RED)
drawing
setStyle(Paint.Style.FILL) Fills the shape
setStyle(Paint.Style.STROKE
Draws only the border
)
Sets the thickness of
setStrokeWidth(5)
lines
// Draw a line
canvas.drawLine(50, 50, 300, 50, paint);

// Draw a circle
canvas.drawCircle(200, 200, 100,
paint);

Example // Draw a rectangle


paint.setStyle(Paint.Style.STROKE);
canvas.drawRect(50, 300, 300, 500,
paint);

// Draw text
paint.setStyle(Paint.Style.FILL);
canvas.drawText("Hello, Canvas!", 50,
600, paint);
Bitmap scaledBitmap = Bitmap.createScaledBitmap(bitmap,
200, 200, true);
canvas.drawBitmap(scaledBitmap, 100, 100, null);

paint = new Paint();


paint.setColor(Color.BLUE);
paint.setStrokeWidth(5);
paint.setTextSize(50);
Working with Animation
Definition of Animation

Animation is the process of creating


motion and transformation effects to
enhance the user experience

Android provides various animation


APIs to move, fade, rotate, zoom, and
change properties of UI elements
dynamically.
Types of Animations
VIEW PROPERTY DRAWABLE TRANSITION
ANIMATIONS ANIMATIONS ANIMATIONS ANIMATIONS
(TWEEN (FRAME-BY-
ANIMATIONS) FRAME
ANIMATIONS)
View Animation

View Animations are the older animation system

It works only with UI elements

They are defined in XML or programmatically


using Java/Kotlin.
Types of View Animations

Animation Type Effect Best Use Case


AlphaAnimation Fades a view in or out Loading buttons, Pop-ups
Moves a view from one Sliding menu, Animating
TranslateAnimation
place to another images
Zoom-in effects,
ScaleAnimation Enlarges or shrinks a view
Emphasizing buttons
Refresh icons, Spinning
RotateAnimation Rotates a view
effects
Combines multiple UI enhancements, Fancy
AnimationSet
animations animations
<scale
android:fromXScale="0.5" <alpha
android:toXScale="1.5" android:fromAlpha="0.0"
android:fromYScale="0.5" android:toAlpha="1.0"
android:toYScale="1.5"
<rotate android:duration="1000"/>
android:duration="1000"/>
android:fromDegrees="0
"

android:toDegrees="360
"
android:pivotX="50%"
android:pivotY="50%"

android:duration="1000"
Property Animations were introduced in
Android API 11

It allows animating properties of objects


(like alpha, rotation, translationX).
Property
Animations
These animations provide better
flexibility and control over UI elements.

Uses ObjectAnimator, ValueAnimator, and


AnimatorSet classes
Examples:
Button button=findViewById(R.id.button);
ObjectAnimator
animator=ObjectAnimator.ofFloat(button,"translationX",0f,100f);
animator.setDuration(2000);
animator.start();
Button button=findViewById(R.id.button);
ObjectAnimator
animator=ObjectAnimator.ofInt(button,"backgroundColor", Color.RED);
animator.setDuration(2000);
animator.start();
Drawable Animations
• It is a frame-based animation where a sequence of
images (frames) are displayed rapidly to create an
animation effect.
• To create drawable animation, perform the following
steps
• Add images to res/drawable
• Create frame_animation.xml file and the following code
<animation-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="@drawable/frame1"
android:duration="100
Button button=findViewById(R.id.button);
ImageView rocketImage = findViewById(R.id.rocketImage);
rocketImage.setBackgroundResource(R.drawable.rocket_animation);

// Get the animation from the ImageView


AnimationDrawable rocketAnimation = (AnimationDrawable)
rocketImage.getBackground();
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
rocketAnimation.start(); // Start animation
}
});
Transition Animation
• Transition Animation in Android is used to create
smooth scene changes, such as switching between
activities, fragments, or UI components.
• It makes the app feel dynamic and fluid.

Transition Type Use Case


When switching between
Activity Transitions
activities
Fragment Transitions When replacing fragments
Animates a common view
Shared Element Transitions
between screens
Custom animations on UI
Example
• Create “anim” folder in res folder
• Create two XML file slide_right.xml and slide_left.xml and add
the following code
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="100%" android:toXDelta="0%"
android:duration="500"/>
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0%" android:toXDelta="-100%"
android:duration="500"/>
• Add the following code in MainActivity file
Button nextButton = findViewById(R.id.nextButton);
nextButton.setOnClickListener(new View.OnClickListener()
{ @Override
public void onClick(View v) {
Intent intent = new Intent(MainActivity.this,
SecondActivity.class); startActivity(intent);
overridePendingTransition(R.anim.slide_right,
R.anim.slide_left);
}
});

You might also like