上图是视图的开发指导，官方给了个链接。

国内地址:

https://developer.android.google.cn/guide/topics/ui/index.html

view的使用

"直译"

窗口中的所有视图都排列在一棵树中.

可以通过代码或通过在一个或多个XML布局中指定视图树来添加视图.

有许多专门的视图子类可以充当控件，或者可以显示文本，图像或其他内容。

创建视图树后，通常可能需要执行几种类型的常见操作.

"人话"

窗口也就是windows，windows上有视图"树",我们在画页面时其实就是往视图树上添加view，当然，添加的方式即可以是xml也可以是代码的形式。下面那两句话，举个例子就是TextView的常见类型操作setText();

总结：

我们对整个view学习要建立一个体系，有一个脉络。(自己脑海中有一个大体的脉络，再去补充一个一个知识点)

view的基本概念->view如何使用->如何自定义view

之后我会分享我的"脉络"，希望大家多多支持.

后续:

第一期：view的简单介绍。

第二期：view添加到页面的方式。

下一期：view的属性和方法。

<string name="tip_xinghao_nation">
 <Data>
 <![CDATA[<font color="#e60012"> *</font><font color="#189dde">民族 : </font>]]
 </Data>
</string>

者博客

http://www.jianshu.com/u/0fa6f5d09040

文章目录

• 前言

• 场景

• 实现方式

• drawable属性

• Spannable使用

• HTML显示

• 总结

  
  

0

前言

在使用TextView的时候，我们经常需要在TextView中进行图文混排，比如在QQ中聊天的消息中的表情，底部tab图标等。

1

场景

2

实现方式

Android官方对TextView的图文混排提供了支持，我们可以从以下三种方式实现TextView的图文混排：

1.在TextView中使用Compound Drawable属性；

2.在TextView中使用Spannable多样式显示；

3.在TextView中显示HTML文本。

3

drawable属性

在TextView中使用Compound Drawable属性可以在文字的上下左右放置drawable，效果如下：

一共有两种方式可以实现：XML布局设置和Java代码设置。

1. xml布局

2. java代码

注意：必须setBounds测量图片边界，否则不显示。

3.缺陷

当TextView设置成固定大小时，由于文字距离边界的距离过大，会导致文字与图片之间设置的间距无效，如下图。

解决方案：

①设置TextView的内填充

通过设置paddingLeft、paddingRight、paddingTop、paddingBottom来缩写这个间距

②自定义TextView重新布局

a.先自定义属性iconPadding来设置间距，并提供方法给外部调用。

b.重写setCompoundDrawablesWithIntrinsicBounds方法来获取我们设置的drawable宽高。

c.最后重写onLayout方法。

可以先参考：Android技巧之drawablePadding的那些事（https://yuxingxin.com/2015/11/05/DrawablePadding/）,该篇文章只解决了左右失效的问题。后期会整理个解决图文混排的工具库，里面会有具体方案。

4

Spannable使用

1.简介

setText(CharSequence text)中接收的是CharSequence。而SpannableString和SpannableStringBuilder是其实现类，是可以直接赋值的。并且两者的setSpan方法可以设置一些格式对象（例如字体大小、下划线、替换为图片等），这就可以实现富文本了。

Spannable实现子类：SpannableString，SpannableStringBuilder（可变，类似于StringBuilder）。

Spannable中定义了抽象方法：setSpan(Object what, int start, int end, int flags)和removeSpan(Object what)。这两个方法实现了对字符串的灵活编辑。

其中setSpan方法包含如下参数：

flags常用的有四种

通常在insert方式才生效，平时不生效，具体看：Explain the meaning of Span flags like SPAN_EXCLUSIVE_EXCLUSIVE。（https://stackoverflow.com/questions/9879233/explain-the-meaning-of-span-flags-like-span-exclusive-exclusive）

2.常用span类

3.使用方式

其中ImageSpan默认对其方式有两种：ALIGN_BOTTOM及ALIGN_BASELINE。很可惜我们平常用的居中对其的方式没有，不过可以通过自定义实现，后续会在开源出来。

