android下webp的學習和使用

android下webp的學習和使用

 

最近需求要給app做個漂亮、大氣的引導頁，找UI溝通，UI激情滿滿，不久就發過來了，四張圖片，果然很漂亮，可一看大小，嚇尿 4M多，趕快再溝通，不但要漂亮、大氣，還要小，越小越好，最終經過多次溝通，發過來四張圖片，總共400多K，說不能再小了，再小就影響顯示效果了。

產品過來說，app怎麼這麼大了，要小，越小越好，馬上要地推了，越小地推越容易，成本也越低。

沒辦法只有開發這邊想辦法了，網上搜了下，發現圖片還有webp模式，Google推薦，國內很多app也都採用了，下載轉化工具iSparta ,把四張引導圖 轉化後果然小多了，由原來的400多k減少到不到100K，關鍵是效果幾乎沒受到影響，至少肉眼看起來沒明顯失真，於是果斷把大於100K的圖都轉化成webp顯示。

1 、首先需要把靶心圖表片轉化成webp格式的圖片，使用iSparta轉化，很方便快捷，轉化完把原圖刪除，把轉化後的尾碼為.webp的圖片拷貝到項目原圖的位置

2、載入so檔案，官方提供的libwebp.jia包

 

         public static Bitmap webpToBitmap(byte[] encoded) {int[] width = new int[] { 0 };int[] height = new int[] { 0 };byte[] decoded = libwebp.WebPDecodeARGB(encoded, encoded.length, width,height);int[] pixels = new int[decoded.length / 4];ByteBuffer.wrap(decoded).asIntBuffer().get(pixels);return Bitmap.createBitmap(pixels, width[0], height[0],Bitmap.Config.ARGB_8888);}public static byte[] streamToBytes(InputStream in) {ByteArrayOutputStream out = new ByteArrayOutputStream(1024);byte[] buffer = new byte[1024];int len = -1;try {while ((len = in.read(buffer)) >= 0) {out.write(buffer, 0, len);out.flush();}} catch (java.io.IOException e) {e.printStackTrace();} finally {try {in.close();} catch (Exception e) {e.printStackTrace();}}return out.toByteArray();}

 

3、 android4.0以上已經支援webp格式圖片，即4.0以上我們可以像使用其它格式圖片一樣直接使用，4.0以下的需做特別處理 ，封裝使用的方法：

 

 

       public static Drawable getDrawable(int id,Context context){ return new BitmapDrawable(getBitmap(id, context));}public static Bitmap getBitmap(int resId ,Context context){InputStream rawImageStream = context.getResources().openRawResource(resId);byte[] data = com.dingji.webpdemo.WebpUtils.streamToBytes(rawImageStream);    return com.dingji.webpdemo.WebpUtils.webpToBitmap(data);}/** * 賦值webp * @param id * @param imageview * @param context */public static void setWebPValue(int resId,ImageView iv,Context context){if(Build.VERSION.SDK_INT
 
 4、項目裡在需要的地方直接調用
 
      ImageView iv=(ImageView) view.findViewById(R.id.guideImg);      WebpUtils.setWebPValue(R.drawable.guide_img_one, iv, context);

 
使用webp的優點： 使用方便，當然最重要的是 能在不失真的情況下大幅降低圖片的大小
缺點： 圖片變小肯定是有代價的，那就是載入耗時增加，不過測試增加的時間是 幾十毫秒層級的，基本在承受範圍內。