TextView中如何支持html标签,放置图片和动作标签

时间:2021-10-11 23:41:54

TextView文本框和输入框几乎是一个正常的带界面的可交互的Android应用的基本组成

TextView主要作用是显示文本内容,其实还可以显示图片,当然有必要的话还可以为文本内容添加动作相应用户的触摸动作

TextView:
1.支持格式化
  a.html格式化                     *
  b.为字体或背景添加独立的颜色
2.放置图片                         *
3.产生互动事件
  a.html格式化后可以生成A标签产生动作 *
  b.自动根据内容格式匹配动作
  c.自定义互动事件

Android支持简单的html标签,方便对其内容进行格式化处理
Android支持的html标签非常有限:
<p>,<br>,<font>,<b>,<i>,<tt>,<a>,<img>,<big>,<small>

a,如果TextView的Text中msg含有html标签,则需要对msg进行格式化,增加如下代码:

Spanned s=Html.fromHtml(msg);

b,如果TextView的Text中msg含有动作标签如a标签,则需要增加如下代码:

txt.setMovementMethod(LinkMovementMethod.getInstance());

c,如果TextView中需要放置图片,则比较复杂,看如下代码

activity_main.xml代码:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center_horizontal"
    >
    <Button
            android:id="@+id/leftbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="左按钮"
            />
        <Button
            android:id="@+id/rightbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
           
            android:text="右按钮"
            />

</LinearLayout>

MainActivity.java代码:

package com.example.exercise3;
import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;

public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    public void myClick(View view){
     Intent intent=new Intent();
     switch(view.getId()){
          case R.id.btn1:
          intent.setClass(this, HtmlFormatText.class);
      break;
          case R.id.btn2:
      break;
     }
     this.startActivity(intent);
    }
}

点击第一个Button,则会启动HtmlFormtText.java,显示界面为html_text.xml

html_text.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"
    android:orientation="vertical" >
   
    <TextView
        android:id="@+id/txtHtml"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"  
        >
    </TextView>
   
</LinearLayout>

HtmlFormatText.java代码如下:

package com.example.exercise3;
import java.lang.reflect.Field;
import android .app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.text.Html;
import android.text.Html.ImageGetter;
import android.text.Spanned;
import android.text.method.LinkMovementMethod;
import android.widget.TextView;

public class HtmlFormatText extends Activity  {
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  // TODO Auto-generated method stub
  super.onCreate(savedInstanceState);
  setContentView(R.layout.html_text);
  
  //Android支持简单的html标签,方便对其内容进行格式化处理
  //Android支持的html标签非常有限:
  //<p>,<br>,<font>,<b>,<i>,<tt>,<a>,<img>,<big>,<small>
  String msg="<big>大字体</big>"+"<small>小字体</small>"+"<p>haha</p>";
  
  msg+="<tt>my name is wangkang </tt><br>";
  msg+="<font color='red'>五星红旗是红色的</font>";
  msg+="<a href='http://10.0.2.2:8081'>打开tomcat首页</a>";
  
  //<img>标签可以实现文本内容中插入图片的效果,但是此img非彼img
  msg+="表情一<img src='face1'></img>"+"表情二<img src='face2'></img>";
  
  TextView txt=(TextView)findViewById(R.id.txtHtml);
  //Spanned个人理解为可修改的字符串,类似StringBuffer的概念,但是功能上远超出StringBuffer
  //Spanned s=Html.fromHtml(msg);//msg中包含有html标签,所以必须对msg进行格式化
  
  /*一,常规处理(对于图片)
  Spanned s = Html.fromHtml(msg, new ImageGetter() {

public Drawable getDrawable(String source) {
    // TODO Auto-generated method stub
    Drawable d = null;
    if (source.equals("face1")) {
     d = getResources().getDrawable(R.drawable.face1);
    }
    //切记指定图片大小,默认是0*0
    d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
    return d;
   }
  }, null);
  */
  
  //二,反射处理
  //原理:src的内容就是图片的索引名称,我们获取名称后直接反射对应的属性值
  
  Spanned s=Html.fromHtml(msg, new ImageGetter() {
   
   //getDrawable方法会在Html.fromHtml方法扫描msg内容的时候,一旦发现有img标签就会触发该方法
   @Override
   public Drawable getDrawable(String source) {
    // TODO Auto-generated method stub
    Drawable d=null;
    //1.获取包含索引名称的类信息
    Class cls=R.drawable.class;
    try {
     //2.根据名字获取对应的属性
     Field f=cls.getDeclaredField(source);
     //3.获取属性的值作为id取得对应的图片资源
     d=getResources().getDrawable(f.getInt(null));
    } catch (Exception e) {
     // TODO Auto-generated catch block
     e.printStackTrace();
    }
    d.setBounds(0,0,d.getIntrinsicWidth(),d.getIntrinsicHeight());
    return d;
   }
  }, null);
  
  //如果文本内容带动作(比如a标签),那么必须添加以下代码,否则只有视觉效果,没有实际功能
  txt.setMovementMethod(LinkMovementMethod.getInstance());
  
  txt.setText(s);
 }
}

此练习作为学习使用, 以便日后查看。。。