5

I am trying to insert a textview inside a Edittext as in below

enter image description here

can anyone pls give me ideas about how to implement it or something.

thanks :)

update: the textviews in the edittext will vary dynamically.

kAnNaN
  • 3,669
  • 4
  • 28
  • 39
  • That doesnt look like a simpletextview inside a edittext.. Its a `PopupWindow` kind of view – Ron May 19 '12 at 10:41

4 Answers4

3

Try this sample code. It fits your requirement.

PopupWindow pw = new PopupWindow(
                                 this.getViewInflate().inflate(R.layout.pw_layout, 
                                                               null, true, null), 
                                100,100,true);
// display the popup in the center
pw.showAtLocation(layout, Gravity.CENTER, 0, 0);
pw.update(20,20,100,100);

For the views inside EditText part, you 'll have to extend the EditText. Overview of how it should look is as follows.

class emailEditText extends EditText {

List<NamePhotoView> ViewlistOfSelectedContacts; // create new

    void addContact(String name, Bitmap photo) {
       // create a new 'NamePhotoView' and add to the ViewlistOfSelectedContacts
    }

    @Override
    void onDraw(Canvas canvas) {
        for (....) {
            // draw all views from the list. left to right.
        }
    // you have to some how offset the text start coordinate. then call super
    super.onDraw(canvas);
    }
}
Ron
  • 24,175
  • 8
  • 56
  • 97
  • the above code is ok for the popup box. but what can should i do to get those textviews "kanna" and "susse" in the edittext "To" ?? – kAnNaN May 19 '12 at 11:37
2

I think you cannot set TextView inside EditText. But alternatively you can make it look that way. Here are the steps

  1. convert textview to BitmapDrawable
  2. convert bitmap drawable into SpanableString (ImageSpan)
  3. then set this returned SpannableString to your EditText

I have recently completed this kind of ui and i have explained in my blog Making GoSmsPro/Evernote like EditText

Krishna Shrestha
  • 1,662
  • 14
  • 38
  • i am using your code in one my my project but i am getting some problem and not getting any solution.... can you take a look at it give me some hint http://stackoverflow.com/questions/20780685/how-set-margin-between-spannable-textview – Sandip Armal Patil Dec 28 '13 at 08:58
2

The way Android implements it, the so called Chips UI, can be found here.
Essentially it's a custom span that draws the components (image, text, etc.) over the text, plus some logic to show the popup.

Takhion
  • 2,706
  • 24
  • 30
1

you can create a component based on what you need like you mentioned above with frame layout. You may have a FrameLayout or RelativeLayout with two views such as EditText and TextView while text view is on top of EditText. also you can put image view if you want in right like your picture.

Although you don't need to create a component and easily you can do this in your XML layout, if you have plan to use it regularly through your application it is good practice to create those views as a component.

Hesam
  • 52,260
  • 74
  • 224
  • 365
  • if possible can u give me an example or any link which i might refer to. – kAnNaN May 19 '12 at 11:34
  • You can refer to: 1) http://developer.android.com/guide/topics/ui/custom-components.html 2) http://developer.android.com/resources/articles/layout-tricks-reuse.html – Hesam May 20 '12 at 09:32
  • And Practical one: http://thiranjith.com/2011/07/15/actionbar-design-pattern-example-for-android/ Although this topic is related to Action bar design, you can get idea how to create reusable component based on. – Hesam May 20 '12 at 09:36