[发明专利]加载占位图的方法和装置

说明书

本发明公开了一种加载占位图的方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括：在使用图片组件开始加载目标图片时：通过预先将占位图的地址信息赋值于所述图片组件的占位图属性，在目标图片对应的显示位置加载所述占位图；其中，所述图片组件支持加载提示属性，用于在加载图片过程中显示旋转的提示图标；所述占位图属性是将所述加载提示属性的自动旋转效果去除后得到的。该实施方式可通过修改现有图片组件的相关属性生成其占位图属性，从而在不影响应用性能的前提下实现占位图效果。

技术领域

本发明涉及计算机技术领域，尤其涉及加载占位图的方法和装置。

背景技术

React Native是一种开源的跨平台移动应用开发框架，目前支持安卓平台和iOS平台。其中，安卓(Android)、iOS均为可安装在移动设备的操作系统。在现有的ReactNative框架中，一般通过配置图片组件的多种属性来加载目标图片，为了提升用户体验，实际应用中需要在开始加载以及加载失败时显示占位图。但是，现有React Native安卓版本中的Image组件并不支持占位图属性，实际应用中需要叠加两张图片实现占位图效果，这会影响应用性能。

此外，由于现有的React Native不支持网页端开发，因此在应用开发过程中，往往需要先使用React Native编写安卓端和iOS端的代码，之后利用React Web等转换工具向网页端转换。可见，现有技术无法实现安卓端、iOS端和网页端的真正融合，也无法提供统一接口在上述三端实现占位图的加载。

发明内容

有鉴于此，本发明实施例提供一种加载占位图的方法和装置，可通过修改现有图片组件的相关属性生成其占位图属性，从而在不影响应用性能的前提下实现占位图效果。

为实现上述目的，根据本发明的一个方面，提供了一种加载占位图的方法。

本发明实施例的加载占位图的方法包括：在使用图片组件开始加载目标图片时：通过预先将占位图的地址信息赋值于所述图片组件的占位图属性，在目标图片对应的显示位置加载所述占位图；其中，所述图片组件支持加载提示属性，用于在加载图片过程中显示旋转的提示图标；所述占位图属性是将所述加载提示属性的自动旋转效果去除后得到的。

可选地，所述方法依据React Native的安卓版本实现；所述图片组件为所述安卓版本中的Image组件；所述占位图为默认本地图片或者用户指定的本地图片；所述地址信息为由所述占位图的路径信息构成的数据对象；所述加载提示属性为loadingIndicatorSrc属性。

为实现上述目的，根据本发明的一个方面，提供了另一种加载占位图的方法。

本发明实施例的加载占位图的方法包括：在React Native的安卓版本、ReactNative的iOS版本和React Native的网页端转换工具之上进行封装，针对安卓端、iOS端和网页端设置统一的组件和属性；所述统一的组件和属性包括：经过所述封装获得的图片组件和该图片组件的占位属性；其中，所述占位属性被配置为与以下属性保持属性值一致：所述安卓版本中图片组件的占位图属性、所述iOS版本中图片组件的默认源文件属性、所述网页端转换工具中由开始加载事件触发的图片标签的源文件属性；所述安卓版本中的图片组件支持加载提示属性，用于在加载图片过程中显示旋转的提示图标；所述占位图属性是将所述加载提示属性的自动旋转效果去除后得到的；以及，所述方法在安卓端、iOS端或网页端的执行步骤包括：在使用经过所述封装获得的图片组件开始加载目标图片时：通过预先将占位图的地址信息赋值于所述占位属性，在目标图片对应的显示位置加载所述占位图。