Feb 26, 2013

Android Chips EditText , Token EditText and Bubble EditText [Part 2]

Standard
Since I write first previous blog on Chips Edit Text, many developer ask me to make chips edit text as library so they can integrate easily in the project, so I develop Chips Edit Text as library.

Android Chips EditText , Token EditText and Bubble EditText - [Part 1]




Github url : https://github.com/kpbird/chips-edittext-library

Github as two sub folders namely 1. ChipsEditTextLibrary 2. ChipsEditTextDemo

How to use library ?

Step 1: Clone git repor or download zip file

Step 2: Import ChipsEditTextLibrary in your eclipse workspace

Step 3: Create new Android project

Step 4: Set ChipsEditTextLibrary as reference of your project


Right Click on Project -> Properties -> Android ->Add

Step 4: Open your xml layout file and add ChipsEditText control
 <com.kpbird.chipsedittextlibrary.ChipsMultiAutoCompleteTextview
        android:id="@+id/chipsMultiAutoCompleteTextview1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:ems="10"
        android:text="" >

        <requestFocus />
    </com.kpbird.chipsedittextlibrary.ChipsMultiAutoCompleteTextview>

Step 5: Open your Activity class and write following code. 


package com.kpbird.chipsedittextdemo;

import java.util.ArrayList;
import android.app.Activity;
import android.content.res.TypedArray;
import android.os.Bundle;
import android.util.Log;

import com.kpbird.chipsedittextlibrary.ChipsAdapter;
import com.kpbird.chipsedittextlibrary.ChipsItem;
import com.kpbird.chipsedittextlibrary.ChipsMultiAutoCompleteTextview;

public class MainActivity extends Activity {

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

  ChipsMultiAutoCompleteTextview ch = (ChipsMultiAutoCompleteTextview) findViewById(R.id.chipsMultiAutoCompleteTextview1);

  String[] countries = getResources().getStringArray(R.array.country);
  TypedArray imgs = getResources().obtainTypedArray(R.array.flags);

  ArrayList<ChipsItem> arrCountry = new ArrayList<ChipsItem>();

  for (int i = 0; i < countries.length; i++) {
   arrCountry.add(new ChipsItem(countries[i], imgs
     .getResourceId(i, -1)));
   Log.i("Main Activity", arrCountry.get(i).getTitle() + " = "
     + arrCountry.get(i).getImageid());
  }

  Log.i("MainActivity", "Array :" + arrCountry.size());

  ChipsAdapter chipsAdapter = new ChipsAdapter(this, arrCountry);
  ch.setAdapter(chipsAdapter);

 }

}

Step 6: You need to use ChipsItem and ChipsAdapter to provide data. ChipsItem has two field 1. Title and 2. Image Id (R.drawable.android), In above sample I have created two array in string.xml for title and images.






6 comments:

  1. Andrey1:20 PM

    Hi, this is a cool lib. It would be great if you could describe some view customization!

    ReplyDelete
  2. nmvictor7:54 PM

    Great Lib.

    ReplyDelete
  3. Roman4:28 PM

    How to make it remove whole token on backspace press?

    ReplyDelete
  4. Ameen Maheen10:44 AM

    works great

    ReplyDelete
  5. babloo12:13 PM

    Yea not working for me as well. Strange issues is its working in the example he has provided but not in my case!

    ReplyDelete
  6. kpbird9:53 AM

    hi,
    Please use following library

    Improved version
    http://blog.splitwise.com/2013/09/24/android-tokenized-auto-complete-a-new-splitwise-open-source-project/

    ReplyDelete