Develop Reference

Animate ImageView's Bitmap Position

I have an ImageView with width = 1080 and height = 1920
I have a bitmap with width = 3340 and height = 1920
I set the scale type of the imageView to MATRIX. So that the bitmap is not scaled to the imageView
imageView.setScaleType(ImageView.ScaleType.MATRIX);
I would like to animate the bitmap from left to right and vice versa.
Is it possible to be done? Any thoughts?

please create following Custom view class into your project
package com.company.xyz;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
/**
* Created by rohitp on 12/10/2015.
*/
public class CustomImageView extends View {
Bitmap bm;
int x, y;
boolean flag = true;
public CustomImageView(Context context) {
super(context);
}
public CustomImageView(Context context, AttributeSet attrs) {
super(context, attrs);
try{
int src_resource = attrs.getAttributeResourceValue("http://schemas.android.com/apk/res/android", "src", 0);
bm = getDrawable(getResources(),src_resource);
}catch (Exception e){
}
}
public static Bitmap getDrawable(Resources res, int id){
return BitmapFactory.decodeResource(res, id);
}
public void setBm(Bitmap bm) {
this.bm = bm;
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
if(bm != null){
if(flag){
if (x < (getMeasuredWidth()-bm.getWidth())) {
x += 10;
Log.e("Custom",x+""+getMeasuredWidth());
}
else {
Log.e("Custom",x+" false");
flag = false;
}
}else{
if (x >0 ) {
x -= 10;
Log.e("Custom",x+" -");
}
else {
flag = true;
Log.e("Custom",x+" true");
}
}
canvas.drawBitmap(bm, x, y, new Paint());
}
invalidate();//calls this method again and again
}
}
create an layout xml with following
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<com.company.xyz.CustomImageView
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/animate_pic"
android:src="#drawable/test">
</com.company.xyz.CustomImageView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
And you can also change bitmap through code at runtime
((CustomImageView) findViewById(R.id.animate_pic)).setBm(bm)

As per an example in this link http://www.sanfoundry.com/java-android-program-animante-bitmap/ you need to move the image using canvas inside onDraw(). So, follow this link, may be this will help you. And let me know for any issues.

Android - Use a custom view class in my activity

I'm very new to Android development and trying to implement my own custom view which will allow me to use draw operations on a canvas. My custom view should draw a rectangle onto the screen in the onDraw() function, however it doesn't seem to work, no rectangle is drawn.
The very basic main activity that I'm trying to use the custom view with:
package com.example.testcanvas;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.os.Build;
public class MainActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
XML files for the activity, which I have tried to add the custom view to:
fragment main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.testcanvas.MainActivity$PlaceholderFragment" >
</RelativeLayout>
activity main.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.testcanvas.MainActivity"
tools:ignore="MergeRootFrame" >
<com.example.testcanvas.CustomView
android:layout_width="match_parent"
android:layout_height="200dp"
android:id="#+id/custom_view" />
</RelativeLayout>
and finally, my custom view class:
package com.example.testcanvas;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
public class CustomView extends SurfaceView implements SurfaceHolder.Callback {
public CustomView (Context context) {
super(context);
}
public CustomView (Context context, AttributeSet attrs) {
super(context);
}
#Override
public void onDraw (Canvas canvas) {
int dCenter = 40; //Distance from center in px, NOT in dp
int centerX = (int)(getWidth()/2);
int centerY = (int)(getHeight()/2);
Paint paint = new Paint();
paint.setColor(Color.BLUE); //The square will draw in the color blue now
Rect rect = new Rect(centerX-dCenter, centerY-dCenter, centerX+dCenter, centerY+dCenter);
canvas.drawRect(rect, paint);
}
#Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {}
#Override
public void surfaceCreated(SurfaceHolder holder) {
setWillNotDraw(false); //Allows us to use invalidate() to call onDraw()
postInvalidate();
}
#Override
public void surfaceDestroyed(SurfaceHolder holder) {}
}
Could anybody possibly point out where I've gone wrong? Thanks.

Android drawing just get a black view

I am following this tutorial: http://danielnadeau.blogspot.ca/2012/01/android-canvas-beginners-tutorial.html
When I look at things in the "Graphical Layout" tab in Eclipse, I see the expected result (a red square in the center of the display), but when I actually run the app, I just get a large black rectangle, and I can't seem to figure out why. I've searched some posts, but have not found an answer that seems to apply to my situation.
MainActivity.java
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
activity_mail.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<com.hintonworks.cantstop.CustomView
android:layout_width="match_parent"
android:layout_height="200dp"
android:id="#+id/my_view" />
</RelativeLayout>
CustomView.java
package com.hintonworks.cantstop;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
public class CustomView extends SurfaceView implements SurfaceHolder.Callback {
public CustomView (Context context) {
super(context);
}
public CustomView (Context context, AttributeSet attrs) {
super(context);
}
#Override
public void onDraw (Canvas canvas) {
int dCenter = 40; //Distance from center in px, NOT in dp
int centerX = (int)(getWidth()/2);
int centerY = (int)(getHeight()/2);
Paint paint = new Paint();
paint.setColor(Color.RED); //The square will draw in the color blue now
Rect rect = new Rect(centerX-dCenter, centerY-dCenter, centerX+dCenter, centerY+dCenter);
canvas.drawRect(rect, paint);
}
#Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {}
#Override
public void surfaceCreated(SurfaceHolder holder) {
setWillNotDraw(false); //Allows us to use invalidate() to call onDraw()
postInvalidate();
}
#Override
public void surfaceDestroyed(SurfaceHolder holder) {}
}
Thanks for any insight. This is my stab at using the canvas, until now I have been using drawable resources.

