バブルEditTextに連絡する

89

私はMultiAutoCompleteTextViewそれがGoogle+アプリでどのように実装されるかと同じように連絡先バブルを作成しようとしています。以下はスクリーンショットです。

Google+ Compose Postのスクリーンショット 。

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>

を含む私のActivityクラスでは、次のMulitAutoCompleteTextViewようにバブルスパンを設定します：

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);

ただし、文字列の最初の6文字の後ろに楕円形が表示される代わりに、文字は表示されず、背景に楕円形のドローアブルはありません。

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は表示されますが、スパンの一部である文字列内の文字は表示されません。カスタムシェイプドローアブルが背景に表示されている間に、スパン内の文字が前景に表示されるようにするにはどうすればよいですか？

ImageSpanサブクラス化の代わりにも使用しようとしましDynamicDrawableSpanたが、失敗しました。

android  android-edittext  drawable  html 
— toobsco42
ソース
— Peter O.
選択した連絡先番号を取得する方法
— スリハリ2013年
— john-salib

回答:

55

助けてくれて@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);

}
— toobsco42
ソース
13
スケーリングの問題により、すべてのデバイスでこれが機能しないことがわかりました。これを行うより良い方法は、convertViewからビットマップを返し、描画可能なエッジを設定するときに実際のビットマップのサイズを使用することです。たとえば、BitmapDrawable bd = new BitmapDrawable(bitmap); bd.setBounds(0,0,bitmap.getWidth(), bitmap.getHeight()); それはすべてのデバイスで機能します。
— dmon 2012
こんにちは、新しい質問でこれを投稿する必要があるかもしれませんが、複数行のTextViewで問題が発生したかどうかを知りたいと思っていました。私はこれをAndroid 3.2で実行していますが、「ときどき」、バブルの幅がうまく計算されていないようです。テキストと同じように、次の行に続きませんが、代わりにTextViewの外側で続行します。これを見たことがあるなら、何かヒントはありますか？
— Johann Hilbold、2012年
1
バブル付きのテキストの幅が広い場合、バブルよりもオートコンプリートが2行で2回作成されます。あなたはこれをtextViewに設定します：textView.setMaxWidth（this.getWidth（）-SOME_PADDING）; `また、私はこれも使用しています（テキストが大きすぎる場合は、2行でバブルになり、最後に...が付きます）： textView.setEllipsize（TruncateAt.END）; textView.setSingleLine（false）; textView.setMaxLines（2）;
— SocialError 2013
これは、ドロップダウンリストから選択して正常に機能します。場合、あなたがedittextにいくつかの事前定義された値を設定したい場合、その後、どのようにしてそのテキストをボーダーnクロスボタンでラップできますか？
— Braj 2013年
5
テキストを削除するためにテキストビューの別のアイテムにクリックリスナーを追加する方法。
— ナンビ2013年
21

ここにあなたのための完全なソリューションがあります

//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を使用したい場合は、ここに完全なプロジェクトファイルを示します 。

— クリシュナシュレスタ
ソース
1
おかげで...あなたの解決策はうまく機能しますが、私の問題は、追加ボタンを押したときにバブルテキストが編集テキストに追加されますが、編集テキストをクリアして再入力しようとすると（追加ボタンを押す）、以前に追加されたバブルが残っており、新しいものも追加されます。右側のクロスサインを押すとバブルも消えます。
— Govind Rathod 2012
最初の問題に対処しました。テキストをリストに保存し、テキストの編集をクリアしているときにクリアしなかったようです。私は正しくないかもしれませんが、コーディング方法を知らないので、それは推測にすぎません。
— クリシュナシュレスタ2012
古い投稿は知っていますが、質問に答える必要があります。上記と同じアプリケーションを作成しています。提案のためにMultiAutoCompleteTextViewを使用して、アイテムをクリックするとバブルが作成されます。バブルは正常に作成されますが、私の問題は、カーソルが2つのバブルの間に表示されないようにすることです... MultiAutoCompleteTextViewにスペーストークナイザーを使用しています。
— VijayRaj 2013
@chrishこのコードをありがとう、それでも私は一つ質問があります。私はすでにいくつかの値を持っている状況にあり、それらを編集可能なテキストにスパン可能なテキストとして直接貼り付けます。しかし、今、スパナブルプロジェクトのコードをこの種の機能と組み合わせることができるのかと思います。私は感謝..しかし、削除は、（1つずつ）いつものようにある、束に起こるかもしれない追加、実行時に削除名前を追加する機能を持つようにしたい
— kuldeep
5

私はあなたが探しているものを行うライブラリを手に入れました：

  • デフォルトまたは完全にカスタマイズ可能（独自のレイアウトを使用することもできます）
  • 複数行のサポート
  • クリックリスナー

こちらをご覧ください

ここでクイックスタート：

ChipViewをレイアウトに追加するか、プログラムで作成します。

<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は次のようにレンダリングされます。

デフォルトのChipView

ただし、全体からチップレベルまで自由にカスタマイズできます。

全体的なChipView カスタムChipView

これはマルチオートコンプリートではありませんが、なんとか模倣することができます（私は実際にそのように使用しています）

— プルミロンフォージ
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.