Est-il possible d'afficher des images à partir de code html dans un TextView Android?

Question

Étant donné le code HTML suivant:

<p>This is text and this is an image <img src="http://www.example.com/image.jpg" />.</p>

Est-il possible de faire de l'image de rendu? Lors de l'utilisation de cet extrait: mContentText.setText(Html.fromHtml(text));, j'obtiens une boîte cyan avec des bordures noires, m'amenant à croire qu'un TextView une certaine idée de ce qu'est une balise img est.

Answer 1

Si vous avez un coup d'oeil à la documentation de Html.fromHtml(text) vous verrez qu'il est dit:

Tout <img> balises dans le code HTML est affiché comme un générique de remplacement de l'image qui votre programme peut alors passer à travers et de le remplacer avec de vraies images.

Si vous ne voulez pas faire ce remplacement vous-même, vous pouvez utiliser les autres Html.fromHtml() méthode qui prend un Html.TagHandler et Html.ImageGetter comme arguments ainsi que le texte à analyser.

Dans votre cas, vous pouvez analyser null comme pour l' Html.TagHandler mais vous aurez besoin de mettre en place votre propre Html.ImageGetter comme il n'y a pas un défaut de mise en œuvre.

Cependant, le problème que vous allez avoir est que l' Html.ImageGetter a besoin pour fonctionner de manière synchrone et si vous êtes de télécharger des images depuis le web, vous aurez probablement envie de le faire de manière asynchrone. Si vous pouvez ajouter toutes les images que vous souhaitez afficher en tant que ressources dans votre application la votre ImageGetter mise en œuvre devient beaucoup plus simple. Vous pourriez vous en sortir avec quelque chose comme:

private class ImageGetter implements Html.ImageGetter {

    public Drawable getDrawable(String source) {
        int id;

        if (source.equals("stack.jpg")) {
            id = R.drawable.stack;
        }
        else if (source.equals("overflow.jpg")) {
            id = R.drawable.overflow;
        }
        else {
            return null;
        }

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

Vous souhaiterez probablement de comprendre quelque chose de plus intelligent pour la cartographie des chaînes à l'Id de ressource.

Answer 2

J'ai connu le même problème et j'ai trouvé un assez propre solution: Après avoir Html.fromHtml (), vous pouvez exécuter une AsyncTask qui effectue une itération sur toutes les balises, va chercher les images et les affiche ensuite.

Ici vous pouvez trouver un peu de code que vous pouvez utiliser (mais il a besoin d'un certain degré de personnalisation): https://gist.github.com/1190397

Answer 3

J'ai utilisé Dave Webb réponse, mais simplifié un peu. Tant que l'Id de ressource restera le même en cours d'exécution dans votre cas d'utilisation, il n'y a pas vraiment besoin d'écrire votre propre classe implémentant Html.ImageGetter et le désordre autour de la source-les chaînes de caractères.

Ce que j'ai fait a l'aide de l'ID de la ressource en tant que source de chaîne:

final String img = String.format("<img src=\"%s\"/>", R.drawable.your_image);
final String html = String.format("Image: %s", img);

et de l'utiliser directement:

Html.fromHtml(html, new Html.ImageGetter() {
  @Override
  public Drawable getDrawable(final String source) {
    Drawable d = null;
    try {
      d = getResources().getDrawable(Integer.parseInt(source));
      d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
    } catch (Resources.NotFoundException e) {
      Log.e("log_tag", "Image not found. Check the ID.", e);
    } catch (NumberFormatException e) {
      Log.e("log_tag", "Source string not a valid resource ID.", e);
    }

    return d;
  }
}, null);

Answer 4

Aussi, si vous voulez faire le remplacement vous-même, le personnage que vous devez rechercher est [  ].

Mais si vous utilisez Eclipse, il va paniquer lorsque vous tapez cette lettre dans un [remplacer] déclaration indiquant que les conflits avec Cp1252 - c'est une Éclipse de bug. Pour la fixer, aller à

Fenêtre -> Préférences -> Général -> espace de travail -> fichier Texte de codage,

et sélectionnez [UTF-8]

Answer 5

Vous pouvez également écrire votre propre analyseur de tirer les URL de toutes les images et ensuite créer dynamiquement de nouvelles imageviews et passer dans l'url.