圖片壓縮知識梳理(8) WebP 使用詳解

澤毛發表於2017-12-21
Web

一、WebP是什麼

WebP、VectorDrawable、PNG、JPG一起構成了Android中四種圖片的儲存格式，在學習這篇文章之前，最好能看一下下面的視訊和文章，這樣能對WebP有一個大概的瞭解：

下面是上文對於WebP的概述，今天這篇文章，我們就一起來看如何在App中使用WebP。

WebP是一種支援有失真壓縮和無失真壓縮的圖片檔案格式，派生自影像編碼格式VP8。根據Google的測試，無失真壓縮後的WebP比PNG檔案少了45％的檔案大小，即使這些PNG檔案經過其他壓縮工具壓縮之後，WebP還是可以減少28％的檔案大小。

二、相容性問題

和VectorDrawable類似，WebP也存在相容性的問題：

  • 在Android 4.0以前，預設是不支援*.webp，這時候如果圖片源是*.webp，那麼就需要匯入外部的依賴，將*.webp轉換成二進位制流，再進行展示。
  • 在Android 4.0+到Android 4.2.1之間，只支援完全不透明的*.webp圖片。
  • 在Android 4.2.1之後，對於*.webp已經完全支援，我們完全可以像使用PNG和JPG檔案一樣使用它。

三、PNG/JPG和WebP格式的互相轉換

目前，對於PNG/JPG和WebP格式之間的互相轉換，主要有下面兩種方式：

3.1 使用Google提供的標準工具

對於官方的轉換工具的介紹，可以檢視下面這篇文件：developers.google.cn/speed/webp/…

圖片壓縮知識梳理(8) WebP 使用詳解
下面，我們就來演示一下整個轉換的過程：

3.2 使用開源的轉換工具

此外，我們也可以使用開源的轉換工具：isparta

圖片壓縮知識梳理(8) WebP 使用詳解

3.3 Android Studio自帶的轉換工具

在Android Studio 2.3之後，已經內建了對於WebP格式轉換的功能，我們只需要在圖片資源上點選右鍵，彈出選單的最後一個選項：

圖片壓縮知識梳理(8) WebP 使用詳解
之後可以選擇轉換的質量，我們採用預設的配置：
圖片壓縮知識梳理(8) WebP 使用詳解
在下一個介面，我們可以通過拖動底下的遊標，來改變編碼的質量，並實時檢視轉換後的圖片展示效果：
圖片壓縮知識梳理(8) WebP 使用詳解

四、WebP常規方案

如果Android的版本為4.2.1以上，那麼像使用普通圖片一樣就可以了：

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.demo.lizejun.repotransition.WebPActivity">
    <ImageView
        android:id="@+id/web_p_1"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:src="@drawable/ic_bg"/>
</LinearLayout>
複製程式碼

展示效果如下：

圖片壓縮知識梳理(8) WebP 使用詳解

五、WebP相容低版本方案

假如當前的Android版本不支援webP，那麼就需要匯入外部依賴：webp-android，關於相容性的問題，大家可以參考下面這篇文章： Android Webp 完全解析 快來縮小apk的大小吧

六、參考文獻

1.Image Compression For Android Developers 2.WebP 探尋之路 3.Android Webp 完全解析 快來縮小apk的大小吧 4.關於Android4.+(4.0~4.2.1)上無損、透明webp影像不顯示問題分析

相關文章