我在Google上搜索到这个网站，在那里我发现一个与我的问题类似的问题，就是如何在TextView文本中包含图片，例如“hello my name is [image]”，答案是：
ImageSpan is = new ImageSpan(context, resId);
text.setSpan(is, index, index + strLength, 0);
我想了解这段代码：
text.setSpan()做些什么，例如导入、引用或者保留原样？如果有人能为我分解一下这个问题，我将不胜感激。
试试这个...
txtview.setCompoundDrawablesWithIntrinsicBounds(
R.drawable.image, 0, 0, 0);
还可以看这个：http://developer.android.com/reference/android/widget/TextView.html
在 XML 文件中尝试一下吧。
<TextView
android:id="@+id/txtStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawableLeft="@drawable/image"
android:drawablePadding="5dp"
android:maxLines="1"
android:text="@string/name"/>
com/xyz/customandroid/TextViewWithImages.java:
import java.util.regex.Matcher;
import java.util.regex.Pattern;
import android.content.Context;
import android.text.Spannable;
import android.text.style.ImageSpan;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.TextView;
public class TextViewWithImages extends TextView {
public TextViewWithImages(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public TextViewWithImages(Context context, AttributeSet attrs) {
super(context, attrs);
}
public TextViewWithImages(Context context) {
super(context);
}
@Override
public void setText(CharSequence text, BufferType type) {
Spannable s = getTextWithImages(getContext(), text);
super.setText(s, BufferType.SPANNABLE);
}
private static final Spannable.Factory spannableFactory = Spannable.Factory.getInstance();
private static boolean addImages(Context context, Spannable spannable) {
Pattern refImg = Pattern.compile("\\Q[img src=\\E([a-zA-Z0-9_]+?)\\Q/]\\E");
boolean hasChanges = false;
Matcher matcher = refImg.matcher(spannable);
while (matcher.find()) {
boolean set = true;
for (ImageSpan span : spannable.getSpans(matcher.start(), matcher.end(), ImageSpan.class)) {
if (spannable.getSpanStart(span) >= matcher.start()
&& spannable.getSpanEnd(span) <= matcher.end()
) {
spannable.removeSpan(span);
} else {
set = false;
break;
}
}
String resname = spannable.subSequence(matcher.start(1), matcher.end(1)).toString().trim();
int id = context.getResources().getIdentifier(resname, "drawable", context.getPackageName());
if (set) {
hasChanges = true;
spannable.setSpan( new ImageSpan(context, id),
matcher.start(),
matcher.end(),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
);
}
}
return hasChanges;
}
private static Spannable getTextWithImages(Context context, CharSequence text) {
Spannable spannable = spannableFactory.newSpannable(text);
addImages(context, spannable);
return spannable;
}
}
用途：
在res/layout/mylayout.xml中使用：
<com.xyz.customandroid.TextViewWithImages
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF00"
android:text="@string/can_try_again"
android:textSize="12dip"
style=...
/>
com.xyz.customandroid。<string name="can_try_again">Press [img src=ok16/] to accept or [img src=retry16/] to retry</string>
其中ok16.png和retry16.png是在res/drawable/文件夹中的图标。
我尝试了许多不同的解决方案，而这个对我来说是最好的：
SpannableStringBuilder ssb = new SpannableStringBuilder(" Hello world!");
ssb.setSpan(new ImageSpan(context, R.drawable.image), 0, 1, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
tv_text.setText(ssb, TextView.BufferType.SPANNABLE);
这段代码使用的内存最少。
fun TextView.addImage(atText: String, @DrawableRes imgSrc: Int, imgWidth: Int, imgHeight: Int) {
val ssb = SpannableStringBuilder(this.text)
val drawable = ContextCompat.getDrawable(this.context, imgSrc) ?: return
drawable.mutate()
drawable.setBounds(0, 0,
imgWidth,
imgHeight)
val start = text.indexOf(atText)
ssb.setSpan(VerticalImageSpan(drawable), start, start + atText.length, Spannable.SPAN_INCLUSIVE_EXCLUSIVE)
this.setText(ssb, TextView.BufferType.SPANNABLE)
}
VerticalImageSpan类来自很棒的答案
https://dev59.com/x18e5IYBdhLWcg3wja75#38788432
使用方法
val textView = findViewById<TextView>(R.id.textview)
textView.setText("Send an [email-icon] to example@email.com.")
textView.addImage("[email-icon]", R.drawable.ic_email,
resources.getDimensionPixelOffset(R.dimen.dp_30),
resources.getDimensionPixelOffset(R.dimen.dp_30))
结果
注释
为什么使用VerticalImageSpan类？
ImageSpan.ALIGN_CENTER属性要求API 29。
此外，在测试后，我发现ImageSpan.ALIGN_CENTER仅在图像小于文本时有效。如果图像大于文本，则只有图像位于中心，文本不居中，而是对齐在图像底部。
这个答案基于这篇优秀答案，作者是18446744073709551615。他们的解决方案虽然有帮助，但没有与周围文本一起设置图像图标的大小。它也没有将图标颜色设置为周围文本的颜色。
下面的解决方案采用了一个白色的正方形图标，并使其适应周围文本的大小和颜色。
public class TextViewWithImages extends TextView {
private static final String DRAWABLE = "drawable";
/**
* Regex pattern that looks for embedded images of the format: [img src=imageName/]
*/
public static final String PATTERN = "\\Q[img src=\\E([a-zA-Z0-9_]+?)\\Q/]\\E";
public TextViewWithImages(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public TextViewWithImages(Context context, AttributeSet attrs) {
super(context, attrs);
}
public TextViewWithImages(Context context) {
super(context);
}
@Override
public void setText(CharSequence text, BufferType type) {
final Spannable spannable = getTextWithImages(getContext(), text, getLineHeight(), getCurrentTextColor());
super.setText(spannable, BufferType.SPANNABLE);
}
private static Spannable getTextWithImages(Context context, CharSequence text, int lineHeight, int colour) {
final Spannable spannable = Spannable.Factory.getInstance().newSpannable(text);
addImages(context, spannable, lineHeight, colour);
return spannable;
}
private static boolean addImages(Context context, Spannable spannable, int lineHeight, int colour) {
final Pattern refImg = Pattern.compile(PATTERN);
boolean hasChanges = false;
final Matcher matcher = refImg.matcher(spannable);
while (matcher.find()) {
boolean set = true;
for (ImageSpan span : spannable.getSpans(matcher.start(), matcher.end(), ImageSpan.class)) {
if (spannable.getSpanStart(span) >= matcher.start()
&& spannable.getSpanEnd(span) <= matcher.end()) {
spannable.removeSpan(span);
} else {
set = false;
break;
}
}
final String resName = spannable.subSequence(matcher.start(1), matcher.end(1)).toString().trim();
final int id = context.getResources().getIdentifier(resName, DRAWABLE, context.getPackageName());
if (set) {
hasChanges = true;
spannable.setSpan(makeImageSpan(context, id, lineHeight, colour),
matcher.start(),
matcher.end(),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
);
}
}
return hasChanges;
}
/**
* Create an ImageSpan for the given icon drawable. This also sets the image size and colour.
* Works best with a white, square icon because of the colouring and resizing.
*
* @param context The Android Context.
* @param drawableResId A drawable resource Id.
* @param size The desired size (i.e. width and height) of the image icon in pixels.
* Use the lineHeight of the TextView to make the image inline with the
* surrounding text.
* @param colour The colour (careful: NOT a resource Id) to apply to the image.
* @return An ImageSpan, aligned with the bottom of the text.
*/
private static ImageSpan makeImageSpan(Context context, int drawableResId, int size, int colour) {
final Drawable drawable = context.getResources().getDrawable(drawableResId);
drawable.mutate();
drawable.setColorFilter(colour, PorterDuff.Mode.MULTIPLY);
drawable.setBounds(0, 0, size, size);
return new ImageSpan(drawable, ImageSpan.ALIGN_BOTTOM);
}
}
如何使用：
只需在文本中嵌入所需图标的引用即可。无论文本是通过textView.setText(R.string.string_resource);编程设置还是在xml中设置都无关紧要。
要在文本中嵌入名为example.png的可绘制图标，请包含以下字符串：[img src=example/]。
例如，字符串资源可能如下所示：
<string name="string_resource">This [img src=example/] is an icon.</string>
makeImageSpan()正确居中对齐图片的能力。此外，我发现该解决方案通过创建不必要的行间距影响了文本间距。 /**
* Create an ImageSpan for the given icon drawable. This also sets the image size. Works best
* with a square icon because of the sizing
*
* @param context The Android Context.
* @param drawableResId A drawable resource Id.
* @param size The desired size (i.e. width and height) of the image icon in pixels.
* Use the lineHeight of the TextView to make the image inline with the
* surrounding text.
* @return An ImageSpan, aligned with the bottom of the text.
*/
private static BetterImageSpan makeImageSpan(Context context, int drawableResId, int size) {
final Drawable drawable = context.getResources().getDrawable(drawableResId);
drawable.mutate();
drawable.setBounds(0, 0, size, size);
return new BetterImageSpan(drawable, BetterImageSpan.ALIGN_CENTER);
}
spannable.setSpan()，与往常一样。<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:drawablePadding="4dp"
android:drawableRight="@drawable/edit"
android:text="Hello world"
android:textSize="18dp" />
android:drawableLeft="@drawable/filename"
android:drawableRight="@drawable/filename"
android:drawableTop="@drawable/filename"
android:drawableBottom="@drawable/filename"
为文本添加内联图像的组件已经开发完成。它支持任何给定的位置，并处理图像上的点击事件： https://github.com/myDario/DarioInlineImageTextView
这可能会对你有所帮助
SpannableStringBuilder ssBuilder;
ssBuilder = new SpannableStringBuilder(" ");
// working code ImageSpan image = new ImageSpan(textView.getContext(), R.drawable.image);
Drawable image = ContextCompat.getDrawable(textView.getContext(), R.drawable.image);
float scale = textView.getContext().getResources().getDisplayMetrics().density;
int width = (int) (12 * scale + 0.5f);
int height = (int) (18 * scale + 0.5f);
image.setBounds(0, 0, width, height);
ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BASELINE);
ssBuilder.setSpan(
imageSpan, // Span to add
0, // Start of the span (inclusive)
1, // End of the span (exclusive)
Spanned.SPAN_INCLUSIVE_EXCLUSIVE);// Do not extend the span when text add later
ssBuilder.append(" " + text);
ssBuilder = new SpannableStringBuilder(text);
textView.setText(ssBuilder);