图文混排
2018-02-28 本文已影响6人
zhengLH
【需求】在项目中有个需求展示文章具体内容,内容包括的有文字和图片,类似效果如下:
图文混排.png【核心方法】
mTvpicWord.setText(Html.fromHtml(descString(), getImageGetter(), null));
【参数解释】
source: 包含了HTML标签(文本+图片)的字符串。
imageGetter: 解析src,这里说一下图片资源可以是本地或者网络获取,并封装成Drawable对象。
tagHandler: 标签处理。不使用可以直接设为null。
【1】拼接图文混排
/**
* 包含了HTML标签(文本+图片)的字符串
* @return
*/
private String descString() {
return "从上可看出:服务端的TCP资源分配时刻 = 完成第二次握手时;而客户端的TCP资源分配时刻 "
+ "= 完成第三次握手时这就使得服务器易于受到SYN洪泛攻击,即同时多个客户端发起连接请求,从而需进行多个请求的TCP连接资源分配放假啊手法熟练了罚款了。<br>"
+ "<img src= '" + R.mipmap.login_bg1 + "'/><br>"
+ "加几个罚款发卡咖啡给看看夸夸广发卡卡开发,噶卡夫卡卡夫卡加几个罚款发卡咖啡给看看夸夸广发卡。"
+ "第二次握手时;而客户端的TCP资源分配时刻。<br>"
+ "<img src = '" + R.mipmap.login_bg2 + "'/><br>"
+ "握手时这就使得服务器易于受到" + "";
}
【2】处理图片
/**
* 解析src,这里说一下图片资源可以是本地或者网络获取,并封装成Drawable对象
* @return
*/
private Html.ImageGetter getImageGetter() {
Html.ImageGetter imageGetter = new Html.ImageGetter(){
@Override
public Drawable getDrawable(String source) {
int dimension = (int) getResources().getDimension(R.dimen.activity_horizontal_margin);
int getInt = Integer.parseInt(source);
Drawable drawable = getResources().getDrawable(getInt);
int height = dimension;
int width = (int)((float) drawable.getIntrinsicWidth() / (float) drawable.getIntrinsicHeight() * dimension);
if(width == 0 ){
width = drawable.getIntrinsicWidth();
}
// 这里setBounds()方法是设置图片显示区域,不设置就不显示。
drawable.setBounds(0,0, width * 6, height * 6);
return drawable;
}
};
return imageGetter;
}
【完整代码】
/**
* @Author Lee
* @Time 2018/2/28
* @Theme 图文混排
*/
public class PicWordMixedActivity extends AppCompatActivity{
private TextView mTvpicWord;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_pic_word_mix);
initView();
}
private void initView() {
mTvpicWord = findViewById(R.id.tv_pic_word);
mTvpicWord.setText(Html.fromHtml(descString(), getImageGetter(), null));
}
/**
* 解析src,这里说一下图片资源可以是本地或者网络获取,并封装成Drawable对象
* @return
*/
private Html.ImageGetter getImageGetter() {
Html.ImageGetter imageGetter = new Html.ImageGetter(){
@Override
public Drawable getDrawable(String source) {
int dimension = (int) getResources().getDimension(R.dimen.activity_horizontal_margin);
int getInt = Integer.parseInt(source);
Drawable drawable = getResources().getDrawable(getInt);
int height = dimension;
int width = (int)((float) drawable.getIntrinsicWidth() / (float) drawable.getIntrinsicHeight() * dimension);
if(width == 0 ){
width = drawable.getIntrinsicWidth();
}
// 这里setBounds()方法是设置图片显示区域,不设置就不显示。
drawable.setBounds(0,0, width * 6, height * 6);
return drawable;
}
};
return imageGetter;
}
/**
* 包含了HTML标签(文本+图片)的字符串
* @return
*/
private String descString() {
return "从上可看出:服务端的TCP资源分配时刻 = 完成第二次握手时;而客户端的TCP资源分配时刻 "
+ "= 完成第三次握手时这就使得服务器易于受到SYN洪泛攻击,即同时多个客户端发起连接请求,从而需进行多个请求的TCP连接资源分配放假啊手法熟练了罚款了。<br>"
+ "<img src= '" + R.mipmap.login_bg1 + "'/><br>"
+ "加几个罚款发卡咖啡给看看夸夸广发卡卡开发,噶卡夫卡卡夫卡加几个罚款发卡咖啡给看看夸夸广发卡。"
+ "第二次握手时;而客户端的TCP资源分配时刻。<br>"
+ "<img src = '" + R.mipmap.login_bg2 + "'/><br>"
+ "握手时这就使得服务器易于受到" + "";
}
}
【xml 布局】
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tv_pic_word"
android:textSize="@dimen/textSize_18sp"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>