Signature Capture or sign on glass in android

Signature Capture or sign on glass in android:

I am showing implementation of a functionality that is use to capture signature in android. This is generally used in application where user has to do signature like a banking application, logistic delivery, insurance etc.

For capture signature we have to take signature using canvas and save the same in bitmap /.png format to further use.

Here I am explaining only two activities one is main activity and second for capture signature. This two classes can be used in any project. User needs to modify their Layout according to their requirement.  

1)      Create an activity with the signature button and an image view to show signature. From this activity we starts capture activity to click on signature button.

Here the main activity xml code:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <Button

        android:id="@+id/sign"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_gravity="center"

        android:text="Signature" />

    <ImageView

        android:id="@+id/signView"

        android:layout_width="300dp"

        android:layout_height="300dp"

        android:layout_gravity="center"

        android:src="@drawable/ic_launcher" />

</LinearLayout>

Here the main activity code:

MainActivity.java

package com.capturesignature;

import com.example.capturesignature.R;

import android.app.Activity;

import android.content.Intent;

import android.graphics.Bitmap;

import android.graphics.BitmapFactory;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

import android.widget.ImageView;

public class MainActivity extends Activity {

    Button sign;

    ImageView signView;

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        sign = (Button) findViewById(R.id.sign);

        signView = (ImageView) findViewById(R.id.signView);

        sign.setOnClickListener(onButtonClick);

    }

    Button.OnClickListener onButtonClick = new Button.OnClickListener() {

        @Override

        public void onClick(View v) {

            // TODO Auto-generated method stub

            Intent i = new Intent(MainActivity.this, CaptureSignature.class);

            startActivityForResult(i, 0);

        }

    };

    @Override

    protected void onActivityResult(int requestCode, int resultCode, Intent data) {

        // TODO Auto-generated method stub

        if (resultCode == 1) {

            Bitmap b = BitmapFactory.decodeByteArray(

                    data.getByteArrayExtra("byteArray"), 0,

                    data.getByteArrayExtra("byteArray").length);

            signView.setImageBitmap(b);

        }

    }

}

2)      CaptureSignature activity that start from main activity and we can capture signature and save signature on this activity.

Here the signature activity xml code:

capturesignature.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_gravity="center"

        android:orientation="horizontal" >

        <Button

            android:id="@+id/clear"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="Clear" />

        <Button

            android:id="@+id/save"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="save" />

    </LinearLayout>

    <LinearLayout

        android:id="@+id/signatureView"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent" >

    </LinearLayout>

</LinearLayout>

Here the CaptureSignature activity code:

CaptureSignature.java

package com.capturesignature;

import java.io.ByteArrayOutputStream;

import com.example.capturesignature.R;

import android.app.Activity;

import android.content.Context;

import android.content.Intent;

import android.graphics.Bitmap;

import android.graphics.Canvas;

import android.graphics.Color;

import android.graphics.Paint;

import android.graphics.Path;

import android.graphics.RectF;

import android.graphics.drawable.Drawable;

import android.os.Bundle;

import android.util.AttributeSet;

import android.view.MotionEvent;

import android.view.View;

import android.widget.Button;

import android.widget.LinearLayout;

public class CaptureSignature extends Activity {

    signature mSignature;

    Paint paint;

    LinearLayout signatureView;

    Button clear, save;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        // TODO Auto-generated method stub

        super.onCreate(savedInstanceState);

        setContentView(R.layout.capturesignature);

        save = (Button) findViewById(R.id.save);

        save.setEnabled(false);

        clear = (Button) findViewById(R.id.clear);

        signatureView = (LinearLayout) findViewById(R.id.signatureView);

        mSignature = new signature(this, null);

        signatureView.addView(mSignature);

        save.setOnClickListener(onButtonClick);

        clear.setOnClickListener(onButtonClick);

    }

    Button.OnClickListener onButtonClick = new Button.OnClickListener() {

        @Override

        public void onClick(View v) {

            // TODO Auto-generated method stub

            if (v == clear) {

                mSignature.clear();

            } else if (v == save) {

                mSignature.save();

            }

        }

    };

    public class signature extends View {

        static final float STROKE_WIDTH = 10f;

        static final float HALF_STROKE_WIDTH = STROKE_WIDTH / 2;

        Paint paint = new Paint();

        Path path = new Path();

        float lastTouchX;

        float lastTouchY;

        final RectF dirtyRect = new RectF();

        public signature(Context context, AttributeSet attrs) {

            super(context, attrs);

            paint.setAntiAlias(true);

            paint.setColor(Color.BLACK);

            paint.setStyle(Paint.Style.STROKE);

            paint.setStrokeJoin(Paint.Join.ROUND);

            paint.setStrokeWidth(STROKE_WIDTH);

        }

        public void clear() {

            path.reset();

            invalidate();

            save.setEnabled(false);

        }

        public void save() {

            Bitmap returnedBitmap = Bitmap.createBitmap(signatureView.getWidth(),

                                signatureView.getHeight(), Bitmap.Config.ARGB_8888);

            Canvas canvas = new Canvas(returnedBitmap);

            Drawable bgDrawable = signatureView.getBackground();

            if (bgDrawable != null)

                bgDrawable.draw(canvas);

            else

                canvas.drawColor(Color.WHITE);

            signatureView.draw(canvas);

            ByteArrayOutputStream bs = new ByteArrayOutputStream();

            returnedBitmap.compress(Bitmap.CompressFormat.PNG, 50, bs);

            Intent intent = new Intent();

            intent.putExtra("byteArray", bs.toByteArray());

            setResult(1, intent);

            finish();

        }

        @Override

        protected void onDraw(Canvas canvas) {

            // TODO Auto-generated method stub

            canvas.drawPath(path, paint);

        }

        @Override

        public boolean onTouchEvent(MotionEvent event) {

            float eventX = event.getX();

            float eventY = event.getY();

            save.setEnabled(true);

            switch (event.getAction()) {

            case MotionEvent.ACTION_DOWN:

                path.moveTo(eventX, eventY);

                lastTouchX = eventX;

                lastTouchY = eventY;

                return true;

            case MotionEvent.ACTION_MOVE:

            case MotionEvent.ACTION_UP:

                resetDirtyRect(eventX, eventY);

                int historySize = event.getHistorySize();

                for (int i = 0; i < historySize; i++) {

                    float historicalX = event.getHistoricalX(i);

                    float historicalY = event.getHistoricalY(i);

                    path.lineTo(historicalX, historicalY);

                }

                path.lineTo(eventX, eventY);

                break;

            }

            invalidate((int) (dirtyRect.left - HALF_STROKE_WIDTH),

                    (int) (dirtyRect.top - HALF_STROKE_WIDTH),

                    (int) (dirtyRect.right + HALF_STROKE_WIDTH),

                    (int) (dirtyRect.bottom + HALF_STROKE_WIDTH));

            lastTouchX = eventX;

            lastTouchY = eventY;

            return true;

        }

        private void resetDirtyRect(float eventX, float eventY) {

            dirtyRect.left = Math.min(lastTouchX, eventX);

            dirtyRect.right = Math.max(lastTouchX, eventX);

            dirtyRect.top = Math.min(lastTouchY, eventY);

            dirtyRect.bottom = Math.max(lastTouchY, eventY);

        }

    }

}

This two activity classes can be copied in any project for use same source .