Você está na página 1de 24

Integrando aplicaes Android

com o Facebook
clique para votar

Veja neste artigo como fazer a integrao da sua aplicao


Android com o Facebook.

20

Introduo

Com a febre das redes sociais, fica evidente que algumas aplicaes (as que
esto abertas ao pblico principalmente) necessitam de uma integrao com as
principais redes sociais do momento. Atualmente, quem est no auge o
Facebook, devido a isso, iremos fazer a integrao da nossa aplicao com essa
rede social.

Registrando a nossa aplicao

Primeiramente, para conseguir fazer a integrao de sua app com o Facebook,


preciso possuir uma conta na rede social. Tendo uma conta no Facebook, o
que preciso agora registrar nossa aplicao no mesmo. Para fazer isso,
teremos que acessar o Facebook Developer, pelo site
https://developers.facebook.com/apps. Faa o login com sua conta do Facebook
(o ideal ser uma conta que voc no utilize para uso pessoal e sim para
desenvolvimento de sistemas), e aps isso clique em Register as a Developer,
assim como mostra a figura 1.
Figura 1: Pgina inicial do Facebook Developers

Aps isso, ir aparecer uma tela como mostra a figura 2, marque a opo I
accept the Facebook Platform Policy and the Facebook Privacy Policy e em
seguida clique em Continuar.

Figura 2: Registrando a aplicao no Facebook

Agora digite o nmero do seu celular para que o Facebook possa enviar um sms
para que possamos continuar o processo de registro da aplicao, esse
procedimento usado como procedimento de segurana para o Facebook. Aps
digitar o nmero do telefone, clique em continuar, assim como mostra a figura
3.

Figura 3: Verificao de conta do Facebook

Aps isso, voc receber um sms com um cdigo para confirmao, digite-o e
clique em continuar. Agora voc ir colocar a linguagem na qual estar
desenvolvendo a aplicao, no nosso caso iremos marcar a opo Android,
assim como mostra a figura 4.
Figura4: Definio da linguagem de desenvolvimento da aplicao

Aps isso ir aparecer uma tela confirmando o procedimento, clique em Done


para continuar. Aps isso voc ser direcionado para a pgina principal, onde
aparecer opo Criar novo aplicativo, aps clicar nessa opo aparecer uma
tela como mostra a Figura 5.
Figura 5: Tela de registro da app

Preencha as informaes solicitadas de acordo com seu software e clique em


Continuar.

Agora teremos que preencher um campo chamado Key Hashes, nessa nova tela
que ir aparecer, esse campo justamente a assinatura do nosso projeto.
Teremos que gerar ele a partir do arquivo *.keystore, para isso teremos que
baixar o OpenSSL que serve para gerar essa assinatura. Adquirimos ele no site
http://code.google.com/p/openssl-for-windows/, aps baixar, descompacte o
zip na pasta C:. Feito isso, teremos que gerar o Key Hashes. Primeiramente ,
abra o prompt de comando e digite o comando abaixo para adicionar o diretrio
do OpenSSL no path.

Listagem 1: Adicionando o diretrio do OpenSSL ao path

set PATH=%PATH%;C:\openssl-0.9.8k_WIN32\bin

Para gerar a chave, digite esse comando:

Listagem 2:
Gerando a chave
keytool -exportcert -alias androiddebugkey -keystore
~/.android/debug.keystore | openssl sha1 -binary | openssl base64

Copie a hash que foi gerada, cole no campo Android Key Hash e conclua o
cadastro da aplicao no Facebook. As configuraes devero ficar parecidas
com as da figura 6.

Nota: Copie o AppID e o App Secret, pois iremos precisar deles na hora da
implementao do cdigo fonte, o app ID ser responsvel por identificar sua
aplicao.
Figura 6: Criando a referncia da app com a rede social Facebook

Download da API do Facebook para o Android

Aps registrar a nossa aplicao junto ao Facebook, iremos agora acessar a


pgina https://github.com/facebook/facebook-android-sdk/ e iremos fazer o
download da API, assim como mostra a figura 7.
Figura 7: Pgina de download da API do Facebook para o Android

Aps clicar em ZIP, ir aparecer uma pgina para realizar o download. Baixe
esse arquivo e salve no local que desejar dentro do seu computador, esse
projeto que foi baixado ser integrado ao que iremos desenvolver mais adiante.

Importando o projeto do facebook SDK

Iremos agora criar, no Eclipse, um novo projeto. Clique em File > New >
AndroidProject, o nome do projeto ser facebooksdk (coloque esse nome no
projeto) e selecione a opo Create project from existing source. Clique em
Browser e escolha o diretrio onde voc descompactou a API do facebook, que
foi baixada, escolha a pasta facebook dentro do projeto e clique em OK. Feito
isso clique em Finish.

Aps isso, teremos que importar a biblioteca android-support-v4.jar, ela est na


pasta libs do projeto do Facebook que foi baixado para seu computador. Para
importamos essa biblioteca, teremos que adicion-la ao Build Path. Para fazer
isso, basta clicar com o boto direito sobre o projeto e selecionar Build Path >
Configure Build Path. Na janela que for exibida, na aba Libraries, clique no
boto Add External JARs, v at o diretrio onde voc salvou o projeto do
Facebook (projeto que foi feito download). Dentro da pasta libs estar o arquivo
.jar, clique nele e em seguida em Abrir.

Nota: Se o projeto apresentar erros em relao a anotaes @Override, voc


pode remov-las.
Criando o nosso projeto

Para comearmos, teremos que criar um novo projeto no Eclipse. Clique em File
> New > AndroidProject e coloque o nome do projeto como quiser, neste
exemplo ir se chamar DevmediaFacebook. Aps termos criado o nosso projeto,
teremos que adicionar a referncia do projeto facebooksdk ao nosso projeto,
para isso, clique com o boto direito sobre o projeto e selecione Properties.

No lado esquerdo, selecione Android e na parte inferior adicione a referncia ao


projeto clicando em Add... e selecionando o facebooksdk, assim como mostra a
figura 8.

Figura 8: Adicionando referncia do projeto do facebooksdk ao nosso projeto

O projeto que iremos fazer bem simples, ele ir fazer login no Facebook ao
iniciar e teremos como funo atualizar nossos status com apenas texto e
tambm poderemos fazer uma postagem com texto e imagem.
Implementando o cdigo fonte da aplicao

Antes de continuarmos, teremos que declarar no AndroidManifest.xml a


permisso de internet, para isso basta deixar o XML igual o da listagem 3.

Listagem 3: XML responsvel por declarar permisso de acesso internet

Criando a tela do aplicativo

Iremos agora desenhar nossa tela principal, para isso teremos que abrir o
nosso main.xml e teremos que deix-lo como o da figura 9.
Figura 9: Tela inicial do aplicativo

Para fazer uma tela como essa, basta deixar o nosso main.xml como a listagem
4, esse XML o responsvel por deixar a tela inicial da nossa app igual ao da
figura 9.

Listagem 4: XML responsvel pela tela inicial da nossa app


Agora iremos iniciar a implementao do cdigo para enviar posts ao Facebook,
para isso teremos que utilizar o app ID, aquele cdigo foi gerado pela API do
Facebook para identificar sua aplicao, iremos utiliz-lo como mostra na
Listagem 5.

Listagem 5: Trecho de cdigo responsvel por identificar aplicao e


sincroniz-la com a app do Facebook

package devmedia.artigo.weslley;

import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.net.MalformedURLException;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.content.SharedPreferences;
import android.content.pm.ActivityInfo;
import android.database.Cursor;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.os.Bundle;
import android.provider.MediaStore;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

import com.facebook.android.AsyncFacebookRunner;
import com.facebook.android.AsyncFacebookRunner.RequestListener;
import com.facebook.android.DialogError;
import com.facebook.android.Facebook;
import com.facebook.android.Facebook.DialogListener;
import com.facebook.android.FacebookError;