4.效果

5

HTML显示

一般显示HTML内容有两种方式：

• 使用 Android 提供的 WebView 控件。

  
  

• 通过将 HTML 内容转化为 Spanned 格式在 TextView 中进行显示。

现在大多数都用WebView的方式。但是并不是所有的场景下都适合使用 WebView 来显示 HTML 内容，例如，如果应用要显示的内容只是一部分 HTML 片段，就可以利用 TextView 来进行显示，并且效率较高。

由于这种方式不太常用，就不深入介绍，里面可以实现的效果还是很好的。

1.简介

Android 中的 TextView 组件常用于显示文本内容，其实它也可以显示 HTML 的内容。

简单来讲，这就需要先把 HTML 的内容以字符串的形式获取后，经过 android.text.Html.fromHtml转化成 Spanned 的格式，然后将其传递到 TextView 的 setText方法中，这样就可以在 TextView 中显示 HTML 页面的内容了。

需要注意的是，并不是所有的 HTML 标签在 TextView 中都是支持的，且官方文档并没有明确的说明支持 HTML 标签列表，通过查看 Android 源代码，可以得到简单的支持列表。

下面的示例来介绍如何在 TextView 中显示一段 HTML 内容，要显示的这段 HTML 内容即包含超链接内容，也包含有图片。

2.使用

fromHtml方法

source，就是包含 HTML 内容的字符串。Html.ImageGetter 和 Html.TagHandler 是两个接口，提供给开发者继承使用。

imageGetter， 如果要显示图片是需要被继承的，重写 getDrawable(String source)方法，用于获取 HTML 里面的图片来显示在 TextView 中。

tagHandler，其作用是把 HTML 带标记的文本内容字符串转化成可以显示效果的的 Spanned 字符串 。由于并非所有的 HTML 标签都可以转化，所以在使用时，用户需要自己添加一些必要的标签和处理方法时才会继承使用的。

继承ImageGetter

继承于 ImageGetter，重写 getDrawable (String source) 方法。通过异步操作，读取本地/网络资源，获得drawable对象。

继承TagHandler

继承于 TagHandler，重写了 handleTag方法。为了支持更多的标签，例如为了支持<ul><ol><dd>和<li>标签，这四个标签是在 formHtml方法中本身是不支持。

如果开发者认为安卓 TagHandler 提供的默认标签解析已经够用，直接在 fromHtml方法中第三个参数的地方填写 既可。

最后，通过 formHtml方法将 HTML 内容转化为可供显示的 SpannableString，将 SpannableString 通过 setText 方法放入 TextView 中，就可以显示图文并茂的内容了。

用户交互

formHtml方法已经将 HTML 内容中的超链接和图片转义成为 UrlSpan 和 ImageSpan，进而在 TextView 中完成显示。但是此时是没有任何用户交互的，用户只能看到 HTML 的内容，下面介绍如何添加用户交互功能。

要完成用户交互，这里我们需要在 TextView 中还需要调用textView.setMovementMethod方法。

Android 提供了 LinkMovementMethod 类以实现了对于文本内容中超链接的遍历，并且支持对于超链接的点击事件。

所以只要在添加下面一行代码，就可以使点击 UrlSpan 能够触发打开链接的功能。

如果想要更多的用户交互效果，可以自定义LinkMovementMethod 类，重写onTouchEvent方法来实现。

3.效果

关于HTML显示这部分，没做具体实现。具体可以看：灵活高效的在 Android Native App 开发中显示 HTML 内容（https://www.ibm.com/developerworks/cn/web/1407_zhangqian_androidhtml/index.html）,里面有具体源码可以下载，HTML部分内容也是参考该篇文章完成的。

开源库：html-textview

https://github.com/PrivacyApps/html-textview

6

总结

以上就是关于图文混排的一些解决方案，相信通过这些了解，对于工作中的实际场景的使用大家会有适当的解决方案。由于实际应用较少，所以认识较为浅显，可能有些地方描述不当，后期会考虑封装个解决图文混排的工具类，加深下理解。