react-native-fast-image Android端配置

今天在项目里使用了react-native-fast-image,现在记录一下过程

如果是原生和RN混合开发,首先执行以下代码:

yarn add react-native-fast-image

然后在Android添加依赖:

  • 1.在android/settings.gradle里增加代码:
include ':react-native-fast-image'
project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
  • 2.在android/app/build.gradle里增加代码:
dependencies {
   ...
   implementation project(':react-native-fast-image')
   ...
}
 
  • 3.在android/app/src/main/java/…/MainApplication.java里增加代码
package com.myapp;

  import com.dylanvann.fastimage.FastImageViewPackage;

    @Override
    protected List getPackages() {
        return Arrays.asList(
            new MainReactPackage()
            new FastImageViewPackage()
        );
    }

}

完整代码:

import React,{ PureComponent } from 'react';
import { View, StyleSheet, ScrollView } from 'react-native';
import FastImage from 'react-native-fast-image';

export default class Demo extends PureComponent {

  render() {
    return (
      
        
        	
        
      
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    height: '100%',
  },
  ImageView: {
    flex: 1,
    backgroundColor: ct.colorBgWhite,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-around',
    flexWrap: 'wrap',
    padding: 10,
    marginTop: 10,
  },
  ImageItem: {
    height: 70,
    width: 70,
    margin: 5,
  },
});

你可能感兴趣的:(react-native-fast-image Android端配置)