public class DevmediaFacebookActivity extends Activity {

private static final String APP_ID = "AQUI IR O APP ID DE SUA


APLICAO";

private static final String ACCESS_EXPIRES = "access_expires";


private static final String ACCESS_TOKEN = "access_token";

private Facebook facebook;


private SharedPreferences prefs;

private Bitmap fotoTirada;


private ImageView imageView1;
private File caminhoFoto;

private Bitmap image;

String[] salvarimg = new String[0];

String corpo;

private int cont = 0;

Dentro do nosso mtodo onCreate(), iremos implementar justamente a


chamada da tela do login do Facebook, caso o usurio no esteja logado na
rede social, ele abrir a janela de login semelhante a da figura 10.
Ainda dentro do mtodo onCreate(), iremos implementar a orientao da tela,
que estar sempre travada como portrait (em retrato), e iremos chamar
nossa imageView, com a imagem padro da tela iniciar. Veja como ficaria na
listagem 6.

Figura 10: Imagem referente ao login do Facebook, tela j integrada ao app


que estamos desenvolvendo

Listagem 6: Cdigo responsvel por exibir tela de login do Facebook


public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
facebook = new Facebook(APP_ID);
prefs = getPreferences(MODE_PRIVATE);
// Carrega a accessToken pra saber se o usurio
// j se autenticou.
loadAccessToken();

// Caso no tenha se autenticado, abre o login


if (!facebook.isSessionValid()) {

// Chama a tela de login do facebook


facebook.authorize(this, new String[]
{ "publish_stream" },
new DialogListener() {
// Login com sucesso,
salva o accessToken
public void
onComplete(Bundle values) {

saveAccessToken();
}

// Os mtodos abaixo
devem ser
// implementados para
tratatmento dos
// fluxos width="640"
alternativos
public void
onFacebookError(FacebookError error) {
}

public void
onError(DialogError e) {
}

public void onCancel() {


}
});
this.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT)
;
}

imageView1 = (ImageView) findViewById(R.id.imageView1);


}

Aps isso, iremos apenas implementar os mtodos de buscar imagem na


galeria de imagens, identificar se ser enviado apenas post ou post e foto
juntos, e os demais mtodos de envio. No iremos estender tanto explicando
mtodo a mtodo, pois o cdigo est todo comentado e se auto explica
tranquilamente, os mtodos devem ficar da forma da listagem 7.

Listagem 5: Mtodos da aplicao

public void galleryButtonClick(View v) {


// apagaTemp();

Intent intent = new Intent(Intent.ACTION_GET_CONTENT);


intent.setType("image/*");
startActivityForResult(intent, 0);

cont++;
}

// Evento de clique do boto para atualizar o status


public void updateStatusClick(View v) {
EditText edt = (EditText) findViewById(R.id.editText1);

if ((edt.getText().toString().trim().equals(""))
|| (edt.getText().toString() == null)) {

Toast.makeText(this, "Ops!!!, Digite algo para


seus amigos...",
Toast.LENGTH_LONG).show();

} else if ((edt.getText().toString().trim().equals(""))
|| (edt.getText().toString() == null) ||
cont > 0) {

corpo = edt.getText().toString();
sendPhoto(edt.getText().toString());

} else if (cont == 0) {

corpo = edt.getText().toString();

updateStatus(edt.getText().toString());

edt.setText("Aguarde enquando publicamos o seu post,


isso pode demorar um pouco...");
edt.setEnabled(false);

private RequestListener requestListener = new RequestListener()


{
public void
onMalformedURLException(MalformedURLException e,
Object state) {
showToast("URL mal formada");
}

public void onIOException(IOException e, Object state)


{
showToast("Problema de comunicao");
}

public void
onFileNotFoundException(FileNotFoundException e,
Object state) {
showToast("Recurso no existe");
}

public void onFacebookError(FacebookError e, Object


state) {
showToast("Erro no Facebook: " +
e.getLocalizedMessage());
}

public void onComplete(String response, Object state) {


showToast("Publicao realizada com sucesso");

}
};

// Mtodo que efetivamente atualiza o status


private void updateStatus(String status) {
AsyncFacebookRunner runner = new
AsyncFacebookRunner(facebook);

Bundle params = new Bundle();


params.putString("message", status);
runner.request("me/feed", params, "POST",
requestListener, null);
}

// Mtodo que efetivamente atualiza o status com imagem


private void sendPhoto(String status) {
AsyncFacebookRunner runner = new
AsyncFacebookRunner(facebook);

ByteArrayOutputStream baos = new


ByteArrayOutputStream();

image.compress(Bitmap.CompressFormat.PNG, 100, baos);

byte[] bytes = baos.toByteArray();

Bundle params = new Bundle();


params.putByteArray("picture", bytes);
params.putString("message", status);

runner.request("me/photos", params, "POST",


requestListener, null);
}

private void showToast(final String s) {


final Context ctx = DevmediaFacebookActivity.this;
runOnUiThread(new Runnable() {
public void run() {
Toast.makeText(ctx, s,
Toast.LENGTH_SHORT).show();
}
});
}

private void saveAccessToken() {


SharedPreferences.Editor editor = prefs.edit();
editor.putString(ACCESS_TOKEN,
facebook.getAccessToken());
editor.putLong(ACCESS_EXPIRES,
facebook.getAccessExpires());
editor.commit();
}

private void loadAccessToken() {


String access_token = prefs.getString(ACCESS_TOKEN,
null);
long expires = prefs.getLong(ACCESS_EXPIRES, 0);
if (access_token != null) {
facebook.setAccessToken(access_token);
}
if (expires != 0) {
facebook.setAccessExpires(expires);
}
}

public void onActivityResult(int requestCode, int resultCode,


Intent data) {
super.onActivityResult(requestCode, resultCode, data);

if (cont == 0) {
// A API do Facebook exige essa chamada para
// concluir o processo de login.
facebook.authorizeCallback(requestCode,
resultCode, data);
} else {

if (resultCode == RESULT_OK) {
switch (requestCode) {
case 0:

Uri selectedImage =
data.getData();
String[] filePathColumn =
{ MediaStore.Images.Media.DATA };
Cursor cursor =
getContentResolver().query(selectedImage,
filePathColumn,
null, null, null);
cursor.moveToFirst();

int columnIndex =
cursor.getColumnIndex(filePathColumn[0]);
String filePath =
cursor.getString(columnIndex); // file

// path

// of

// selected

// image
cursor.close();

Bitmap yourSelectedImage =
BitmapFactory
.decodeFile(fileP
ath);

imageView1.setImageBitmap(yourSelectedImage);

image = yourSelectedImage;

break;

case 1:
fotoTirada =
BitmapFactory.decodeFile(caminhoFoto
.getAbsolutePath(
));

imageView1.setImageBitmap(fotoTirada);
break;
}
}
}
}

Realizando os testes

Aps termos implementado todas essas funcionalidades, chegou enfim a grande


hora de testar.

Aps termos realizado o login no Facebook, como mostrou a figura 10, iremos
nos deparar com a tela que ir instalar o servio do Facebook no nosso
aparelho e de fato sincronizar nossa app com a API deles (Facebook). Aps
essa tela ser exibida, escolha a opo Install, assim como mostra a figura 11.

Figura 11: Tela de instalao da API do Facebook


Aps instalarmos o servio da API do Facebook, temos que permitir que o
mesmo escreva no nosso perfil atravs de um app de terceiros, como o caso
da gente. Para isso, escolha a opo Allow All, assim como mostra a figura 12.

Figura 12: Permisso para escrever posts atravs de app

Agora iremos publicar apenas um post, para isso iremos digitar Ola Facebook
e escolheremos a opo Postar, como mostra na figura 13.
Figura 13: Postando no Facebook sem imagem

Veja a imagem do post na figura 14.

Figura 14: Imagem postada via aplicao

Para postarmos um post com imagem simples, basta digitar uma mensagem,
clicar em Buscar imagem, escolher a imagem e clicar em Postar, assim como
mostra a figura 15.
Figura 15: Postar imagem com mensagem no Facebook

Veja a imagem do post na figura 16.

Figura 16: Postagem com foto via aplicao


Concluso

Bom, pessoal, trabalhar com API de terceiros nem sempre fcil, mas vale a
pena tentar implementar esse exemplo de publicao na rede social Facebook.

Com isso finalizamos mais um artigo, muito obrigado pela ateno de todos.

Dvidas/Sugestes comentem...

Um forte abrao e at breve.

Referncias

ohttp://nglauber.blogspot.com.br/2012/05/facebook-api-no-
android.html

ohttps://developers.facebook.com/apps

ohttp://itweb.com.br/blogs/criando-um-aplicativo-android-com-
compartilhamento-via-facebook/

ohttps://github.com/facebook/facebook-android-sdk/

Leia mais em: Integrando aplicaes Android com o Facebook http://www.devmedia.com.br/integrando-


aplicacoes-android-com-o-facebook/27567#ixzz2Og1YpLYW