将rn集成到android中,rn图片去向

将rn集成到android中,rn中图片的去向

目录结构:

dir

index.android.js

import React, {
    Component,
} from 'react';

import {
     AppRegistry,
     Image,
     Text,
     View,
 } from 'react-native';



class DemoProject extends Component
 {
     constructor(props) {
         super(props);
     }


     render() {

         return (
            <View>  

                <Image source={require('./imgs/b.jpg')} />

            </View>
         );
     }


 };


 AppRegistry.registerComponent('rnImage', () => DemoProject);

MainActivity.java

public class MainActivity extends ReactActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "rnImage";
    }
}

MainApplication.java

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

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

    @Override
    protected String getJSMainModuleName() {
      return "index.android";
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
     SoLoader.init(this, /* native exopackage */ false);
  }
}

使用react-native bundle
–dev false
–platform android
–entry-file index.android.js
–bundle-output android/app/src/main/assets/index.android.bundle
–assets-dest android/app/src/main/res
命令生成bundle文件。

bundle中对应的加载图片资源代码:

__d(function(e,s,t,a){t.exports=s(138).registerAsset({__packager_asset:!0,httpServerLocation:"/assets/imgs",width:63,height:47,scales:[1],hash:"141f9e2d461215a96c4808a8ef76a272",name:"b",type:"jpg"})},295);

可以看到,图片资源指向了imgs目录,即b.jpg。

除了生成的bundle文件,还可以看到在res下生成了对应的图片资源。

img

rn将使用的图片资源copy到android工程中了一份。命名格式:目录_完整图片名。
这样生成了离线图片资源。

©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页