Sunday 2 June 2013

Add the Image into Edit Text Box and Text View




consider, your doing some chat Application, In Compose Image part we have  to add some smile images with Text in the Edit text box for this task I share the following code for complete this task.
Let consider we have kept all the smile image into the HashMap



private static final HashMap<String, Integer> smileicons= new HashMap<String, Integer>();
 static {
  smileicons.put("#_fi001.png", R.drawable._fi001);
  smileicons.put("#_fi002.png", R.drawable._fi002);
  smileicons.put("#_fi003.png", R.drawable._fi003);
  smileicons.put("#_fi004.png", R.drawable._fi004);
  smileicons.put("#_fi005.png", R.drawable._fi005);
  smileicons.put("#_fi006.png", R.drawable._fi006);
  smileicons.put("#_fi007.png", R.drawable._fi007);
  ....... 
        }; 


To add the Images into the Edit text box when the your click on the smile image

// icongridview is the GridView of the Smile Image box 
// messaage is the Edit Text  
public static Integer[] simleicons = { R.drawable._fi001,
   R.drawable._fi002, R.drawable._fi003, R.drawable._fi004}; 
icongridview.setOnItemClickListener(new OnItemClickListener() {
 @Override
 public void onItemClick(AdapterView<?> arg0, View arg1,
   final int arg2, long arg3) {
  ImageGetter imageGetter = new ImageGetter() {
   public Drawable getDrawable(String source) {
    Drawable d;
    d = getResources().getDrawable(smileicons[arg2]);
    d.setBounds(0, 0, 55, 53);
    return d;
   }
  };
  Spanned cs = null;
                cs = Html.fromHtml("<img src='" + "ImageName.png"
    + "'/>", imageGetter, null);
  int start = messaage.getSelectionStart();
  int end = messaage.getSelectionEnd();
  messaage.getText().replace(Math.min(start, end),
    Math.max(start, end), cs, 0, 1);
 }
 });

Save the Msg content and display Msg again in the Edit text

Get the Edit Text Message as the String 
// Save the Msg content by 
 private String get_msg() {
  String ms = Html.toHtml(messaage.getText());
  ms = ms.replace("<img src=\"", "");
  ms = ms.replace("\">", "");
  ms = Html.fromHtml(ms).toString();
  msg = ms.trim();
  return msg;
 }

Display the smile image from String Value

by calling ChatContentParser.getSmiledText(context,Context context, EditText messaage,String text) ;


public class ChatContentParser {

 public static void getSmiledText(final Context context, EditText messaage,
   String text) {
  Spanned cs = null;
  SpannableStringBuilder builder = new SpannableStringBuilder(text);
  messaage.setText(text);
  int index;
  int reduced_length = 0;
  for (index = 0; index < builder.length(); index++) {
   for (Entry<String, Integer> entry : smileicons.entrySet()) {
    int length = entry.getKey().length();
    if (index + length > builder.length())
     continue;
    if (builder.subSequence(index, index + length).toString()
      .equals(entry.getKey())) {
     ImageGetter imgGetter = get(context, entry.getValue());
     cs = Html.fromHtml("<img src='" + entry.getKey() + "'/>",
       imgGetter, null);
     messaage.getText().replace(index - reduced_length,
       index + length - reduced_length, cs, 0, 1);
     reduced_length += length - 1;
     break;
    }
   }
  }
 }

 private static ImageGetter get(final Context context, final int ImageID) {

  return new ImageGetter() {
   public Drawable getDrawable(String source) {
    Drawable d;
    d = context.getResources().getDrawable(ImageID);
    d.setBounds(0, 0, 55, 53);
    return d;
   }
  };
 }





1 comment:

  1. Hi Regu,

    can you please provide some sample application for this i am looking for an edit text with some images and save them to a file. i think your above approach will work for it Thanks.

    ReplyDelete

Disqus for Android