自定义从 Html 字符串引用的图像

Posted 2023-03-05

【中文标题】自定义从 Html 字符串引用的图像

【英文标题】：Customize Image referred From Html string

【发布时间】：2013-06-16 08:51:23

【问题描述】：

我的一个项目活动包括用 string.xml 编写的长文本，我从 textview 中的资源添加一些图像，因为每个短语之后都有图像，然后是文本短语，然后是图像等等，

我使用此代码从字符串中获取图像：

public class MainActivity extends Activity 

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TextView htmlTextView = (TextView) findViewById(R.id.day_tv);
        htmlTextView.setText(Html.fromHtml(getString(R.string.day), new ImageGetter(), null));
    

    private class ImageGetter implements Html.ImageGetter 

        public Drawable getDrawable(String source) 
            int id = 0;
            if (source.equals("image1.jpg")) 
                id = R.drawable.a;
             else if (source.equals("image2.jpg")) 
                id = R.drawable.b;
             else if (source.equals("image3.jpg")) 
                id = R.drawable.c;
             else if (source.equals("image4.jpg")) 
                id = R.drawable.d;
             else if (source.equals("image5.jpg")) 
                id = R.drawable.e;
            

            Drawable d = getResources().getDrawable(id);
            d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
            return d;
        
    ;

在string.xml中写html img标签为：

<img src="image1.jpg">

我希望能够通过更改其宽度和高度来自定义每个图像，或者将其引用为可绘制样式以在图像周围添加边框。

我尝试使用波纹管代码来改变宽度和高度：

<img src="image1.jpg"  > 

但它不起作用。

任何实现这一目标的建议将不胜感激，谢谢。

【问题讨论】：

是什么不工作？对我来说，真的很难理解你的问题——也许我不是唯一一个，因为没有人费心评论你的问题或给你答案。也许您应该尝试重新表述您的问题。你到底想达到什么目的？你为什么把html放在TextViews里面？

@Darwind 我正在编辑帖子，请检查它

你想为每张图片设置不同的宽度和高度吗？

@blackbelt 是的，亲爱的，每个图像的宽度和高度都不同，谢谢

并且宽度/高度与drawable的不同？

【参考方案1】：

我终于得到了这个解决方案，它允许更改每个图像的宽度和高度，但仍然没有实现一个点，即将图像引用为可绘制形状作为背景， 仍在努力：

 private class ImageGetter implements Html.ImageGetter 

    public Drawable getDrawable(String source) 
        int id,id1,id2,id3,id4 = 0;

        if (source.equals("image1.jpg")) 
            id = R.drawable.a;
            Drawable d = getResources().getDrawable(id);
            d.setBounds(0, 0, 80, 20);
         return d;
                    
        else if (source.equals("image2.jpg")) 
            id1 = R.drawable.b;
            Drawable d1 = getResources().getDrawable(id1);
            d1.setBounds(0, 0, 100, 40);
         return d1;
                    
        else if (source.equals("image3.jpg")) 
            id2 = R.drawable.c;
            Drawable d2 = getResources().getDrawable(id2);
            d2.setBounds(0, 0, 120, 60);
         return d2; 
                   
         else if (source.equals("image4.jpg")) 
            id3 = R.drawable.d;                      
            Drawable d3 = getResources().getDrawable(id3);
            d3.setBounds(0, 0, 140, 80);           
        return d3;
         
         else if (source.equals("image5.jpg")) 
             id4 = R.drawable.e;                      
             Drawable d4 = getResources().getDrawable(id4);
             d4.setBounds(0, 0, 160, 100);            
         return d4;
     
        return null;
       ;
      
    

【参考方案2】：

问题来自Html.fromHtml()，它只支持very limited set of tags and attributes。支持<img>，但不支持设置图片的宽高。可以使用TextView（通过使用SpannableString 和ImageSpan）来实现它，但是它更复杂并且不是很灵活。

相反，您应该使用正确处理 HTML 的WebView。

加载字符串很容易：

WebView webView = (WebView) findViewById(R.id.web_view);
webView.loadData(getResources(R.string.day), "text/html", null);

您可以找到更多示例in the documentation。

---

只是为了比较，这里是一个没有使用WebView的例子：

protected void onCreate(Bundle savedInstanceState) 
    ...
    TextView textView = (TextView) findViewById(R.id.text_view);
    SpannableString ss = new SpannableString("Hello :)");

    // Draw the image with a size of 50x50
    Drawable d = getResources().getDrawable(R.drawable.happy_face);
    d.setBounds(0, 0, 50, 50);

    // Replace the ":)" in the string by our drawable
    ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BASELINE);
    ss.setSpan(span, 6, 8, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
    textView.setText(ss);

它会加载得更快，但你不能使用 HTML。

【讨论】：

在我的项目开始时，我尝试使用 webview 而不是 textview，但我发现带有 html 标签的 textview 更容易，因为当时我不熟悉 webview，我的文本太长并且已经完成了自定义string.xml ，如果没有其他方法，我必须用 webview 重新启动，谢谢亲爱的

请不要在 ImageGetter 类中为每个自定义图像，谢谢

我编辑了我的答案，虽然我不能 100% 确定它会起作用。

它给了我强制关闭（java.lang.RuntimeException）和错误显示到这一行：htmlTextView.setText(Html.fromHtml(getString(R.string.day), new ImageGetter(), null ));

你有关于这个错误的更多细节吗？但是，如果您以后想为图像添加其他样式（边框，...），您真的应该选择WebView