Android: 如何在 WebView 中显示位图？

Question

Android: 如何在 WebView 中显示位图？

10

我正在使用WebView来显示类似地图的图片，因为内置了平移和缩放功能。然而，我需要在地图上的特定点位上叠加其他信息（标记等），并显示所有内容。

因此，我将基础地图图片作为位图，并在其上叠加其他图像（使用Canvas和更多的位图），从而得到具有所有信息的最终位图。因为我需要在运行时编辑图像，所以不能使用预制文件。实现位图叠加不是问题，问题在于我不知道如何轻松地使用平移和缩放功能显示结果图片。

有没有一种方法可以使用WebView来显示位图？或者有其他建议吗？

- breadbin

在Android中有一些非常好的库支持平移和缩放。一个例子是 - https://github.com/sephiroth74/ImageViewZoom - Heitara

5个回答

2

如果您想在webview中加载图像，就不需要使用占位符。

您可以直接在webview中加载dataurl。例如：

ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
bitmap.compress(Bitmap.CompressFormat.PNG, 100, byteArrayOutputStream);
byte[] byteArray = byteArrayOutputStream.toByteArray();
String imgageBase64 = Base64.encodeToString(byteArray, Base64.DEFAULT);
    String dataURL= "data:image/png;base64," + imgageBase64;

webview.loadUrl(dataURL); //pass the bitmap base64 dataurl in URL parameter

希望这能帮助其他人！:-)

- Rafique Mohammed

它显示了PDF文件，但亮度似乎有些问题。在我的情况下，它太暗了。 - pgeimer

1

通常在Webview中，我们可以使用HTML标签来设置图像，这不会造成任何问题。

无论如何，请使用此链接获取示例问题和答案：

- itsrajesh4uguys

1

答案似乎是否定的：在Webview中显示本地位图对象而不将其保存到文件中是不可能的。

- breadbin

2

错误的。创建Img标记以显示内联图像的HTML电子邮件。使用<img>标记，但src不是URL，而是base64编码的图像数据。img src仍然可以通过JavaScript进行修改。 - JSON

可以加载和显示位图。请查看Teepee SONY的答案。它解释了如何实现。 - Heitara

-2

你不需要 Bitmap，只需要它的名称即可。尝试以下操作：

html = "<html><img src=\"" + imageUrl
                        + "\"></html>";
final WebView webView = (WebView) view
                    .findViewById(R.id.yourWebView);
wvImageView.getSettings().setJavaScriptEnabled(true);
wvImageView.loadDataWithBaseURL("", html, "text/html", "utf-8", "");

这将在WebView上显示你的图片。如果您想提供缩放功能，请尝试这个：

webView.getSettings().setSupportZoom(true);
webView.getSettings().setBuiltInZoomControls(true);

- Shrikant Ballal

当您在地图图像上叠加许多图像时，您如何创建这些图像的位图，并将这些图像放置在地图图像上？如果您可以创建图像的位图，则也可以获取其名称。因此，您只需要检索其名称。但是我仍然想问您，您将如何将图像放置在地图图像上？这对我来说也将是非常有用的信息。 - Shrikant Ballal

有一些误解。我的方法不是将位图叠加在一起制作一个位图。我只是在评论你的问题。你说：“所以我将我的基础地图图像作为位图，然后在其上覆盖其他图像（使用画布和更多的位图），从而给我一个包含所有信息的最终位图。”我想知道你是如何实现这个的... - Shrikant Ballal

我使用以下代码将一个位图覆盖在另一个位图上：

public Bitmap overlayBitmaps(Bitmap baseImg, Bitmap overlayImg) {
 Bitmap finalImg = Bitmap.createBitmap(baseImg.getWidth(), baseImg.getHeight(), baseImg.getConfig());
 Canvas canvas = new Canvas (finalImg); 
 canvas.drawBitmap(baseImg, new Matrix(), null);
 canvas.drawBitmap(overlayImg, new Matrix(), null);
 
 return finalImg; 
}

我从未说过您正在叠加图像，我所问的是如何获取您所说需要使用的图像路径，以便在Webview中显示位图对象？ - breadbin

我不确定你所指的名称形式是什么 - 如果它不是变量名称，那么不，我不能。 - breadbin

我猜Shrikant完全没有理解OP的问题。 - user1914692

显示剩余7条评论

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- peter.bartos · Accepted Answer

使用其rajesh4uguys的链接，我创建了此代码片段：

// Desired Bitmap and the html code, where you want to place it
Bitmap bitmap = YOUR_BITMAP;
String html="<html><body><img src='{IMAGE_PLACEHOLDER}' /></body></html>";

// Convert bitmap to Base64 encoded image for web
ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
bitmap.compress(Bitmap.CompressFormat.PNG, 100, byteArrayOutputStream);
byte[] byteArray = byteArrayOutputStream.toByteArray();
String imgageBase64 = Base64.encodeToString(byteArray, Base64.DEFAULT);
    String image = "data:image/png;base64," + imgageBase64;

// Use image for the img src parameter in your html and load to webview
html = html.replace("{IMAGE_PLACEHOLDER}", image);
webview.loadDataWithBaseURL("file:///android_asset/", html, "text/html", "utf-8", "");