Customize image specified from HTML string

Question

One of my actions on the project, including the long text written in the string.xml file, I add some images from the resource to textview, because after each phrase there is an image, then the next text phrase, then the image, etc.

I get these images from a 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 the 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 referring to a drawing style to add a border around the images, for example.

I tried using the varying width and height of the foe code:

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

but that will not work.

Any advice to achieve this will be appreciated, thanks.

Answer 1

Finally, I will return to this solution, which allows you to change the width and height for each image , but another point is not reached, which refers to the reverse form as a background , still work on this:

  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 arises from Html.fromHtml() , which only supports a very limited set of tags and attributes . <img> supported, but setting the width and height of the image is not. This can be achieved using TextView (using SpannableString and ImageSpan ), but it is more complicated and not very flexible.

Instead, you should use a WebView that handles HTML correctly.

Easy to load line:

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

You can find several examples in the documentation .

---

Just for comparison, here is an example without using 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 cannot use HTML.