React Native の Android 版ですべての画像が表示されない問題
画像をいっぱい表示するような(つまりごく一般的な)画面で、一部の画像しか表示されない問題が発生していました。
こんな感じにランダムに歯抜けになっちゃいます。歯抜けの仕方はリロードするたびに変わります。とってもストレスです。
環境
React Nativeのバージョン: 0.63.4 端末のAndroidバージョン: 12
解決
GitHub のこのスレッドに答えがありました。
[Android] not all images are shown · Issue #13600 · facebook/react-native
AndroidManifest.xml
の <application>
の属性に android:largeHeap="true"
を1行追加するだけで改善しました。
$ vi android/app/src/main/AndroidManifest.xml <manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" package="com.xx"> <uses-permission android:name="android.permission.INTERNET" /> <!-- (中略) --> <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher" android:largeHeap="true" <-追加 android:allowBackup="false" android:theme="@style/AppTheme" tools:replace="android:allowBackup"> <!-- (中略) --> </application> </manifest>
android:largeHeap="true"
は文字通り、ヒープ領域(メモリ領域)を大きめに取る設定のようです。(参考: <application> | Android デベロッパー | Android Developers)
これだけでストレスなく画像が表示されるようになりました!
こころなしかアプリのパフォーマンスも改善したような?
やったね。