鸿蒙开发(18)---加载网络图片

简介: 鸿蒙开发(18)---加载网络图片

加载网络图片


在实际的项目中,我们并不总是显示资源文件的图片,在浏览资讯、微博时,基本上都是要从网络上进行加载的。


所以,掌握网络图片加载,或者说网络获取的相关知识,才是真正开发App的基础。当然,网络任务不能在主线程中进行,其中还涉及线程的相关知识。


获取网络图片

首先,我们需要获取网络图片。


一般来说,我们都是通过网址请求获取图片的输入流InputStream。示例代码如下所示(HttpsUtils):

public class HttpsUtils {
    private static InputStream inputStream;
    private static HttpsURLConnection connection;
    public static InputStream getInputStream(String urlStr,String methodType) {
        NetManager netManager = NetManager.getInstance(null);
        if (!netManager.hasDefaultNet()) {
            return null;
        }
        NetHandle netHandle = netManager.getDefaultNet();
        try {
            URL url = new URL(urlStr);
            URLConnection urlConnection = netHandle.openConnection(url, java.net.Proxy.NO_PROXY);
            if (urlConnection instanceof HttpsURLConnection) {
                connection = (HttpsURLConnection) urlConnection;
            }
            connection.setRequestMethod(methodType);
            connection.connect();
            inputStream = connection.getInputStream();
        } catch (IOException e) {
            e.printStackTrace();
        }
        return inputStream;
    }
    public static void closeStream() {
        try {
            if (inputStream == null) {
                return;
            }
            inputStream.close();
            if (connection == null) {
                return;
            }
            connection.disconnect();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}


如上面代码所示,我们获取图片,或者说获取网络信息主要分为4个步骤:


1.调用NetManager.getInstance(Context)获取网络管理的实例对象。

2.调用NetManager.getDefaultNet()获取默认的数据网络。

3.调用NetHandle.openConnection()打开一个URL。

4.通过URL链接实例访问网站或图片网址。


因为这里不仅涉及网络的请求,还涉及网络的管理。所以除了网络权限之外,我们还需要设置2个网络权限config.json:

"module": {
    "reqPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      },
      {
        "name": "ohos.permission.GET_NETWORK_INFO"
      },
      {
        "name": "ohos.permission.SET_NETWORK_INFO"
      }
    ],
}


当然,因为你没有主动切换网络,可以不用SET_NETWORK_INFO权限,但GET_NETWORK_INFO是必须的。


将图片输入流转换为PixelMap

因为我们的Image组件只能添加资源文件,以及PixelMap格式的图片。所以,我们需要将获取的网络数据转换为PixelMap。代码如下:

public class ImageUtils {
    public static PixelMap createPixelMap(String imageUrl) {
        InputStream inputStream = HttpsUtils.getInputStream(imageUrl, RequestMethod.GET.name());
        ImageSource.SourceOptions sourceOptions = new ImageSource.SourceOptions();
        sourceOptions.formatHint = "image/jpeg";
        ImageSource imageSource = ImageSource.create(inputStream,sourceOptions);
        PixelMap pixelMap = imageSource.createPixelmap(null);
        HttpsUtils.closeStream();
        return pixelMap;
    }
}


如上面代码所示,将InputStream转换为PixelMap分为以下4步骤:


1.首先创建SourceOptions,指定图片的格式

2.然后通过ImageSource.create()创建ImageSource

3.最后,通过imageSource.createPixelmap创建pixelMap


子线程进行网络请求

到这里,我们就完成了图片的获取,并且可以将获取的网络图片设置到Image组件中。


但是有GUI开发经验的程序员都应该知道,耗时任务(网络请求)是不能在主线程运行的,因为这样会造成卡顿。


所以,我们需要使用鸿蒙提供给我们的线程进行处理。示例如下:

public class MainAbilitySlice extends AbilitySlice {
    HiLogLabel TAG = new HiLogLabel(HiLog.LOG_APP, 0x00201, "TAG");
    private Button button;
    private Image image;
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);
        this.button=(Button)findComponentById(ResourceTable.Id_ability_main_button);
        this.image = (Image) findComponentById(ResourceTable.Id_ability_main_image);
        this.button.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                TaskDispatcher refreshUITask = createParallelTaskDispatcher("", TaskPriority.DEFAULT);
                refreshUITask.syncDispatch(()->{
                    PixelMap pixelMap = ImageUtils.createPixelMap("https://images-1300376177.cos.ap-shanghai.myqcloud.com/homepage1.jpg");
                    getContext().getUITaskDispatcher().asyncDispatch(new Runnable() {
                        @Override
                        public void run() {
                            //Image组件填充位图数据,ui界面更新
                            image.setPixelMap(pixelMap);
                            pixelMap.release();
                        }
                    });
                });
            }
        });
    }
}


ParallelTaskDispatcher:并发任务分发器,由Ability执行createParallelTaskDispatcher()创建并返回。


UITaskDispatcher:绑定到应用主线程的专有任务分发器, 由Ability执行getUITaskDispatcher()创建并返回。


