联系泡泡EditText

我正在尝试在MultiAutoCompleteTextView创buildMultiAutoCompleteTextView Google+应用中的联系人泡泡。 以下是一个屏幕截图：

。

我试图扩展DynamicDrawableSpan类以便在一段文本的背景中获得一个可展开的绘图

 public class BubbleSpan extends DynamicDrawableSpan { private Context c; public BubbleSpan(Context context) { super(); c = context; } @Override public Drawable getDrawable() { Resources res = c.getResources(); Drawable d = res.getDrawable(R.drawable.oval); d.setBounds(0, 0, 100, 20); return d; } } 

我的oval.xml可绘制的定义如下：

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#352765"/> <padding android:left="7dp" android:top="7dp" android:right="7dp" android:bottom="7dp" /> <corners android:radius="6dp" /> </shape> 

在具有MulitAutoCompleteTextView Activity类中，我设置了如下所示的气泡跨度：

 final Editable e = tv.getEditableText(); final SpannableStringBuilder sb = new SpannableStringBuilder(); sb.append("some sample text"); sb.setSpan(new BubbleSpan(getApplicationContext()), 0, 6, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); e.append(sb); 

但是，string中的前六个字符后面显示的椭圆形不是椭圆形，而是字符不可见，并且在背景中没有椭圆形绘制。

如果我更改BubbleSpan的getDrawable（）方法来使用.png而不是可绘制的形状：

 public Drawable getDrawable() { Resources res = c.getResources(); Drawable d = res.getDrawable(android.R.drawable.bottom_bar); d.setBounds(0, 0, 100, 20); return d; } 

然后，这个.png会显示出来，但是这个string里的字符不会显示出来。 我怎样才能使这个跨度中的字符显示在前台，同时在后台显示一个自定义的形状drawable？

我试图也使用ImageSpan而不是ImageSpan DynamicDrawableSpan但不成功。

Answer 1

谢谢@chrish所有的帮助。 所以这里是我如何做到这一点：

 final SpannableStringBuilder sb = new SpannableStringBuilder(); TextView tv = createContactTextView(contactName); BitmapDrawable bd = (BitmapDrawable) convertViewToDrawable(tv); bd.setBounds(0, 0, bd.getIntrinsicWidth(),bd.getIntrinsicHeight()); sb.append(contactName + ","); sb.setSpan(new ImageSpan(bd), sb.length()-(contactName.length()+1), sb.length()-1,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); to_input.setText(sb); public TextView createContactTextView(String text){ //creating textview dynamically TextView tv = new TextView(this); tv.setText(text); tv.setTextSize(20); tv.setBackgroundResource(R.drawable.oval); tv.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.ic_clear_search_api_holo_light, 0); return tv; } public static Object convertViewToDrawable(View view) { int spec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED); view.measure(spec, spec); view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight()); Bitmap b = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888); Canvas c = new Canvas(b); c.translate(-view.getScrollX(), -view.getScrollY()); view.draw(c); view.setDrawingCacheEnabled(true); Bitmap cacheBmp = view.getDrawingCache(); Bitmap viewBmp = cacheBmp.copy(Bitmap.Config.ARGB_8888, true); view.destroyDrawingCache(); return new BitmapDrawable(viewBmp); } 

Answer 2

这是一个完整的解决scheme

 //creating textview dynamicalyy TextView textView=new TextView(context); textview.setText("Lauren amos"); textview.setbackgroundResource(r.color.urovalshape); textView.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.icon_cross, 0); BitmapDrawable dd = (BitmapDrawable) SmsUtil.getDrawableFromTExtView(textView); edittext.settext(addSmily(dd)); //convert image to spannableString public SpannableStringBuilder addSmily(Drawable dd) { dd.setBounds(0, 0, dd.getIntrinsicWidth(),dd.getIntrinsicHeight()); SpannableStringBuilder builder = new SpannableStringBuilder(); builder.append(":-)"); builder.setSpan(new ImageSpan(dd), builder.length() - ":-)".length(),builder.length(),Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); return builder; } //convert view to drawable public static Object getDrawableFromTExtView(View view) { int spec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED); view.measure(spec, spec); view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight()); Bitmap b = Bitmap.createBitmap(view.getWidth(), view.getHeight(), Bitmap.Config.ARGB_8888); Canvas c = new Canvas(b); c.translate(-view.getScrollX(), -view.getScrollY()); view.draw(c); view.setDrawingCacheEnabled(true); Bitmap cacheBmp = view.getDrawingCache(); Bitmap viewBmp = cacheBmp.copy(Bitmap.Config.ARGB_8888, true); view.destroyDrawingCache(); return new BitmapDrawable(viewBmp); } 

这里是完整的项目文件，如果你想使用Spannble

Answer 3

我有一个图书馆，做你正在寻找与：

• 默认或完全可定制（你甚至可以使用自己的布局）
• 多线支持
• 点击侦听器

看看这里

这里快速入门：

将ChipView添加到您的布局或以编程方式创build它：

 <com.plumillonforge.android.chipview.ChipView android:id="@+id/chipview" android:layout_width="match_parent" android:layout_height="wrap_content" /> 

用扩展抽象芯片和点击监听器的数据列表来初始化它（如果你想的话）：

 List<Chip> chipList = new ArrayList<>(); chipList.add(new Tag("Lorem")); chipList.add(new Tag("Ipsum dolor")); chipList.add(new Tag("Sit amet")); chipList.add(new Tag("Consectetur")); chipList.add(new Tag("adipiscing elit")); ChipView chipDefault = (ChipView) findViewById(R.id.chipview); chipDefault.setChipList(chipList); chipDefault.setOnChipClickListener(new OnChipClickListener() { @Override public void onChipClick(Chip chip) { // Action here ! } }); 

默认ChipView呈现如下：

但是你可以从整体到芯片级别进行自定义：

这不是一个MultiAutocomplete，但你可以设法模仿它（我实际上是这样使用它）