创建从uncom $ P $一个PNG pssed原始PNG数据 [英] Creating a PNG from uncompressed raw PNG data

问题描述

我用这 Android的屏幕截图库捕捉屏幕截图。我想表明这张截图的网页浏览器。

我已经写在计算机上的小应用程序接口它连接到Android手机和连接code捕获的屏幕截图为base64。

 字符串的base64 = Base64.getEn codeR（）带codeToString（字节）。
 

这Base64是正在通过WebSocket的发送到网页。下面是我的HTML / JS code，应在画布上绘制图像。我已存储在一个文本文件中的base64图像数据测试的目的。

 ＆LT; D​​IV的风格=背景：AQUA;宽度：500像素，高度：660px;＆GT;    ＆LT;帆布风格=宽度：480像素，高度：640像素; ID =SIM卡＆GT;
    ＆LT; /帆布＆GT;
＆LT; / DIV＆GT;＆LT;脚本类型=文/ JavaScript的＆GT;
    VAR CTX;
    VAR WIDTH = 480;
    VAR HEIGHT = 640;    （函数的start（）{
        CTX =的document.getElementById（SIM）的getContext（2D）。
        loadFromFile（）;
    }）（）;    功能的LoadImage（数据）{        VAR图像=新的图像（）;
        image.onload =功能（）{
            //这个部分从来没有执行
            ctx.drawImage（图像，0，0）;
            的console.log（图像装！）;
        }        image.src =数据：图像/ PNG; BASE64，+数据;
    }    功能loadFromFile（）{
        //请从** HTTPS获取数据：//app.box.com/s/e19ww51fd37h4sy8getjnag31ud6tpp9**
        var文件=imagefile.txt;        VAR rawFile =新XMLHtt prequest（）;
        rawFile.open（GET，文件，真正的）;        rawFile.onreadystatechange =功能（）{
            如果（rawFile.readyState === 4）{
                如果（rawFile.status === 200 || rawFile.status == 0）{
                    VAR数据= rawFile.responseText;
                    的console.log（数据加载：+ data.length）;                    的LoadImage（数据）;
                }
            }
        }
        rawFile.send（NU​​LL）;
    }
＆LT; / SCRIPT＆GT;
 

为了方便起见，这里是同一code的的jsfiddle 。

请指向正确的算法作为如何产生从原始uncom pressed数据的PNG。 code样品将是巨大的;）

感谢

解决方案

 公共静态字符串连接codeTobase64（位图图像​​）
{
位图immagex =图像;
ByteArrayOutputStream BAOS =新ByteArrayOutputStream（）;
immagex.com preSS（Bitmap.Com pressFormat.JPEG，100，BAOS）;
字节[] B = baos.toByteArray（）;
字符串imageEn codeD = Base64.en codeToString（B，Base64.DEFAULT）;Log.e（看，imageEn codeD）;
返回imageEn codeD;
}公共静态位图德codeBase64（字符串输入）{
字节[]德codedByte = Base64.de code（输入，0）;
返回BitmapFactory.de codeByteArray的（德codedByte，0，德codedByte.length）; }
 

I am using this Android Screenshot Library to capture screenshots. I want to show this screenshot in web browser.

I have written a small socket app on PC which connects to Android phone and encode the captured screenshot to base64.

String base64 = Base64.getEncoder().encodeToString(bytes);

This base64 is being sent to web page over websocket. Below is my html/JS code which should draw the image on canvas. I have stored the base64 image data in a text file for test purpose.

<div style="background: aqua; width: 500px; height: 660px;">

    <canvas style="width: 480px; height: 640px;" id="sim">
    </canvas>
</div>

<script type="text/javascript">
    var ctx;
    var width = 480;
    var height = 640;

    (function start() {
        ctx = document.getElementById("sim").getContext("2d");
        loadFromFile();
    })();

    function loadImage(data) {

        var image = new Image();
        image.onload = function() {
            //this part never executes
            ctx.drawImage(image, 0, 0);
            console.log("images loaded!");
        }

        image.src = "data:image/png;base64," + data;
    }

    function loadFromFile() {
        //please get data from **https://app.box.com/s/e19ww51fd37h4sy8getjnag31ud6tpp9**
        var file = "imagefile.txt";

        var rawFile = new XMLHttpRequest();
        rawFile.open("GET", file, true);

        rawFile.onreadystatechange = function() {
            if (rawFile.readyState === 4) {
                if (rawFile.status === 200 || rawFile.status == 0) {
                    var data = rawFile.responseText;
                    console.log("data loaded: " + data.length);

                    loadImage(data);
                }
            }
        }
        rawFile.send(null);
    }
</script>

For convenience, here is the JsFiddle of same code.

Please point to right algorithm as how to generate the PNG from the raw uncompressed data. code sample would be great ;)

Thanks

解决方案

public static String encodeTobase64(Bitmap image)
{
Bitmap immagex=image;
ByteArrayOutputStream baos = new ByteArrayOutputStream();  
immagex.compress(Bitmap.CompressFormat.JPEG, 100, baos);
byte[] b = baos.toByteArray();
String imageEncoded = Base64.encodeToString(b,Base64.DEFAULT);

Log.e("LOOK", imageEncoded);
return imageEncoded;
}

public static Bitmap decodeBase64(String input) 

{
byte[] decodedByte = Base64.decode(input, 0);
return BitmapFactory.decodeByteArray(decodedByte, 0, decodedByte.length); }

这篇关于创建从uncom $ P $一个PNG pssed原始PNG数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！