zoom in and out in viewpager in android

I have a View Pager to scroll the images.
Here i am using Image View to display images. I want to implement zoom in and zoom out functionality for images.
How can i implement this in android?

Try This. a Simple Way to Zoom your pictures
zooming.java
import android.app.Activity;
import android.os.Bundle;
public class zooming extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(new Zoom(this));
}
}
Zoom.java
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.Drawable;
import android.view.KeyEvent;
import android.view.View;
public class Zoom extends View {
private Drawable image;
private int zoomControler=20;
public Zoom(Context context)
{
super(context);
image=context.getResources().getDrawable(R.drawable.icon);
setFocusable(true);
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
//here u can control the width and height of the images........ this line is very important
image.setBounds((getWidth()/2)-zoomControler, (getHeight()/2)-zoomControler, (getWidth()/2)+zoomControler, (getHeight()/2)+zoomControler);
image.draw(canvas);
}
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if(keyCode==KeyEvent.KEYCODE_DPAD_UP)// zoom in
zoomControler+=10;
if(keyCode==KeyEvent.KEYCODE_DPAD_DOWN) // zoom out
zoomControler-=10;
if(zoomControler<10)
zoomControler=10;
invalidate();
return true;
}
}
Hope this would help.

How to draw lines over ImageView on Android?

I am trying to develop a simple map application, which will display a map in the screen.
When the user moves the cursor on screen, I want to display 2 perpendicular lines over my map. I had tried many examples to get an idea for that, but unfortunately, didn't succeed.
How can I make this?
And as one previous questionhere I had tried. but didn't get the answer. Can anyone guide me?
My main.xml is as following:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/main_imagemap"
android:src="#drawable/worldmap"
android:clickable="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
And my activity file(i had just started it..)
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
public class LineMapActivity extends Activity
{
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageView map_image = (ImageView)findViewById(R.id.main_imagemap);
}
}
And as in that link, i had also added MyImageView.
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.widget.ImageView;
public class MyImageView extends ImageView
{
public MyImageView(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
Paint p = new Paint(Paint.ANTI_ALIAS_FLAG);
canvas.drawLine(0, 0, 20, 20, p);
super.onDraw(canvas);
}
}
Now how can i add this MyImageView to my app?

Finally I figured out a solution. It's a simple program which draws a line over an Image.
Here is my main.xml file (com.ImageDraw.MyImageView is my custom view, code below):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.ImageDraw.MyImageView android:id="#+id/main_imagemap"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
And here is the main activity:
import android.app.Activity;
import android.os.Bundle;
public class MyActivity extends Activity
{
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
and this is my custom image view (MyImageView):
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
public class MyImageView extends SurfaceView implements SurfaceHolder.Callback
{
private CanvasThread canvasthread;
public MyImageView(Context context) {
super(context);
getHolder().addCallback(this);
canvasthread = new CanvasThread(getHolder(), this);
setFocusable(true);
}
public MyImageView(Context context, AttributeSet attrs)
{
super(context,attrs);
getHolder().addCallback(this);
canvasthread = new CanvasThread(getHolder(), this);
setFocusable(true);
}
protected void onDraw(Canvas canvas) {
Log.d("ondraw", "ondraw");
Paint p = new Paint();
Bitmap mapImg = BitmapFactory.decodeResource(getResources(), R.drawable.mybitmap);
canvas.drawColor(Color.BLACK);
canvas.drawBitmap(mapImg, 0, 0, null);
p.setColor(Color.RED);
canvas.drawLine(0, 0, 100, 100, p);
}
public void surfaceChanged(SurfaceHolder holder, int format, int width,
int height) {
}
public void surfaceCreated(SurfaceHolder holder) {
canvasthread.setRunning(true);
canvasthread.start();
}
public void surfaceDestroyed(SurfaceHolder holder) {
boolean retry = true;
canvasthread.setRunning(false);
while (retry)
{
try
{
canvasthread.join();
retry = false;
}
catch (InterruptedException e) {
// TODO: handle exception
}
}
}
}
And finally here is my CanvasThread:
import android.graphics.Canvas;
import android.view.SurfaceHolder;
public class CanvasThread extends Thread
{
private SurfaceHolder surfaceHolder;
private MyImageView myImageView;
private boolean run = false;
public CanvasThread(SurfaceHolder s, MyImageView m)
{
surfaceHolder = s;
myImageView = m;
}
public void setRunning(boolean r)
{
run = r;
}
public void run()
{
Canvas c;
while(run)
{
c=null;
try
{
c= surfaceHolder.lockCanvas(null);
synchronized (surfaceHolder) {
myImageView.onDraw(c);
}
}
finally
{
if(c!=null)
{
surfaceHolder.unlockCanvasAndPost(c);
}
}
}
}
}
You can find more details in this tutorial

Error you are getting because you are trying to casting ImageView object to MyImageView object.

Just fix the xml to include your object instead of an imageview like so (note that com.your.package.MyImageView should be the full package name of the package containing your class and then the class name)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.your.package.MyImageView android:id="#+id/main_imagemap"
android:src="#drawable/worldmap"
android:clickable="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>