AndroidRichText 讓Textview輕松的支持富文本(圖像ImageSpan、點擊效果等等類似QQ微信聊天)

42933483 8年前發布 | 28K 次閱讀 TextView Android開發 移動開發

來自: http://www.cnblogs.com/luction/p/5158594.html

代碼地址:https://github.com/Luction/AndroidRichText

AndroidRichText幫助實現像QQ,微信一樣的,一個TextView里既有文字又有表情又有圖片的效果,采用插件化的框架,代碼簡單,可拓展性強。

基礎框架包只有四個java文件,

RichTextWrapper :TextView的包裹類,實現支持富文本,通過new RichTextWrapper(TextView v)來構造。
RTMovementMethod: 繼承自Android原生的LinkMovementMethod,重寫onTouchEvent方法,優化了ClickSpan(點擊響應的文字區域)的點擊響應。
Resolver:一個接口,我們需要實現一種支持富文本類型時就只需要寫一個相應的Resolver重寫它的resolve方法,在resolve方法里實現所要實現的富文本樣式。

RichTexts:一些公用方法、類、接口的集合。

接下來簡單介紹一下如何使用這個框架:</pre>

//直接根據TextView new一個RichTextWrapper,之后所有的事情都可以用它完成;
RichTextWrapper richTextWrapper = new RichTextWrapper((TextView) findViewById(R.id.tv_main));

//比如QQ希望在TextView里同時有表情和圖片那么就可以相應的寫兩個Resolver來實現分別的功能,直接在初始化時調用addResolver傳入就可以。 richTextWrapper.addResolver(ImageResolver.class,EmotionResolver.class);

//同時,我們如果希望點擊圖片時有響應事件,可以使用setOnRichTextListener來處理,參數要傳入對應的Resolver,這里是ImageResolver,如果我們需要自定義的XXResolver處理的富文本效果實現響應事件,那么久傳入XXResolver.class; richTextWrapper.setOnRichTextListener(ImageResolver.class, new RichTexts.RichTextClickListener() { @Override public void onRichTextClick(TextView v, String content) { //在這里可以進行圖片的點擊事件處理      //do something } });

//最后直接把文本set進去就可以 richTextWrapper.setText(content);</pre>

addResolver可以傳入任意個Resolver,讓TextView支持我們需要的富文本類型,如果需要取消支持某種富文本類型,只需要不傳入該Resolver比如上文中如果只需要支持表情,那么
richTextWrapper.addResolver(EmotionResolver.class);

不需要做太多代碼改動,比較靈活。

那么此外,大家可以看出來另一個關鍵的地方就是Resolver;Resolver是如何實現呢?這邊使用一個Demo來簡單示例:

public class ImageResolver implements Resolver {

public static final String IMG_MATCH_REGULAR = "\\[img](\\w+)\\[/img]";
public static Pattern PATTERN = Pattern.compile(IMG_MATCH_REGULAR);


//參數中的sp是該Textview的content,extra是方便我們使用的一個附加的數據,默認是空的,我們如果希望從外面傳入數據到這里面可以通過richTextWrapper.putExtra()來實現 @Override public void resolve(final TextView textView, final Spannable sp, SparseArray<Object> extra, final RichTexts.RichTextClickListener listener) { Matcher matcher = PATTERN.matcher(sp); final Context context = textView.getContext();

    while(matcher.find()){
        String content = matcher.group(1);
        final RichTexts.TaggedInfo info = new RichTexts.TaggedInfo(matcher.start(),matcher.end(),content);
        if(listener!=null) {
            RichTexts.RichTextClickSpan span = new RichTexts.RichTextClickSpan(listener,info.content);
            sp.setSpan(span, info.start, info.end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        }
        RichTexts.StickerSpan testSpan = new RichTexts.StickerSpan(context, R.drawable.icon,100,100);
        RichTexts.setImageSpan(sp, info, testSpan);
        textView.postInvalidate();
    }
}</pre> 

上面的示例中,RichTextClickSpan是大家如果需要實現點擊效果必須要用到的,而StickerSpan則是實現圖像效果,以上一個可點擊的圖像的Resolver就實現了,當然上文中是隨便傳入一個icon,真實情況,大家需要自己根據內容以及所期待的效果自己再做些調整。。

代碼地址: AndroidRichText源碼地址

</div>

 本文由用戶 42933483 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!