网络请求枚举类

当然,上面的RequestMethod.GET.name()是一个枚举类,用于定义网络请求的各种方式。代码如下:

public enum RequestMethod {
    GET("GET"),
    POST("POST"),
    HEAD("HEAD"),
    OPTIONS("OPTIONS"),
    PUT("PUT"),
    DELETE("DELETE"),
    TRACE("TRACE");
    private String method;
    RequestMethod(String method) {
        this.method = method;
    }
    public String getMethod() {
        return method;
    }
    public void setMethod(String method) {
        this.method = method;
    }
}
}

运行之后,效果如下:


相关文章
|
3月前
|
开发者
鸿蒙开发:资讯项目实战之项目初始化搭建
目前来说,我们的资讯项目只是往前迈了很小的一步,仅仅实现了项目创建,步虽小,但概念性的知识很多,这也是这个项目的初衷,让大家不仅仅可以掌握日常的技术开发,也能让大家理解实际的项目开发知识。
鸿蒙开发:资讯项目实战之项目初始化搭建
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:外卖App
仓颉语言实战分享,教你如何用仓颉开发外卖App界面。内容包括页面布局、导航栏自定义、搜索框实现、列表模块构建等,附完整代码示例。轻松掌握Scroll、List等组件使用技巧,提升HarmonyOS应用开发能力。
|
3月前
|
缓存 JavaScript IDE
鸿蒙开发:基于最新API,如何实现组件化运行
手动只是让大家了解切换的原理,在实际开发中,可不推荐手动,下篇文章,我们将通过脚本或者插件,快速实现组件化模块之间的切换,实现独立运行,敬请期待!
111 0
鸿蒙开发:基于最新API,如何实现组件化运行
|
3月前
|
SQL 弹性计算 数据库
鸿蒙5开发宝藏案例分享---优化应用时延问题
鸿蒙性能优化指南来了!从UI渲染到数据库操作,6大实战案例助你提升应用流畅度。布局层级优化、数据加载并发、数据库查询提速、相机资源延迟释放、手势识别灵敏调整及转场动画精调,全面覆盖性能痛点。附赠性能自检清单,帮助开发者高效定位问题,让应用运行如飞!来自华为官方文档的精华内容,建议收藏并反复研读,共同探讨更多优化技巧。
|
3月前
|
存储 IDE 定位技术
【HarmonyOS 5】鸿蒙组件&模板服务详解 - 助力高效开发的利器
在移动应用开发领域,效率与质量始终是开发者追求的核心目标。鸿蒙系统作为新兴的操作系统,为开发者提供了丰富且强大的开发资源,其中鸿蒙组件&模板服务更是成为开发者快速构建高质量应用的得力助手。
120 0
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:健身App
本期分享一个健身App首页的布局实现,顶部采用Stack容器实现重叠背景与偏移效果,列表部分使用List结合Scroll实现可滚动内容。代码结构清晰,适合学习HarmonyOS布局技巧。
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:银行App
仓颉语言银行App项目分享,页面布局采用List容器,实现沉浸式体验与模块化设计。顶部资产模块结合Stack与Row布局,背景图与内容分离,代码清晰易懂;功能按钮部分通过负边距实现上移效果,圆角仅保留顶部;热门推荐使用header组件,结构更规范。整体代码风格与ArkTS相似,但细节更灵活,适合金融类应用开发。
|
3月前
|
缓存
鸿蒙5开发宝藏案例分享---Swiper组件性能优化实战
本文分享了鸿蒙系统中Swiper组件的性能优化技巧,包括:1) 使用`LazyForEach`替代`ForEach`实现懒加载,显著降低内存占用;2) 通过`cachedCount`精准控制缓存数量,平衡流畅度与内存消耗;3) 利用`onAnimationStart`在抛滑时提前加载资源,提升构建效率;4) 添加`@Reusable`装饰器复用组件实例,减少创建开销。实际应用后,图库页帧率从45fps提升至58fps,效果显著。适合处理复杂列表或轮播场景,欢迎交流经验!
|
3月前
|
JSON 中间件 Go
Go 网络编程:HTTP服务与客户端开发
Go 语言的 `net/http` 包功能强大,可快速构建高并发 HTTP 服务。本文从创建简单 HTTP 服务入手,逐步讲解请求与响应对象、URL 参数处理、自定义路由、JSON 接口、静态文件服务、中间件编写及 HTTPS 配置等内容。通过示例代码展示如何使用 `http.HandleFunc`、`http.ServeMux`、`http.Client` 等工具实现常见功能,帮助开发者掌握构建高效 Web 应用的核心技能。
204 61
|
2月前
|
存储 SQL 前端开发
跟老卫学HarmonyOS开发:ArkTS关系型数据库开发
本节以“账本”为例,使用关系型数据库接口实现账单的增、删、改、查操作。通过创建ArkTSRdb应用,演示如何操作RdbStore进行数据管理,并结合界面按钮实现交互功能。
90 0
跟老卫学HarmonyOS开发:ArkTS关系型数据库开发

热门文章

最新文章