EditText-Android实现图文混排

目录

1.Span样式介绍

1.1Span类继承关系

1.2StyleSpan

1.3AbsoluteSizeSpan

1.4ForegroundColorSpan

1.5UnderlineSpan

1.6StrikethroughSpan

1.7Spanned

2.实现富文本编辑

2.1定义富文本样式类

2.2生成选中文字要设置的Span(样式)

2.3应用样式到选中文字上

2.4设置粗体示例

2.5获取点击位置的样式

2.6插入图片

3.span生成Html

3.html 转 span


需求:Android实现富文本编辑器,并实现Html解析和生成;

常见富文本编辑操作:

1.字体加粗,斜体,下划线,删除线;

2.字体设置大小 默认大(18px),中(16px),小(14px);

3.字体颜色设置;

4.换行插入图片;

5.编辑内容生成Html;

6.解析Html并且显示;

主要实现方式:

1.EditText+Span的实现方式;

2.WebView+JavaScript的实现方式;

EditText是一个输入框控件,Span控制输入框内容显示样式;

1.Span样式介绍

1.1Span类继承关系

CharacterStyle:是控制内容显示样式Span的基类;控制文字样式的类基本都是扩展CharacterStyle类,大多数样式继承自MetricAffectingSpan类,简单的样式只需要实现UpdateAppearance;

1.2StyleSpan

设置字体:粗体,斜体,正常,粗体+斜体,支持样式如下:

android.graphics.Typeface
// Style
    public static final int NORMAL = 0;
    public static final int BOLD = 1;
    public static final int ITALIC = 2;
    public static final int BOLD_ITALIC = 3;

创建字体样式示例:

//粗体
new StyleSpan(Typeface.BOLD);
//斜体
new StyleSpan(Typeface.ITALIC);

1.3AbsoluteSizeSpan

设置字体大小

/**
     * Set the text size to <code>size</code> physical pixels,
     * or to <code>size</code> device-independent pixels if
     * <code>dip</code> is true.
     */
    //设置物理像素(px)大小(dip:false)或者设置与设备像素无关的大小(dip:true)
    public AbsoluteSizeSpan(int size, boolean dip) {
        mSize = size;
        mDip = dip;
    }

使用示例:

new AbsoluteSizeSpan(16, true);

1.4ForegroundColorSpan

设置字体颜色

public ForegroundColorSpan(@ColorInt int color) {
        mColor = color;
    }

使用示例:

new ForegroundColorSpan(Color.parseColor("#00ff00"))

1.5UnderlineSpan

设置文字内容下划线

使用示例:

new UnderlineSpan()

1.6StrikethroughSpan

设置文字内容删除线

new StrikethroughSpan()

1.7Spanned

设置文字内容样式范围(主要开始和结束位置前面或者后面继续使用设置样式)

    //包含start不包含end[start,end)
    public static final int SPAN_INCLUSIVE_EXCLUSIVE = SPAN_MARK_MARK;

    //包含start同时包含end[start,end]
    public static final int SPAN_INCLUSIVE_INCLUSIVE = SPAN_MARK_POINT;

    //不包含start同时不包含end(start,end)
    public static final int SPAN_EXCLUSIVE_EXCLUSIVE = SPAN_POINT_MARK;

    //不包含start包含end(start,end]
    public static final int SPAN_EXCLUSIVE_INCLUSIVE = SPAN_POINT_POINT;

2.实现富文本编辑

public class RichEditText extends AppCompatEditText {}

2.1定义富文本样式类

/**
 * 字体样式
 */

public class FontStyle {
    public final static int NORMAL = 16;
    public final static int SMALL = 14;
    public final static int BIG = 18;

    public final static String BLACK="#FF212121";
    public final static String GREY="#FF878787";
    public final static String RED="#FFF64C4C";
    public final static String BLUE="#FF007AFF";

    public boolean isBold;
    public boolean isItalic;
    public boolean isUnderline;
    public boolean isStreak;
    public int fontSize;
    public int color;
}

2.2生成选中文字要设置的Span(样式)

RichEditText
public CharacterStyle getInitSpan(FontStyle fontStyle){
        //粗体
        if(fontStyle.isBold){
            return new StyleSpan(Typeface.BOLD);
            //斜体
        }else if(fontStyle.isItalic){
            return new StyleSpan(Typeface.ITALIC);
            //下划线
        }else if(fontStyle.isUnderline){
            return new UnderlineSpan();
            //删除线
        }else if(fontStyle.isStreak){
            return new StrikethroughSpan();
            //字体大小
        }else if(fontStyle.fontSize>0){
            return new AbsoluteSizeSpan(fontStyle.fontSize, true);
            //字体颜色
        }else if(fontStyle.color != 0){
            return new ForegroundColorSpan(fontStyle.color);
        }
        return null;
    }

2.3应用样式到选中文字上

setSpan是公用方法,fontStyle设置选中内容的样式,isSet设置或取消样式,tClass当前要设置Span样式class;

public <T> void setSpan(FontStyle fontStyle, boolean isSet, Class<T> tClass){
        //获取选中文字的开始和结束位置
        int start = getSelectionStart();
        int end = getSelectionEnd();
        //不包含start字符包含end字符,选中end位置以后继续使用设置样式
        int mode = Spannable.SPAN_EXCLUSIVE_INCLUSIVE;
        //获取文字tClass(例如:StyleSpan.class)类型样式数组(Span)
        //tClass主要设置文字样式的class
        T[] spans = getEditableText().getSpans(start,end,tClass);
        //移除选中文字的样式,同时保存样式
        List<SpanPart> spanStyles = getOldFontStyles(spans, fontStyle);
        //重新设置样式
        for (SpanPart spanPart : spanStyle
  • 4
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值