JSPM

react-native-uking-fast-image

0.0.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 5
  • Score
    100M100P100Q35557F
  • License MIT

Native QRCode and barcode and QRScanner component for React Native SDK

Package Exports

  • react-native-uking-fast-image

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-uking-fast-image) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-uking-fast-image

npm package npm download

##Introduction

原生图片加载组件,,集成到 iOS 和 Android 。

原生图片加载组件是基于

SDWebImage(IOS) GIT: https://github.com/rs/SDWebImage.git

Glide(android) GIT: https://github.com/bumptech/glide.git

##注:

如果有不对的地方请提交到issues以便解决。

##Installation

###npm or yarn

npm install react-native-uking-fast-image or yarn add react-native-uking-fast-image

##FastImage

image

###IOS:

在你的项目ios目录下面新建一个Profile文件:

    platform :ios, '8.0'
    target '你的项目名称' do
        pod 'yoga', path: '../node_modules/react-native/ReactCommon/yoga/'    
        pod 'React', :path => '../node_modules/react-native', :subspecs => [
            'Core',
            'DevSupport'
        ]
        pod 'RCTFastImageView', path: '../node_modules/react-native-uking-fast-image/ios/'
    end

然后在ios目录下 执行 pod install 然后把ios/Pods录下 Pods.xcodeproj添加到 Libraries下

  1. 如果是 iOS 中请求图片为http请求,请在Info.plist中添加http请求权限:

Android

make the following additions to the given files manually:

android/settings.gradle

include ':react-native-uking-fast-image'
project(':react-native-uking-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-uking-fast-image/android')

android/app/build.gradle

dependencies {
    ...
    compile project(':react-native-uking-fast-image')
}

MainApplication.java

On top, where imports are:

import net.muding.uking.rctfastimageview.RCTFastImageViewPackage;

Add the RCTFastImageViewPackage class to your list of exported packages.

@Override
protected List<ReactPackage> getPackages() {
    return Arrays.asList(
            new MainReactPackage(),
            new RCTFastImageViewPackage()
    );
}

##Usage

import FastImage from 'react-native-uking-fast-image';

<FastImage 
    src="url" 
    placeholder="占位图片" //占位图片 ios请添加占位图片到项目的资源管理里面,android请添加到你项目的drawable里,占位图片名称最好统一
    resizeMode="填充方式"
/>