【JAVA UI】HarmonyOS Glide簡單使用第二篇（加載Gif和圓形圖片）

Glid是一個快速高效的圖像加載庫。Glid提供了一個易於使用的API、一個性能和可擴展的資源解碼管道和自動資源池。Glid支持提取、解碼和顯示視頻劇照、圖像和動畫GIF。Glid包括一個靈活的API，允許開發人員插入幾乎任何網絡堆棧。默認情況下，Glid使用基於HttpUrlConnection的自定義堆棧，但也包括插件到Google Volley項目或Square的OkHttp庫的實用程序庫。代碼實現：首先最重要的一步是引入Glide的依賴在工程目錄下的build.gradle文件repositories{}中添加

mavenCentral()

​

在entry目錄下的build.gradle文件Dependencies{}中添加

implementation 'io.openharmony.tpc.thirdlib:glide:1.1.3'

​

然後在config.json文件中添加網絡權限：

"deviceConfig": {
  "default": {
    "network": {
      "cleartextTraffic": true
    }
  }
},
{
  "name": "ohos.permission.INTERNET"
}

​

依賴和網絡權限添加完成後在MainAbilitySlice.Java文件中onStart()添加以下代碼：

//TODO 加載圓形圖片
                Image imageView = findComponentById(ResourceTable.Id_imageComponent);
                Glide.with(MainAbilitySlice.this)
                .load("https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2Ftx29%2F08151054265778673.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1657872223&t=19c23699beebabafec16b9e3f31ed8ac")
                .apply(RequestOptions.bitmapTransform(new CircleCrop()))
                .into(imageView);
//TODO 加載GIF圖片
        DraweeView image =  (DraweeView) findComponentById(ResourceTable.Id_image);
        Glide.with(MainAbilitySlice.this)
                .asGif()
                .load("http://dingyue.ws.126.net/2021/0506/52856347g00qsnuvr01hqc000a5005pg.gif")
                .into(image);

在ability_main.xml添加Image

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="start"
    ohos:orientation="vertical">

    <Text
        ohos:height="100vp"
        ohos:width="match_parent"
        ohos:text_color="red"
        ohos:text_alignment="center"
        ohos:text="glide加載圓形圖片"
        ohos:text_size="25vp"
        />

    <Image
        ohos:id="$+id:imageComponent"
        ohos:height="200vp"
        ohos:width="200vp"
        ohos:layout_alignment="center"
        ohos:image_src="#ed6262"
        />

    <Text
        ohos:height="100vp"
        ohos:text_alignment="center"
        ohos:width="match_content"
        ohos:text_color="red"
        ohos:layout_alignment="horizontal_center"
        ohos:text="glide加載gif圖片"
        ohos:text_size="25vp"
        />
    <com.bumptech.glide.load.resource.gif.drawableability.DraweeView
        ohos:id="$+id:image"
        ohos:height="200vp"
        ohos:width="200vp"
        ohos:layout_alignment="center"
        ohos:background_element="#123456">
    </com.bumptech.glide.load.resource.gif.drawableability.DraweeView>

</DirectionalLayout>

運行效果：

​

參考鏈接：https://gitee.com/HarmonyOS-tpc/glide

 

欲瞭解更多更全技術文章，歡迎訪問https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh