Appcelerator/Titanium : createLoginButton fires error on android platform

Question

i'm adding the Facebook module to my app in order to use the login Facebook button using appcelerator/titanium and alloy framework.

here is my code:

var fb = require('facebook'); 
fb.addEventListener('login',function(e){
  if(e.success){
        alert("connected");
  }else{
        alert("failure"); 
  }
});
fb.addEventListener('logout',function(e){
    if(e.success) {
      alert("successfully logged out"); 
    }else{
      alert("failure"); 
    }
});
var mybtn = fb.createLoginButton({
  'top':'160',
  'height':'35',
  'width':'80%'
}); 
$.login_form.add(mybtn);

It seems that this part of this code causes the problem:

var mybtn = fb.createLoginButton({
  'top':'160',
  'height':'35',
  'width':'80%'
}); 
$.login_form.add(mybtn);

The error is the following :

exception on thread: main msg:java.lang.RuntimeException: Unable to start activity ComponentInfo{com.copark.mobile/org.appcelerator.titanium.TiActivity}: Unexpected CallbackManager, please use the provided Factory.; Titanium 5.5.1,2016/09/27 05:39,b18727f

I don't really understand that error, and neither how to fix it. If anyone of you has the answer... :)

Thanks in advance,

Quentin

Answer 1

Add this code after require:

fb.initialize();
if(Ti.Platform.name == 'android'){
    $.login_form.fbProxy = fb.createActivityWorker({lifecycleContainer: $.login_form});
}

On the android platform, in tiapp.xml or AndroidManifest.xml you must declare the following inside the node

<activity android:name="com.facebook.FacebookActivity" android:theme="@android:style/Theme.Translucent.NoTitleBar" android:label="YourAppName" android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation" />

You must also reference the string containing your Facebook app ID, inside the node as well:

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

The app id goes into the the file /platform/android/res/values/strings.xml (or your custom theme), where you should define

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <!-- ... -->
        <string name="app_id">1234567890123456</string>
        <!-- ... -->
    </resources>
</xml>

where the number is of course the app ID. The app ID is not set programmatically.