├── .gitignore ├── README.md ├── app ├── .gitignore ├── build.gradle ├── proguard-rules.pro └── src │ ├── androidTest │ └── java │ │ └── com │ │ └── wkl │ │ └── imagespan │ │ └── ExampleInstrumentedTest.java │ ├── main │ ├── AndroidManifest.xml │ ├── java │ │ └── com │ │ │ └── wkl │ │ │ └── imagespan │ │ │ ├── AlignImageSpan.java │ │ │ └── MainActivity.java │ └── res │ │ ├── drawable-nodpi │ │ └── my_pic.jpg │ │ ├── layout │ │ └── activity_main.xml │ │ ├── mipmap-hdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-mdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ └── values │ │ ├── colors.xml │ │ ├── strings.xml │ │ └── styles.xml │ └── test │ └── java │ └── com │ └── wkl │ └── imagespan │ └── ExampleUnitTest.java ├── build.gradle ├── gradle.properties ├── gradle └── wrapper │ ├── gradle-wrapper.jar │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat ├── images └── imagespan.gif └── settings.gradle /.gitignore: -------------------------------------------------------------------------------- 1 | *.iml 2 | .gradle 3 | /local.properties 4 | /.idea/workspace.xml 5 | /.idea/libraries 6 | .DS_Store 7 | /build 8 | /captures 9 | .externalNativeBuild 10 | .idea 11 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # AlignImageSpan 2 | 提供居中，顶部，底部以及baseline对齐的 ImageSpan 3 | 4 | ![](https://raw.githubusercontent.com/wangkunlin/AlignImageSpan/master/images/imagespan.gif) 5 | -------------------------------------------------------------------------------- /app/.gitignore: -------------------------------------------------------------------------------- 1 | /build 2 | -------------------------------------------------------------------------------- /app/build.gradle: -------------------------------------------------------------------------------- 1 | apply plugin: 'com.android.application' 2 | 3 | android { 4 | compileSdkVersion 25 5 | buildToolsVersion "25.0.2" 6 | defaultConfig { 7 | applicationId "com.wkl.imagespan" 8 | minSdkVersion 21 9 | targetSdkVersion 25 10 | versionCode 1 11 | versionName "1.0" 12 | testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" 13 | } 14 | buildTypes { 15 | release { 16 | minifyEnabled false 17 | proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' 18 | } 19 | } 20 | } 21 | 22 | dependencies { 23 | compile fileTree(dir: 'libs', include: ['*.jar']) 24 | androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', { 25 | exclude group: 'com.android.support', module: 'support-annotations' 26 | }) 27 | compile 'com.android.support:appcompat-v7:25.3.0' 28 | compile 'com.android.support.constraint:constraint-layout:1.0.2' 29 | testCompile 'junit:junit:4.12' 30 | } 31 | -------------------------------------------------------------------------------- /app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /Users/wangkunlin/android-sdk-macosx/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | 12 | # If your project uses WebView with JS, uncomment the following 13 | # and specify the fully qualified class name to the JavaScript interface 14 | # class: 15 | #-keepclassmembers class fqcn.of.javascript.interface.for.webview { 16 | # public *; 17 | #} 18 | 19 | # Uncomment this to preserve the line number information for 20 | # debugging stack traces. 21 | #-keepattributes SourceFile,LineNumberTable 22 | 23 | # If you keep the line number information, uncomment this to 24 | # hide the original source file name. 25 | #-renamesourcefileattribute SourceFile 26 | -------------------------------------------------------------------------------- /app/src/androidTest/java/com/wkl/imagespan/ExampleInstrumentedTest.java: -------------------------------------------------------------------------------- 1 | package com.wkl.imagespan; 2 | 3 | import android.content.Context; 4 | import android.support.test.InstrumentationRegistry; 5 | import android.support.test.runner.AndroidJUnit4; 6 | 7 | import org.junit.Test; 8 | import org.junit.runner.RunWith; 9 | 10 | import static org.junit.Assert.*; 11 | 12 | /** 13 | * Instrumentation test, which will execute on an Android device. 14 | * 15 | * @see Testing documentation 16 | */ 17 | @RunWith(AndroidJUnit4.class) 18 | public class ExampleInstrumentedTest { 19 | @Test 20 | public void useAppContext() throws Exception { 21 | // Context of the app under test. 22 | Context appContext = InstrumentationRegistry.getTargetContext(); 23 | 24 | assertEquals("com.wkl.imagespan", appContext.getPackageName()); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /app/src/main/java/com/wkl/imagespan/AlignImageSpan.java: -------------------------------------------------------------------------------- 1 | package com.wkl.imagespan; 2 | 3 | import android.graphics.Canvas; 4 | import android.graphics.Paint; 5 | import android.graphics.Rect; 6 | import android.graphics.drawable.Drawable; 7 | import android.support.annotation.IntDef; 8 | import android.text.style.ImageSpan; 9 | 10 | import java.lang.annotation.Retention; 11 | import java.lang.annotation.RetentionPolicy; 12 | import java.lang.ref.WeakReference; 13 | 14 | /** 15 | * Created by wangkunlin 16 | * On 2017-03-15 17 | */ 18 | 19 | public class AlignImageSpan extends ImageSpan { 20 | 21 | /** 22 | * 顶部对齐 23 | */ 24 | public static final int ALIGN_TOP = 3; 25 | /** 26 | * 垂直居中 27 | */ 28 | public static final int ALIGN_CENTER = 4; 29 | 30 | @IntDef({ALIGN_BOTTOM, ALIGN_BASELINE, ALIGN_TOP, ALIGN_CENTER}) 31 | @Retention(RetentionPolicy.SOURCE) 32 | public @interface Alignment { 33 | } 34 | 35 | public AlignImageSpan(Drawable d) { 36 | this(d, ALIGN_CENTER); 37 | } 38 | 39 | public AlignImageSpan(Drawable d, @Alignment int verticalAlignment) { 40 | super(d, verticalAlignment); 41 | } 42 | 43 | @Override 44 | public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) { 45 | Drawable d = getCachedDrawable(); 46 | Rect rect = d.getBounds(); 47 | if (fm != null) { 48 | Paint.FontMetrics fmPaint = paint.getFontMetrics(); 49 | // 顶部 leading 50 | float topLeading = fmPaint.top - fmPaint.ascent; 51 | // 底部 leading 52 | float bottomLeading = fmPaint.bottom - fmPaint.descent; 53 | // drawable 的高度 54 | int drHeight = rect.height(); 55 | 56 | switch (mVerticalAlignment) { 57 | case ALIGN_CENTER: { // drawable 的中间与 行中间对齐 58 | // 当前行 的高度 59 | float fontHeight = fmPaint.descent - fmPaint.ascent; 60 | // 整行的 y方向上的中间 y 坐标 61 | float center = fmPaint.descent - fontHeight / 2; 62 | 63 | // 算出 ascent 和 descent 64 | float ascent = center - drHeight / 2; 65 | float descent = center + drHeight / 2; 66 | 67 | fm.ascent = (int) ascent; 68 | fm.top = (int) (ascent + topLeading); 69 | fm.descent = (int) descent; 70 | fm.bottom = (int) (descent + bottomLeading); 71 | break; 72 | } 73 | case ALIGN_BASELINE: { // drawable 的底部与 baseline 对齐 74 | // 所以 ascent 的值就是 负的 drawable 的高度 75 | float ascent = -drHeight; 76 | fm.ascent = -drHeight; 77 | fm.top = (int) (ascent + topLeading); 78 | break; 79 | } 80 | case ALIGN_TOP: { // drawable 的顶部与 行的顶部 对齐 81 | // 算出 descent 82 | float descent = drHeight + fmPaint.ascent; 83 | fm.descent = (int) descent; 84 | fm.bottom = (int) (descent + bottomLeading); 85 | break; 86 | } 87 | case ALIGN_BOTTOM: // drawable 的底部与 行的底部 对齐 88 | default: { 89 | // 算出 ascent 90 | float ascent = fmPaint.descent - drHeight; 91 | fm.ascent = (int) ascent; 92 | fm.top = (int) (ascent + topLeading); 93 | } 94 | } 95 | } 96 | return rect.right; 97 | } 98 | 99 | /** 100 | * 这里的 x, y, top 以及 bottom 都是基于整个 TextView 的坐标系的坐标 101 | * 102 | * @param x drawable 绘制的起始 x 坐标 103 | * @param top 当前行最高处，在 TextView 中的 y 坐标 104 | * @param y 当前行的 BaseLine 在 TextView 中的 y 坐标 105 | * @param bottom 当前行最低处，在 TextView 中的 y 坐标 106 | */ 107 | @Override 108 | public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) { 109 | Drawable drawable = getDrawable(); 110 | Rect rect = drawable.getBounds(); 111 | float transY; 112 | switch (mVerticalAlignment) { 113 | case ALIGN_BASELINE: 114 | transY = y - rect.height(); 115 | break; 116 | case ALIGN_CENTER: 117 | transY = ((bottom - top) - rect.height()) / 2 + top; 118 | break; 119 | case ALIGN_TOP: 120 | transY = top; 121 | break; 122 | case ALIGN_BOTTOM: 123 | default: 124 | transY = bottom - rect.height(); 125 | } 126 | canvas.save(); 127 | // 这里如果不移动画布，drawable 就会在 Textview 的左上角出现 128 | canvas.translate(x, transY); 129 | drawable.draw(canvas); 130 | canvas.restore(); 131 | } 132 | 133 | private Drawable getCachedDrawable() { 134 | WeakReference wr = mDrawableRef; 135 | Drawable d = null; 136 | 137 | if (wr != null) 138 | d = wr.get(); 139 | 140 | if (d == null) { 141 | d = getDrawable(); 142 | mDrawableRef = new WeakReference<>(d); 143 | } 144 | 145 | return d; 146 | } 147 | 148 | private WeakReference mDrawableRef; 149 | } 150 | -------------------------------------------------------------------------------- /app/src/main/java/com/wkl/imagespan/MainActivity.java: -------------------------------------------------------------------------------- 1 | package com.wkl.imagespan; 2 | 3 | import android.graphics.drawable.Drawable; 4 | import android.os.Bundle; 5 | import android.support.v7.app.AppCompatActivity; 6 | import android.text.SpannableString; 7 | import android.text.Spanned; 8 | import android.text.style.ImageSpan; 9 | import android.view.View; 10 | import android.widget.TextView; 11 | 12 | public class MainActivity extends AppCompatActivity { 13 | 14 | TextView txt; 15 | 16 | @Override 17 | protected void onCreate(Bundle savedInstanceState) { 18 | super.onCreate(savedInstanceState); 19 | setContentView(R.layout.activity_main); 20 | txt = (TextView) findViewById(R.id.txt); 21 | findViewById(R.id.button).setOnClickListener(new View.OnClickListener() { 22 | @Override 23 | public void onClick(View v) { 24 | img(AlignImageSpan.ALIGN_TOP); 25 | } 26 | }); 27 | findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() { 28 | @Override 29 | public void onClick(View v) { 30 | img(AlignImageSpan.ALIGN_CENTER); 31 | } 32 | }); 33 | findViewById(R.id.button3).setOnClickListener(new View.OnClickListener() { 34 | @Override 35 | public void onClick(View v) { 36 | img(AlignImageSpan.ALIGN_BASELINE); 37 | } 38 | }); 39 | findViewById(R.id.button4).setOnClickListener(new View.OnClickListener() { 40 | @Override 41 | public void onClick(View v) { 42 | img(AlignImageSpan.ALIGN_BOTTOM); 43 | } 44 | }); 45 | } 46 | 47 | private void img(int align) { 48 | SpannableString ss = new SpannableString("文字holder文字"); 49 | Drawable d = getDrawable(R.drawable.my_pic); 50 | d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight()); 51 | ImageSpan span = new AlignImageSpan(d, align); 52 | ss.setSpan(span, 2, 8, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE); 53 | txt.setText("上一行文字\n"); 54 | txt.append(ss); 55 | txt.append("\n下一行文字"); 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /app/src/main/res/drawable-nodpi/my_pic.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wangkunlin/AlignImageSpan/adf87557cf54ee6c22201bcaaf959259fb556e51/app/src/main/res/drawable-nodpi/my_pic.jpg -------------------------------------------------------------------------------- /app/src/main/res/layout/activity_main.xml: -------------------------------------------------------------------------------- 1 | 2 | 8 | 9 | 24 | 25 |