Card Scanner

You can add a card scanning solution to your application by adding Card.io adapter. This module is for adapting Card.io SDK with VGS Collect Android SDK. It provides a fast and easy way to scan payment cards and import them to VGS Collect.

Integration with VGS Collect SDK

To use the scanner in your project you just need to add the following line of dependency in your app gradle file.

Note

It is critically not to forget to import VGS Collect as well.

If you’re not familiar with VGS Collect Android SDK we highly recommend starting from our integration documentation and follow steps in the guideline.

dependencies {
    implementation 'com.verygoodsecurity:adapter-cardio:1.0.0'
}

Configure Your App

First of all, don’t forget to add Button to R.layout.activity_main layout file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="16dp">
    <com.verygoodsecurity.vgscollect.widget.VGSCardNumberEditText
        android:id="@+id/cardNumberField"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:numberDivider="-"
        app:fieldName="cardNumber"
        app:hint="Card number"
        app:cardBrandIconGravity="end"/>
    <Button
        android:id="@+id/scanBtn"
        android:text="Scan"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
</LinearLayout>

Then, attach it to VGSCollect, otherwise VGSCollect doesn’t know how to send data to the input field.

import com.verygoodsecurity.vgscollect.core.Environment
import com.verygoodsecurity.vgscollect.core.VGSCollect
import com.verygoodsecurity.vgscollect.widget.VGSCardNumberEditText

class MainActivity : AppCompatActivity() {
    private val vgsForm = VGSCollect("<vault_id>", Environment.SANDBOX)

    private lateinit var cardNumberField: VGSCardNumberEditText

    override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        cardNumberField = findViewById(R.id.cardNumberField)
        vgsForm.bindView(cardNumberField)

        val scanBtn = findViewById<Button>(R.id.scanBtn)
    }

    override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
        super.onActivityResult(requestCode, resultCode, data)
    }
}
import com.verygoodsecurity.vgscollect.core.Environment;
import com.verygoodsecurity.vgscollect.core.VGSCollect;
import com.verygoodsecurity.vgscollect.widget.VGSCardNumberEditText;

public class MainActivity extends Activity {
    private VGSCollect vgsForm = new VGSCollect( "<vault_id>", Environment.SANDBOX);
    private VGSCardNumberEditText cardNumberField;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main)

        cardNumberField = findViewById(R.id.cardNumberField);
        vgsForm.bindView(cardNumberField);

        Button scanBtn = findViewById(R.id.scanBtn);
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
    }
}

VGS Collect would automatically import received data into your input fields. For this you need to link fields with incoming data. Please, use the field name to notify VGSCollect which type of incoming data he should apply on it.

At the current moment available CARD_NUMBER, CARD_CVC, CARD_HOLDER, CARD_EXP_DATE, POSTAL_CODE types. All of them supported by the last version of Card.io.

Note

If you have not set it up, the VGSCollect won’t receive results of scanning.

val scanSettings = hashMapOf<String?, Int>().apply {
    String numberKey = cardNumberField?.getFieldName()
    this[numberKey] = ScanActivity.CARD_NUMBER
}
HashMap<String, Integer> scanSettings = new HashMap<>();
String numberKey = cardNumberField.getFieldName();
scanSettings.put(numberKey, ScanActivity.CARD_NUMBER);

To start scanning, you need to create a ScanActivity intent and get the results via the onActivityResult method.

import com.verygoodsecurity.vgscollect.core.Environment
import com.verygoodsecurity.vgscollect.core.VGSCollect
import com.verygoodsecurity.api.cardio.ScanActivity
import com.verygoodsecurity.vgscollect.widget.VGSCardNumberEditText

class MainActivity : AppCompatActivity() {
    companion object {
        const val USER_SCAN_REQUEST_CODE = 0x7
    }

    private val vgsForm = VGSCollect("<vault_id>", Environment.SANDBOX)

    private lateinit var cardNumberField: VGSCardNumberEditText

    override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        cardNumberField = findViewById(R.id.cardNumberField)
        vgsForm.bindView(cardNumberField)

        val scanBtn = findViewById<Button>(R.id.scanBtn)
        scanBtn?.setOnClickListener { scanData() }

    }

    private fun scanData() {
        val scanSettings = hashMapOf<String?, Int>().apply {
            String numberKey = cardNumberField?.getFieldName()
            this[numberKey] = ScanActivity.CARD_NUMBER
        }

        val intent = Intent(this, ScanActivity::class.java)
        intent.putExtra(ScanActivity.SCAN_CONFIGURATION, scanSettings)

        startActivityForResult(intent, USER_SCAN_REQUEST_CODE)
    }

    override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
        super.onActivityResult(requestCode, resultCode, data)
        vgsForm.onActivityResult(requestCode, resultCode, data)
    }
}
import com.verygoodsecurity.vgscollect.core.Environment;
import com.verygoodsecurity.vgscollect.core.VGSCollect;
import com.verygoodsecurity.api.cardio.ScanActivity;
import com.verygoodsecurity.vgscollect.widget.VGSCardNumberEditText;

public class MainActivity extends Activity {
    private final static int USER_SCAN_REQUEST_CODE = 0x7;

    private VGSCollect vgsForm = new VGSCollect( "<vault_id>", Environment.SANDBOX);
    private VGSCardNumberEditText cardNumberField;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main)

        cardNumberField = findViewById(R.id.cardNumberField);
        vgsForm.bindView(cardNumberField);

        Button scanBtn = findViewById(R.id.scanBtn);
        scanBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                scanData();
            }
        });
    }

    protected void scanData() {
        HashMap<String, Integer> scanSettings = new HashMap<>();
        String numberKey = cardNumberField.getFieldName();
        scanSettings.put(numberKey, ScanActivity.CARD_NUMBER);

        Intent intent = new Intent(this, ScanActivity.class);
        intent.putExtra(ScanActivity.SCAN_CONFIGURATION, scanSettings);

        startActivityForResult(intent, USER_SCAN_REQUEST_CODE);
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        vgsForm.onActivityResult(requestCode, resultCode, data);
    }
}