Customize Image referred From Html string

Question

One of my project activities including long text written in string.xml ,i add some images from resource within textview ,as after each phrase there is image then next the text phrase then image and so on ,

i getting that images from string using this code :

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;
        }
    };

}

and writing html img tag in string.xml as:

<img src="image1.jpg">

i want to be able to customize each image by changing its width and height or refer it to drawable style to add border around images for example .

i tried using the bellow code foe changing width and height :

<img src="image1.jpg" width="100" height="150"> 

but it doesn't work .

any advice to achieve that will be appreciated , thanks .

Answer 1

I finally end up to this solution which allow to change width and height for each image but still one point not achieved which is referring image to drawable shape as background , still work on it :

 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;
       };
      }
    }

Answer 2

The problem comes from Html.fromHtml(), which supports only a very limited set of tags and attributes. <img> is supported, but setting the width and height of the image is not. It's possible to achieve it with a TextView (by using SpannableString and ImageSpan), but it's more complicated and not very flexible.

Instead, you should use a WebView which handles HTML properly.

It's easy to load a string :

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

You can find more examples in the documentation.

---

Just for comparison, here is an example without using a 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);
}

It will load much faster, but you can't use HTML.