android:使用TextView实现网页图文混排效果

2015年12月25日 Android 6条评论 阅读6444次

android:使用TextView实现网页图文混排效果


新闻资讯问答博客等类型的网站在web中就表现出很丰富的现实效果,比如图片文字混合等。因此,此类网站在其对应的APP页面中,也应该是很友好的展示出图文混排效果。


在AndroidAPP中实现图文混排效果有多种办法,本文介绍的是使用TextView来实现图文混排效果


  1. 想实现网页那种图文混排,则首先要获取原来的HTML源码,这是属于网络请求接口返回的内容。

  2. 得到了原始网页的HTML,可以调用android.text.Html的如下方法
    public static Spanned fromHtml(String source, ImageGetter imageGetter, TagHandler tagHandler)
    从而得到Spanned对象

  3. 在android.widget.TextView源码中,有如下设置Text的方法
    public final void setText(CharSequence text)

  4. android.text.Spanned有如下的定义
    public interface Spanned extends CharSequence

  5. 根据3和4点可以知道调用TextView#setText(Spanned)就可以看到预期的效果

private TextView mTextView;
ImageGetter imgGetter = new Html.ImageGetter() {
    @Override
    public Drawable getDrawable(String source) {
        Drawable drawable = null;
        URL url;
        try {
            url = new URL(source);
            drawable = Drawable.createFromStream(url.openStream(), "");
        } catch (MalformedURLException e) {
            L.e("MalformedURLException: " + source, e);
        } catch (IOException e) {
            L.e("IOException: " + source, e);
        }
        if (drawable != null) {
            drawable.setBounds(0, 0, drawable.getIntrinsicWidth(),
                    drawable.getIntrinsicHeight());
        }
        return drawable;
    }
};
private Spanned getSpanedText(String originalHtmlTxt) {
    Spanned result = Html.fromHtml(originalHtmlTxt);
    int length = result.length();
    ImageSpan[] imgSpans = result.getSpans(0, length, ImageSpan.class);
    for (int i = 0; i < imgSpans.length; i++) {
        ImageSpan is = imgSpans[i];
        Class<ImageSpan> clz = ImageSpan.class;
        try {
            Field field = clz.getDeclaredField("mDrawable");
            field.setAccessible(true);
            field.set(is, mTextView.getContext().getResources()
                .getDrawable(R.drawable.ic_img_not_ready));
        } catch (NoSuchFieldException e) {
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (IllegalArgumentException e) {
            e.printStackTrace();
        } catch (NotFoundException e) {
            e.printStackTrace();
        }
    }
    result = Html.fromHtml(originalHtmlTxt, imgGetter, null);
    return result;
}
mTextView.setText(result);



最后说明的是getSpanedText()因为涉及网络图片读取,所以要放到子线程中异步处理。

至此,android:使用TextView实现新闻博客资讯等网页图文混排效果的介绍就结束了。
以后会继续分享用其他方法实现新闻博客资讯等APP中地网页图文混排效果。

分享本文至:

WRITTEN BY

avatar
本文标签:TextView
看了本文是不是觉得很赞,那就赶紧点击下面按钮分享给身边的朋友吧!

6 条评论

  1. avatar djhomeimprove

    <a href="http://www.swingergroup.com/adidas-projoator-incurza-trx-zapatosj">adidas projoator incurza trx</a> <a href="http://www.bluelakebooks.com/air-jordan-6-infrarouge-23-for-vente-chaussuresa">air jordan 6 infrarouge 23 for vente</a> <a href="http://www.lideresworld.com/salomon-sko-rosa-gr%C3%A5-foota">salomon sko rosa gr氓</a> <a href="http://www.navixstream.com/nike-pegasus-32-mujeres-azul-yeti-runningd">nike pegasus 32 mujeres azul yeti</a> <a href="http://www.clarinblogs.com/nashville-predators-subban-jersey-nflh">nashville predators subban jersey</a> <a href="http://www.telecomcierge.com/nike-air-max-90-blanco-amarillo-zapatosh">nike air max 90 blanco amarillo</a>
    djhomeimprove http://www.djhomeimprove.com/

  2. avatar bibleofpeace

    <a href="http://www.tipicousa.com/nike-flyknit-lunar-3-herre-s%C3%B8lv-skoa">nike flyknit lunar 3 herre s酶lv</a> <a href="http://www.reprebates.com/the-hermes-scarf-book-scarfr">the hermes scarf book</a> <a href="http://www.goeaglepointe.com/grey-mens-nike-roshe-yeezy-boost-shoes-sneakere">grey mens nike roshe yeezy boost shoes</a> <a href="http://www.ykloans.com/nike-mercurical-victory-vi-tf-purple-orange-black-soccer-cleats-shoesa">nike mercurical victory vi tf purple orange black soccer cleats</a> <a href="http://www.servicioswom.com/oakley-holbrook-sunglasses-clear-sunglassesr">oakley holbrook sunglasses clear</a> <a href="http://www.drlunaworld.com/ralph-lauren-yarmouth-shirt-size-guide-quiz-test-polod">ralph lauren yarmouth shirt size guide quiz test</a>
    bibleofpeace http://www.bibleofpeace.com/

  3. avatar ndrsracing

    <a href="http://www.ciaodearborn.com/nike-air-max-90-premium-tape-wei%C3%9F-kurpesb">nike air max 90 premium tape wei脽</a> <a href="http://www.ilrione.com/nike-air-max-90-premium-em-mujer-azul-rosado-zapatosk">nike air max 90 premium em mujer azul rosado</a> <a href="http://www.bmthtaxis.com/nike-free-orbit-ii-acheter-runningc">nike free orbit ii acheter</a> <a href="http://www.delmotkrt.com/hombres-adidas-nmd-runner-rojo-zapatosj">hombres adidas nmd runner rojo</a> <a href="http://www.emutemusic.com/nike-air-max-2014-gym-r%C3%B8d-chaussuresa">nike air max 2014 gym r酶d</a> <a href="http://www.kinofrost.com/adidas-originals-zx-700-marron-rouge-bleu-foota">adidas originals zx 700 marron rouge bleu</a>
    ndrsracing http://www.ndrsracing.com/

  4. avatar vxrdriversclub

    <a href="http://www.txmed.net/air-max-2017-triple-svart-ops-3-butya">air max 2017 triple svart ops 3</a> <a href="http://www.ukpubs.net/flyknit-trainer-orange-bl%C3%A5-envelope-obuvd">flyknit trainer orange bl氓 envelope</a> <a href="http://www.uniquewebsitedesign.net/nike-maschio-free-flyknit-4.0-in-esecuzione-scarpe-you-tube-scarpec">nike maschio free flyknit 4.0 in esecuzione scarpe you tube</a> <a href="http://www.unratedperez.net/adidas-porsche-design-iii-cielo-blu-schuhef">adidas porsche design iii cielo blu</a> <a href="http://www.urbanintelligence.net/adidas-protator-wide-fit-rugby-boots-scarpef">adidas protator wide fit rugby boots</a> <a href="http://www.utsweb.net/asics-gel-sendai-2-oransje-svart-scarpeg">asics gel sendai 2 oransje svart</a>
    vxrdriversclub http://www.vxrdriversclub.net/

  5. avatar motorzgirl

    <a href="http://www.randygageteam.com/maschio-nike-air-max-rosa-scarpek">maschio nike air max rosa</a> <a href="http://www.newlouisbag.com/black-glitter-converse-uk-shoesi">black glitter converse uk</a> <a href="http://www.thebrandiac.com/hombres-nike-air-force-1-low-jeremy-lin-zapatosi">hombres nike air force 1 low jeremy lin</a> <a href="http://www.isisprojectsa.com/herre-nike-kyrie-4-lyser%C3%B8d-skoh">herre nike kyrie 4 lyser酶d</a> <a href="http://www.linnwoodpark.com/nike-air-zoom-structure-20-nero-scarpei">nike air zoom structure 20 nero</a> <a href="http://www.perfecthostia.com/maschio-nike-air-flight-huarache-high-bianca-argento-scarpej">maschio nike air flight huarache high bianca argento</a>
    [url=http://www.motorzgirl.com/]motorzgirl[/url]

  6. avatar vorax

    <a href="http://www.txmed.net/jordan-super-fly-2-grau-wei%C3%9F-chaussuresa">jordan super fly 2 grau wei脽</a> <a href="http://www.ukpubs.net/nike-free-flyknit-5.0-v2-gris-argent-butya">nike free flyknit 5.0 v2 gris argent</a> <a href="http://www.uniquewebsitedesign.net/adidas-climacool-ride-v-rose-jaune-butyc">adidas climacool ride v rose jaune</a> <a href="http://www.unratedperez.net/air-jordan-1-retro-true-blau-jays-scarpeg">air jordan 1 retro true blau jays</a> <a href="http://www.urbanintelligence.net/air-jordan-2-fire-rot-hair-chaussuresb">air jordan 2 fire rot hair</a> <a href="http://www.utsweb.net/dam%C3%A4nner-nike-flyknit-lunar-2-lila-blau-butya">dam盲nner nike flyknit lunar 2 lila blau</a>
    vorax http://www.vorax.net/

欢迎留言




用户登录

sitemap