Search code examples
androidreact-nativereact-native-fbsdk

Disable Loading Spinner on Android Using React Native FBSDK

I am using the React Native FBSDK to handle Facebook authentication within my React Native application. I would like to use my own loading spinner, however LoginManager.logInWithReadPermissions() seems to include a loading spinner already. Is there any way in which I can disable this?

Related questions seem to involve setting android:theme="@android:style/Theme.NoDisplay" on activity tags in the AndroidManifest. The React Native FBSDK got me to include:

<meta-data android:name="com.facebook.sdk.ApplicationId" android:value="@string/facebook_app_id" />

inside the AndroidManifest. I don't believe it would make sense to attach an android:theme attribute to this tag (I have tried this irrespectively, and did not reach the desired outcome).

I have tried adding the following activity tag:

<activity android:name="com.facebook.FacebookAcitivity" android:theme="@android:style/Theme.NoDisplay" tools:replace="android:theme" />

to my Android Manifest, in addition to adding the following attribute:

xmlns:tools="http://schemas.android.com/tools"

to my manifest tag. This results in the application crashing instantaneously, upon clicking the button which invokes LoginManager.logInWithReadPermissions().

When I run adb logcat, the following error message is present in the stacktrace:

AndroidRuntime: java.lang.IllegalStateException: Activity {com.<my-company-name>.<my-project-name>/com.facebook.FacebookActivity} did not call finish() prior to onResume() completing

Changing the value which I pass into android:theme to @android:style/Theme.Translucent.NoTitleBar prevents my application from crashing. It also changes the styling of the loading icon, but does not hide it.

Solution

  • This question evolved to the point that this answer became applicable.

    That is, to disable Facebook's loading spinner when using react-native-fbsdk:

    • Add xmlns:tools="http://schemas.android.com/tools" to the manifest tag in AndroidManifest.
    • Add <activity android:name="com.facebook.FacebookAcitivity" android:theme="@style/FullyTranslucent" tools:replace="android:theme" /> to the application node.
    • Add the styles specified in the aforementioned answer to /android/app/src/main/res/values/styles.xml.