Spannable で文字のマークアップ

Spannable はテキストをマークアップするためのインターフェースです

CharacterStyleなどのクラスを使って文字列の一部を
下線を引いたり、下付き文字にしたり、
上付き文字にしたり、URLを付けたり...
と様々なことができます

CharacterStyle のサブクラスには
  • UnderlineSpan
  • SubscriptSpan
  • SuperscriptSpan
  • URLSpan
  • ScaleXSpan
  • RelativeSizeSpan
  • etc...
といろいろあります

というわけで, Spannable でテキストをいじってみた

サンプルプログラム
import android.app.Activity;
import android.os.Bundle;
import android.text.Spannable;
import android.text.Spannable.Factory;
import android.text.style.RelativeSizeSpan;
import android.text.style.ScaleXSpan;
import android.text.style.SubscriptSpan;
import android.text.style.SuperscriptSpan;
import android.text.style.URLSpan;
import android.text.style.UnderlineSpan;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;

public class SpannableTest extends Activity {
  Spannable spannable;

  UnderlineSpan underline;
  SubscriptSpan subscript;
  SuperscriptSpan superscript;
  URLSpan url;
  ScaleXSpan scaleX;
  RelativeSizeSpan relative;

  TextView textView[];

  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.spannabletest);

    textView = new TextView[4];
    for (int i = 0; i < 4; i++) {
      textView[i] = (TextView) findViewById(R.id.TextView01 + i);
    }

    // UnderlineSpan
    underline = new UnderlineSpan();
    // SubscriptSpan
    subscript = new SubscriptSpan();
    // SuperscriptSpan
    superscript = new SuperscriptSpan();
    // URLSpan
    url = new URLSpan("http://weide-dev.blogspot.com/");
    // ScaleXSpan
    scaleX = new ScaleXSpan(0.5f);
    // RelativeSizeSpan
    relative = new RelativeSizeSpan(0.5f);

    // Factory の取得
    Factory factory = Spannable.Factory.getInstance();

    /* アンダーラインが引かれた文字列 */
    // Spannable の取得
    spannable = factory.newSpannable(textView[0].getText());
    // 0からテキストの長さ分まで下線を引く
    spannable.setSpan(
        underline,
        0,
        textView[0].getText().length(),
        spannable.getSpanFlags(underline)
    );
    // TextView にテキストを設定
    textView[0].setText(spannable, TextView.BufferType.SPANNABLE);

    /* 後ろ4文字が下付きの文字列 */
    spannable = factory.newSpannable(textView[1].getText());
    // 後ろ4文字を下付き文字にする
    spannable.setSpan(
        subscript,
        textView[1].getText().length() - 4,
        textView[1].getText().length(),
        spannable.getSpanFlags(subscript)
    );
    // 後ろ4文字のXのスケールを0.5倍する
    spannable.setSpan(
        scaleX,
        textView[1].getText().length() - 4,
        textView[1].getText().length(),
        spannable.getSpanFlags(scaleX)
    );
    textView[1].setText(spannable, TextView.BufferType.SPANNABLE);

    /* 後ろ4文字が上付きの文字列 */
    spannable = factory.newSpannable(textView[2].getText());
    // 後ろ4文字を上付き文字にする
    spannable.setSpan(
        superscript,
        textView[2].getText().length() - 4,
        textView[2].getText().length(),
        spannable.getSpanFlags(superscript)
    );
    // 後ろ4文字のサイズを0.5倍する
    spannable.setSpan(
        relative,
        textView[2].getText().length() - 4,
        textView[2].getText().length(),
        spannable.getSpanFlags(relative)
    );
    textView[2].setText(spannable, TextView.BufferType.SPANNABLE);

    /* URL文字列 */
    spannable = factory.newSpannable(textView[3].getText());
    // 0からテキストの長さ分までURLタイプにする
    spannable.setSpan(
        url,
        0,
        textView[3].getText().length(),
        spannable.getSpanFlags(url)
    );
    textView[3].setText(spannable, TextView.BufferType.SPANNABLE);
    textView[3].setOnClickListener(new OnClickListener() {
      public void onClick(View v) {
        // URLを開く
        url.onClick(textView[3]);
      }
    });
  }
}
プログラムを実行すると...


こんな感じ!


参考サイト
http://developer.android.com/intl/ja/reference/android/text/Spannable.html
http://developer.android.com/intl/ja/reference/android/text/style/CharacterStyle.html

1 件のコメント: