Share
Bienvenue dans la partie 1 de 2 de la série de didacticiels sur l'utilisation de l'API Facebook Graph et du SDK Corona pour créer des applications sociales natives pour les appareils mobiles. L'API Facebook possède de nombreuses fonctionnalités et peut être utilisée pour créer de puissantes applications sociales. Pour commencer, la fonction la plus fondamentale et la plus fondamentale de l'API Facebook consiste à permettre à un utilisateur de s'authentifier auprès d'une application à l'aide de ses informations d'identification Facebook. Cela nécessite un processus en deux étapes dans lequel un utilisateur non seulement se connecte à une application avec son nom d'utilisateur et son mot de passe Facebook, mais approuve également un ensemble d'activités autorisées qu'une application peut exécuter avec ses données sociales..
Par exemple, une application peut uniquement être autorisée à accéder à son nom et à sa photo de profil, mais le reste de leurs données personnelles restera confidentiel. Autre exemple, une application peut être autorisée à poster sur les murs de ses amis. La portée de cette fonctionnalité de l'API dépend vraiment du type d'application en cours de construction pour interagir avec Facebook..
Dans notre application, nous allons commencer par permettre à l'utilisateur de s'authentifier avec ses informations d'identification Facebook pour obtenir un jeton d'accès que nous pourrons utiliser pendant la durée de notre session. La session dans ce cas est définie comme une utilisation unique de l'application. Pour démarrer ce processus, nous devons enregistrer une application avec Facebook afin d'obtenir une clé API..
Si vous n'avez pas encore rejoint le programme d'application pour développeurs Facebook, vous devriez le faire maintenant..
Une fois que vous avez installé l'application sur votre compte, vous devez cliquer sur le bouton "Configurer une nouvelle application" dans le coin supérieur droit..
Chaque application de Facebook a besoin d'un nom unique, alors pensez à quelque chose de spécifique à votre projet..
Facebook peut vous demander de remplir un formulaire CAPTCHA à l'étape suivante. Si oui, complétez-le simplement pour continuer.
Une fois l'application créée, vous verrez une liste d'onglets sur le côté gauche de l'écran contenant différents paramètres d'application. Cliquez sur "Mobile et appareils"
Sur cet écran, notez votre "ID d’application" qui est un numéro long que nous utiliserons plus tard. Assurez-vous également de cliquer sur le bouton radio Application native, puis sur "Enregistrer les modifications" ci-dessous..
Maintenant que nous avons configuré notre application Facebook, commençons par configurer notre application Corona. Comme éléments de départ de base, nous allons créer 2 fichiers appelés build.settings et config.lua. Ceux-ci contiennent des données de configuration de base qui informent le compilateur de l'orientation d'affichage de notre application. Ils sont comme suit:
build.settings:
settings = orientation = default = "portrait",, iphone = plist = UIPrerenderedIcon = true,,
config.lua
application = contenu = largeur = 320, hauteur = 480, échelle = "boîte aux lettres",,
Nous allons ensuite commencer à coder notre application dans le fichier main.lua du projet. Le code à partir d'ici dans sera placé dans main.lua.
Accentsconagua
ui = require ("ui") local facebook = require "facebook [/ lua] Commencez par inclure les bibliothèques principales. La bibliothèque UI est une bibliothèque utile développée par un utilisateur Corona qui peut être téléchargée à partir de la page Code Exchange de Ansca Mobile. J'ai inclus dans le code source dans le fichier ui.lua. Cette bibliothèque nous aidera à créer proprement des boutons et d’autres éléments simples de l’interface utilisateur. Nous allons évidemment inclure cela ici aussi. [Code source code = "lua] appId local =" ID APPLICATION ICI " Nous allons ensuite créer une variable appelée appId et y stocker le "ID d'application" obtenu lors de la création de notre application Facebook. Même s'il s'agit d'un grand entier, nous le stockons ici sous forme de chaîne.
Notre prochaine étape consistera à créer un joli bouton sur lequel l'utilisateur pourra cliquer pour se connecter à notre application avec ses informations d'identification Facebook:
local myButton = ui.newButton defaultSrc = "fb.png", defaultX = "300", defaultY = "50", onEvent = onClick, id = "myButton" myButton.x = display.contentWidth / 2 myButton.y = display.contentHeight / 2
La création de boutons avec la bibliothèque d'interface utilisateur est très facile. Dans l'appel ci-dessus, vous remarquerez que nous passons 5 choses à la méthode newButton de la bibliothèque d'interface utilisateur:
Après cela, nous placerons simplement le bouton en définissant les propriétés x et y de notre objet myButton. Vous remarquerez que nous utilisons l'objet "display" spécifique à Corona pour obtenir le contenuWidth et le contentHeight de l'écran. Puisque le point de référence par défaut pour les objets dans Corona est le centre, en plaçant ce bouton à la moitié de la largeur et de la hauteur de l’écran, il apparaîtra tout droit dans le point mort..
Pour les besoins de ce didacticiel, il est logique de définir le bouton avant les actions. Cependant, dans la vie réelle, nous devons définir nos fonctions au-dessus du code de création du bouton afin que le compilateur en ait connaissance lorsqu’il interprète le code de manière procédurale. Notre première fonction sera de définir notre action de clic sur le bouton appelée "onClick".
fonction locale onClick (event) if (event.phase == "release"), puis facebook.login (appId, écouteur) end end
Dans cette fonction simple, nous appelons la bibliothèque Facebook dont nous avions besoin ci-dessus et nous passons 2 choses à la méthode de connexion. Le premier est l'identifiant d'application Facebook que nous avons obtenu de Facebook.com lorsque nous avons créé l'application, et le second est une fonction qui sera déclenchée lors de tout événement de rappel de l'API Facebook. Nous vérifions également que la phase d’événement est validée pour éviter tout double-clic accidentel sur le bouton..
Cette méthode d'écoute peut être déclenchée plusieurs fois. Nous devrons donc détecter non seulement le "type" d'événement, mais aussi sa "phase". Lorsque la méthode de connexion Facebook est appelée, la bibliothèque se connecte à Facebook et affiche une vue Web conviviale pour les écrans de connexion et d'authentification Facebook, comme indiqué ci-dessous:
Une fois qu'un utilisateur a terminé le processus de connexion, l'API Facebook commence à rappeler des fonctions de notre fonction d'écoute. Voici notre fonction d'écoute, telle qu'elle est la première partie de ce tutoriel:
fonction écouteur (événement) if ("session" == event.type) puis if ("login" == event.phase) puis facebook.request ("moi") et fin elseif ("request" == event.type) puis réponse locale = event.response print end (response) Comme vous pouvez le constater, lorsque nous recevons notre premier rappel de l'API Facebook, nous recherchons un type d'événement de "session". Cela signifie que l'utilisateur a terminé une action de session. Pour s'assurer qu'il / elle se connecte (et non un autre type d'action de session), nous vérifions que la phase est de type "login". Si ces contrôles aboutissent, nous allons maintenant instancier une "demande" distincte à l'API Graph Facebook pour un objet de données. Dans ce cas, nous allons demander l'objet "me" qui est un raccourci pour l'utilisateur actuellement connecté. Voir ci-dessous:
? facebook.request ("moi")? Cet événement se déclenchera et notre même auditeur sera rappelé à la fin de l'événement. Cette fois, nous rechercherons un type d’événement "demande" et gérerons l’objet "réponse" qui nous est renvoyé en tant que JSON. L'impression de cet objet produira quelque chose comme ceci (tiré de l'exemple d'API FB):
"id": "220439", "name": "Bret Taylor", "prénom_nom": "Bret", "dernier_name": "Taylor", "link": "http://www.facebook.com/btaylor "," nom d'utilisateur ":" btaylor "," genre ":" homme "," locale ":" en_US "
Maintenant, l’API de Facebook est très puissante et peut faire des tas de choses intéressantes. Dans la deuxième partie de notre didacticiel, nous allons ajouter une fonctionnalité permettant de demander des données à des amis et d'afficher certaines de leurs images de profil sous forme de collage. Jusque-là, je vous encourage à lire toutes les possibilités de l'API Graph de Facebook: FB Graph Documentation.
