Générer bitmap à partir de code HTML dans Android

Comment pouvez-vous générer une image à partir de HTML dans Android?

Pouvez le WebView être utilisé pour cela ou est-il une meilleure approche (comme peut-être à l'aide de la WebView moteur de rendu directement)? Comment?

J'aimerais implémenter la méthode suivante...

public Bitmap toBitmap(Context context, String html, Rect rect);

...où html est le code html pour le rendu et rect est le cadre du bitmap.

Vous pourriez envisager d'ajouter un peu plus de cent mots expliquant que "générer des images dynamiques en HTML".
En un mot, je veux générer une image à partir de rendu HTML. J'ai enlevé "dynamique" et reformulé dans le cas où il a été source de confusion.
FWIW, voici ma tentative de solution: stackoverflow.com/a/41354684/6684508

OriginalL'auteur hpique | 2011-01-08

  1. 15

    Une méthode synchrone qui génère une image à partir d'une chaîne HTML à l'aide d'une WebView, et peut être utilisé à l'intérieur d'une AsyncTask:

    public Bitmap getBitmap(final WebView w, int containerWidth, int containerHeight, final String baseURL, final String content) {
final CountDownLatch signal = new CountDownLatch(1);
final Bitmap b = Bitmap.createBitmap(containerWidth, containerHeight, Bitmap.Config.ARGB_8888);
final AtomicBoolean ready = new AtomicBoolean(false); 
w.post(new Runnable() {
@Override
public void run() {
w.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
ready.set(true);
}
});
w.setPictureListener(new PictureListener() {
@Override
public void onNewPicture(WebView view, Picture picture) {
if (ready.get()) {
final Canvas c = new Canvas(b);
view.draw(c);
w.setPictureListener(null);
signal.countDown();
}
}
});
w.layout(0, 0, rect.width(), rect.height());
w.loadDataWithBaseURL(baseURL, content, "text/html", "UTF-8", null);
}});
try {
signal.await();
} catch (InterruptedException e) {
e.printStackTrace();
}
return b;
}

    Il a quelques limitations, mais c'est un début.

    OriginalL'auteur hpique

  2. 6

    Vous pouvez utiliser la méthode de tirage pour le laisser dessiner dans une image de votre choix. J'ai fait un exemple, n'oubliez pas d'internet et externe des droits de stockage de votre manifeste:

    
public class MainActivity extends Activity {
private WebView mWebView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mWebView = new WebView(this);
setContentView(mWebView);
mWebView.loadUrl("http://tea.ch");
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode != KeyEvent.KEYCODE_BACK) return super.onKeyDown(keyCode, event);
Bitmap bm = Bitmap.createBitmap(200, 300, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bm);
mWebView.draw(c);
OutputStream stream = null;
try {
stream = new FileOutputStream(Environment.getExternalStorageDirectory() +"/teach.png");
bm.compress(CompressFormat.PNG, 80, stream);
if (stream != null) stream.close();
} catch (IOException e) {
} finally {
bm.recycle();
}
    
return super.onKeyDown(keyCode, event);
}
}

    Donc il n'y a aucun moyen de sauter la WebView et d'utiliser directement son moteur de rendu?
    C'est une vue, vous ne pouvez garder une instance comme un moteur de rendu. Vous devez définir la taille pour un rendu comme Laoyout params-vous comme: LayoutParams params = new LayoutParams(500,500); mWebView.setLayoutParams(params); mWebView.mise en page(0, 0, 500, 500);
    Je viens de tester, il vous suffit de définir mWebView.mise en page(0, 0, 500, 500);
    +1 pour le test. 🙂 Vais essayer et d'accepter la réponse si ça fonctionne.
    Malheureusement cette solution ne fonctionne qu'à l'intérieur d'une activité. Savez-vous comment il pourrait être mis en œuvre dans un thread de travail?

    OriginalL'auteur Phyrum Tea

  3. 0

    Pourquoi ne pas utiliser la WebView méthode : capturePicture() qui renvoie une Image et est disponible depuis l'API de niveau 1 ?

    Il renvoie une image de l'ensemble du document.

    Vous pouvez ensuite recadrer le résultat avec votre rectangle et enregistrer l'image bitmap à partir de là.

    Notez que capturePicture() était dépréciée de l'API de niveau 19: developer.android.com/reference/android/webkit/...

    OriginalL'auteur Yahel

  4. 0

    Cet exemple montre comment capturer webView dernière image (il attend jusqu'à ce que webview complète de rendu de l'image), c'est un exemple de convertir le code HTML de PNG en utilisant Android

    Code D'Activité

    public class HtmlViewer extends Activity {
private String HTML; 
private Context ctx;
private Picture pic = null;
private int i=0; suppose this is the last pic
private int oldi = 0; 
private Timer myTimer; //timer for waiting until last picture loaded
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_html_viewer);
Intent intent = getIntent();
HTML = intent.getStringExtra("HTML");
ctx = this;
WebView wv = (WebView)findViewById(R.id.webView1);
wv.setPictureListener(new PictureListener(){
public void onNewPicture(WebView view, Picture picture) {
Log.w("picture", "loading.." + String.valueOf(view.getProgress()));
pic = picture;
i++;
}
});
wv.loadData(HTML, "text/html; charset=utf-8", null);
wv.setWebViewClient(new WebViewClient()     
{
public void onPageFinished(WebView wv, String url)
{
Picture p = wv.capturePicture();
myTimer = new Timer();
myTimer.schedule(new TimerTask() {          
@Override
public void run() {
if (i > oldi)
oldi = i;
else
if (i != 0)
{
Log.w("picture", "finished");
cancel();
Picture picture = pic;
Log.w("picture", "onNewPicture- Height"+ picture.getHeight());
Log.w("picture", "onNewPicture- Width"+ picture.getWidth());
File sdCard = Environment.getExternalStorageDirectory();
if (picture != null)
{
Log.w("picture", " P OK");
Bitmap image = Bitmap.createBitmap(picture.getWidth(),picture.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(image);
picture.draw(canvas);
Log.w("picture", "C OK");
if (image != null) {
Log.w("picture", "I OK");
ByteArrayOutputStream mByteArrayOS = new ByteArrayOutputStream();
image.compress(Bitmap.CompressFormat.PNG, 90, mByteArrayOS);
try {
File file = new File(sdCard, "AccountView.PNG");
FileOutputStream fos = new FileOutputStream(file);
fos.write(mByteArrayOS.toByteArray());
fos.flush();
fos.close();                                        
Log.w("picture", "F OK " + String.valueOf(mByteArrayOS.size()) + " ? " + String.valueOf(file.length()));
Intent sharingIntent = new Intent(Intent.ACTION_SEND);
Uri screenshotUri = Uri.fromFile(file);                      
sharingIntent.setType("image/png");
sharingIntent.putExtra(Intent.EXTRA_STREAM, screenshotUri);
startActivity(Intent.createChooser(sharingIntent, getResources().getString(R.string.ACCOUNT_VIEW_TITLE)));                      
((Activity)ctx).finish();
} catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}               
}
}
}
}, 0, 1000);
Log.w("picture", "done");
loadcompleted = true;
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
//Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_html_viewer, menu);
return true;
}
}

    Disposition

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".HtmlViewer" >
<WebView
android:id="@+id/webView1"
android:layout_width="match_parent"
android:layout_height="match_parent" />

    OriginalL'auteur Ahmad Albash