Enable react native android to load downloaded images - react-native

Question

I have a legacy Android java application into which I am integrating react native. Per Facebook's instructions, I have a generic Activity into which I have added the following code:
mReactRootView = new ReactRootView(this);
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(new MainReactPackage())
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
mReactRootView.startReactApplication(mReactInstanceManager, "HelloWorld", null);
setContentView(mReactRootView);
However, in my case, I have downloaded my react native bundle and placed it in my Android device's cache, so I have amended that example by adding the following call:
.setJSBundleFile(mReactNativeLocalFile.getAbsolutePath())
This has enabled me to load my downloaded bundle successfully, however none of the images load. Thus, components that load images like:
<Image source={require('./img/background.jpg')} style={styles.backgroundImage} />
Do not render an actual image.
I have confirmed that all images were successfully extracted and placed in a folder named assets adjacent to my bundle. Thus, my folder structure looks like:
com.myapp/cache/templates/MyApp/
index.android.bundle
assets/
img/
background.jpg
Thus, can anyone tell me if it is possible for a react native template bundle that has been downloaded locally to the android file system to refer to images that have also been downloaded locally to the android file system?

Answer 1

Based on this change, the correct answer is a folder structure on your local disk that looks like this:
com.myapp/cache/templates/MyApp/
index.android.bundle
drawable-mdpi/
img_background.jpg