Skip to content

Latest commit

 

History

History
93 lines (69 loc) · 3.98 KB

react-native-image-gallery.md

File metadata and controls

93 lines (69 loc) · 3.98 KB

模板版本：v0.2.0

react-native-image-gallery

Supported platforms License

Tip

Github 地址

安装与使用

请到三方库的 Releases 发布地址查看配套的版本信息：@react-native-oh-tpl/react-native-image-gallery Releases 。对于未发布到npm的旧版本，请参考安装指南安装tgz包。

进入到工程目录并输入以下命令：

npm

npm i @react-native-oh-tpl/react-native-image-gallery

yarn

yarn add @react-native-oh-tpl/react-native-image-gallery

快速使用：

[!WARNING] 使用时 import 的库名不变。

import Gallery from 'react-native-image-gallery';

  render() {
    return (
      <Gallery
        style={{ flex: 1, backgroundColor: 'black' }}
        images={[
          { source: require('yourApp/image.png'), dimensions: { width: 150, height: 150 } },
          { source: { uri: 'http://i.imgur.com/XP2BE7q.jpg' } },
          { source: { uri: 'http://i.imgur.com/5nltiUd.jpg' } },
          { source: { uri: 'http://i.imgur.com/6vOahbP.jpg' } },
          { source: { uri: 'http://i.imgur.com/kj5VXtG.jpg' } }
        ]}
      />
    );
  }

兼容性

要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。

请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：@react-native-oh-tpl/react-native-image-gallery Releases

属性

Prop Description Type Default Platform HarmonyOS Support
images Your array of images array Required all yes
initialPage Image displayed first number 0 all yes
imageComponent Custom function to render your images, 1st param is the image props, 2nd is its dimensions function <Image> component all yes
errorComponent Custom function to render the page of an image that couldn't be displayed function A <View> with a stylized error all yes
flatListProps Props to be passed to the underlying FlatList object {windowSize: 3} all yes
pageMargin Blank space to show between images number 0 all yes
onPageSelected Fired with the index of page that has been selected function all yes
onPageScrollStateChanged Called when page scrolling state has changed, see scroll state and events function all yes
onPageScroll Scroll event, see scroll state and events function all yes
scrollViewStyle Custom style for the FlatList component object {} all yes
onSingleTapConfirmed Fired after a single tap function all yes
onLongPress Fired after a long press function all yes

遗留问题

其他

开源协议

本项目基于 The ISC License (ISC) ，请自由地享受和参与开源。