Você está na página 1de 21

LABORATÓRIO DE PROGRAMAÇÃO PARA DISPOSITIVOS

MÓVEIS E SEM FIO

Professor: Dr. Woquiton Fernandes.


Alunos: Calebe Pereira, Erikles Ribeiro, Guilherme Ramos, Marcelo Henrique e Vanilson Lesa.

Google Maps API no


Android Studio

Produzido por: Calebe Pereira


1
SUMÁRIO

CRIAR PROJETO NO ANDROID STUDIO ...... 2


ATIVAR FIREBASE REALTIME ..................... 3
ATIVAR GOOGLE MAPS API ....................... 4
IMPLEMENTAR SERVIÇOS MAPS ............... 6
LAYOUTS DO APLICATIVO ......................... 7
CLASSES JAVA DO APLICATIVO ................ 12
EXECUTANDO O APLICATIVO .................. 20
CRIAR PROJETO NO 2

ANDROID STUDIO

Inicialmente, crie um novo projeto no Android Studio, comece com as configurações do


projeto de tela vazia (Empty Acticity), linguagem Java e level mínimo de API 19.
ATIVAR FIREBASE 3

REALTIME

Para ativar o Firebase Realtime,


no menu superior do Android
Studio, clique em Tools e no
menu drop-down clique em
Firebase.

O manual de ajuda para a conexão com Firebase será exibido na parte direita da
tela, clique em Realtime Database e depois em Save and retrive data.

Após isso siga as duas primeiras instruções para conectar ao Realtime Database.
ATIVAR GOOGLE 4

MAPS API

Para ativar a API do Google Maps, acesse:


https://console.developers.google.com/apis/

1. Entre com uma conta do Google.

2. Caso seja seu primeiro Projeto, cliquem em aceitar os termos e condições.

3. Se for o seu primeiro projeto, clique em Novo. Porém, se você já possuí projetos
no Google Developers, clique em Selecione um projeto e em Novo Projeto.

4. Nomeie o projeto e clique em Criar.

5. Após a criação do projeto clique em ATIVAR APIS E SERVIÇOS.

6. Procure e clique em Maps SDK for Android.

7. Clique em ATIVAR

8. Agora no menu drop-down principal, clique em APIs e Serviços e em Credenciais.


5

9. Clique em Criar credenciais e em Chave de API.

10. Copie a chave gerada e clique em Fechar.

11. No projeto do Android Studio, em app/res/values/strings.xml crie a seguinte


String:

<string name="api_key" translatable="true">


Chave copiada
</string>

Em “Chave copiada”, colar a chave que você copiou no passo anterior.

12. Por fim, dar permissões para a localização e ativar a API_KEY. Entre em
app/manifests/AndroidManifest.xml e adicione os seguintes comandos dentro
da tag manifest:

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />


<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

Dentro da tag application, na última linha, digite o código abaixo:

<meta-data
android:name="com.google.android.geo.API_KEY"
android:value="@string/api_key" />
IMPLEMENTAR 6

SERVIÇOS MAPS

13. No projeto Android Studio, clique com o botão direito no diretório app, após isso
clique em Open Module Settings.

14. Clique em Dependencies, na janela Declared Dependencies clique no botão +


para adicionar uma nova dependência, selecione Library Dependendy.

15. Procure por *play-services-map*, com os asteriscos, após isso selecione a


primeira opção ‘play-services-maps’ e a versão 17.0.0.

16. Clique em OK, depois em Apply, e novamente em OK.


LAYOUTS DO 7

APLICATIVO

1. No projeto Android Studio entre no diretório: app/res/drawable.

2. Clique com o botão direito do mouse em drawable, depois vá em new e


clique em Drawable resoucer File.

3. Nomeie o arquivo como buscar_button e clique em OK.

4. Digite o seguinte código no arquivo:


<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#3F51B5"/>

<!--corners allow us to make the rounded corners button-->


<corners android:radius="10dp" />

</shape>
</item>
</selector>

5. Clique com o botão direito do mouse em drawable, depois vá em new e


clique em Drawable resoucer File.

6. Nomeie o arquivo como buscar_button e clique em OK.

7. Digite o seguinte código no arquivo:


<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#FF4CAF50"/>

<!--corners allow us to make the rounded corners button-->


<corners android:radius="10dp" />

</shape>
</item>
</selector>

8. Clique com o botão direito do mouse em drawable, depois vá em new e


clique em Drawable resoucer File.

9. Nomeie o arquivo como deletar_button e clique em OK.


8

10. Digite o seguinte código no arquivo:


<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#E41919"/>

<!--corners allow us to make the rounded corners button-->


<corners android:radius="10dp" />

</shape>
</item>
</selector>

11. Clique com o botão direito do mouse em layout, depois vá em new e clique
em Layout resoucer File.

12. Nomeie o arquivo como activity_buscar e clique em OK.

13. Clique em Text e digite o seguinte código no arquivo:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".Buscar">

<EditText
android:id="@+id/buscarInputID"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff"
android:hint="Buscar"
android:inputType="textPersonName"
android:textSize="30sp" />

<ListView
android:id="@+id/listaID"
android:layout_width="match_parent"
android:layout_height="match_parent" />

</LinearLayout>
9

14. Clique com o botão direito do mouse em layout, depois vá em new e clique
em Layout resoucer File.

15. Nomeie o arquivo como activity_cadastrar e clique em OK.

16. Clique em Text e digite o seguinte código no arquivo:

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Cadastrar"
android:orientation="vertical">

<EditText
android:layout_width="match_parent"
android:id="@+id/nomeInputID"
android:layout_height="50dp"
android:textSize="30sp"
android:hint="Nome"
android:background="#FFFFFF"/>
<fragment
android:layout_width="match_parent"
android:id="@+id/mapInputID"
android:layout_height="450dp"
android:name="com.google.android.gms.maps.SupportMapFragment"/>
<Button
android:id="@+id/cadastrarID"
android:layout_width="100dp"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:layout_height="50dp"
android:text="Salvar"
android:textColor="#ffffff"
android:background="@drawable/salvar_button"/>

</LinearLayout>
10

17. Clique no activity_main contido na pasta layout Clique em Text e digite o


seguinte código no arquivo:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<ImageView
android:id="@+id/imageView"
android:layout_width="208dp"
android:layout_height="195dp"
android:layout_marginStart="101dp"
android:layout_marginTop="34dp"
android:layout_marginEnd="102dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/logo" />

<Button
android:id="@+id/salvarID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:background="@drawable/salvar_button"
android:text="salvar"
android:textColor="#ffffff"
app:layout_constraintEnd_toStartOf="@+id/buscarID"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/imageView" />

<Button
android:id="@+id/buscarID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:background="@drawable/buscar_button"
android:text="buscar"
android:textColor="#ffffff"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/salvarID"
app:layout_constraintTop_toBottomOf="@+id/imageView" />
18.
</androidx.constraintlayout.widget.ConstraintLayout>

19. Na parte esquerda da tela do projeto Android Studio, cliquem em Resource


Manager e mova a imagem logo.png para dentro da aba Drawable, e clique
em Import.
11

20. Volte para Project, novamente em app/res/layout, clique com o botão


direito do mouse em layout, depois vá em new e clique em Layout resoucer
File.

21. Nomeie o arquivo como activity_show e clique em OK.

22. Clique em Text e digite o seguinte código no arquivo:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
tools:context=".Show">

<fragment
android:layout_width="match_parent"
android:layout_height="500dp"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:id="@+id/mapShow"/>
<Button
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:textColor="#ffffff"
android:text="Deletar"
android:background="@drawable/buscar_button"
android:id="@+id/deletarID"/>

</LinearLayout>
CLASSES JAVA DO 12

APLICATIVO

1. No projeto do Android Studio, no diretório app/java/PackageDoSeuApp onde


PackageDoSeuApp é a Package definida na criação do projeto.

2. Clique em MainActivity e digite o seguinte código após os imports:


public class MainActivity extends AppCompatActivity {

Button salvar, buscar;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (ContextCompat.checkSelfPermission(this,
Manifest.permission.ACCESS_FINE_LOCATION)
!= PackageManager.PERMISSION_GRANTED) {
ActivityCompat.requestPermissions(this,
new String[]{Manifest.permission.ACCESS_FINE_LOCATION},
1);
if (ContextCompat.checkSelfPermission(this,
Manifest.permission.ACCESS_FINE_LOCATION)
!= PackageManager.PERMISSION_GRANTED) {
System.exit(0);
}
}
salvar = findViewById(R.id.salvarID);
buscar = findViewById(R.id.buscarID);
salvar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(MainActivity.this, Cadastrar.class));
}
});
buscar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(MainActivity.this, Buscar.class));
}
});
}
}

3. Pressione as teclas Alt + Enter até que a assistência do Android Studio realize
todas as importações necessárias no arquivo. Os erros ficaram apenas em
Cadastrar e Buscar, classes essas que ainda não foram criadas.

4. Clique na pasta com o nome da Package do seu projeto, clique com o botão
direito do mouse, em new e clique em Java Class.

5. Nomeie a classe java como o nome Pontos (primeira letra maiúscula) e clique em
OK.
13

6. Digite o seguinte código abaixo de package:

import androidx.annotation.NonNull;

public class Pontos {


private String id;
private Double latitude;
private Double longitude;
private String nome;

public Pontos(){

public String getId() {


return id;
}

public void setId(String id) {


this.id = id;
}

public Double getLatitude() {


return latitude;
}

public void setLatitude(Double latitude) {


this.latitude = latitude;
}

public Double getLongitude() {


return longitude;
}

public void setLongitude(Double longitude) {


this.longitude = longitude;
}

public String getNome() {


return nome;
}

public void setNome(String nome) {


this.nome = nome;
}

@NonNull
@Override
public String toString() {
return "Nome: " + this.nome + "\nCoordenadas: " + this.latitude + ":" +
this.longitude;
}
}
14

7. Clique na pasta com o nome da Package do seu projeto, clique novamente com o
botão direito do mouse, em new e clique em Java Class.

8. Nomeie a classe java como o nome Cadastrar (primeira letra maiúscula) e clique
em OK.

9. Digite o seguinte código abaixo de package:


public class Cadastrar extends FragmentActivity implements OnMapReadyCallback {

Pontos pontos = new Pontos();


EditText nome;
GoogleMap gMap;
Button salvar;
FirebaseDatabase database;
DatabaseReference reference;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cadastrar);
salvar = findViewById(R.id.cadastrarID);
nome = findViewById(R.id.nomeInputID);
database = FirebaseDatabase.getInstance();
reference = database.getReference();
SupportMapFragment supportMapFragment = (SupportMapFragment)
getSupportFragmentManager().findFragmentById(R.id.mapInputID);
supportMapFragment.getMapAsync(this);
}

@Override
public void onMapReady(GoogleMap googleMap) {
gMap = googleMap;
gMap.setOnMapClickListener(new GoogleMap.OnMapClickListener() {
@Override
public void onMapClick(LatLng latLng) {
pontos.setLatitude(latLng.latitude);
pontos.setLongitude(latLng.longitude);
MarkerOptions markerOptions = new MarkerOptions();
markerOptions.position(latLng);
markerOptions.title(latLng.latitude+ ":" +latLng.longitude);
gMap.clear();
gMap.animateCamera(CameraUpdateFactory.newLatLngZoom(latLng, 15));
gMap.addMarker(markerOptions);
gMap.setMyLocationEnabled(true);
gMap.setTrafficEnabled(true);
}
});
salvar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
pontos.setNome(nome.getText().toString());
if(!pontos.getNome().isEmpty()){
if(pontos.getLatitude() != null && pontos.getLongitude() !=
null){
Timestamp timestamp = new
15

Timestamp(System.currentTimeMillis());
String PontosId = new
SimpleDateFormat("yyyyMMddHHmmss").format(timestamp.getTime());
pontos.setId(PontosId);
reference.child("Pontos").child(PontosId).setValue(pontos);
startActivity(new Intent(Cadastrar.this,
MainActivity.class));
Toast.makeText(Cadastrar.this, "Cadastrado com sucesso!",
Toast.LENGTH_SHORT).show();
}else{
Toast.makeText(Cadastrar.this, "Insira a localização no
Mapa", Toast.LENGTH_LONG).show();
}
}else{
Toast.makeText(Cadastrar.this, "Insira o nome do Ponto a ser
salvo!", Toast.LENGTH_LONG).show();
}
}
});
}
}

10. Pressione as teclas Alt + Enter até que a assistência do Android Studio realize
todas as importações necessárias no arquivo. Mas dê uma atenção especial para a
importação de Timestamp, que deve ser Timestamp (java:sql) e também para
SimpleDateFormat que deve ser SimpleDateFormat (java.text), como
apresentado nas respectivas imagens abaixo:
16

11.Clique na pasta com o nome da Package do seu projeto, clique novamente com o
botão direito do mouse, em new e clique em Java Class.

12.Nomeie a classe java como o nome Buscar (primeira letra maiúscula) e clique em
OK.

13.Digite o seguinte código abaixo de package:


public class Buscar extends AppCompatActivity {

private EditText buscar;


private ListView lista;
private FirebaseDatabase database;
private DatabaseReference reference;
private List<Pontos> listaContato = new ArrayList<Pontos>();
private ArrayAdapter<Pontos> arrayContato;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_buscar);
database = FirebaseDatabase.getInstance();
reference = database.getReference();
buscar = (EditText) findViewById(R.id.buscarInputID);
lista = (ListView) findViewById(R.id.listaID);

eventoEdit();

private void eventoEdit() {


buscar.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1,
int i2) {

@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int
i2) {

@Override
public void afterTextChanged(Editable editable) {
String palavra = buscar.getText().toString();
buscarLocal(palavra);
}
});
}

private void buscarLocal(final String palavra) {


Query query;
17

if (palavra.equals("")){
query = reference.child("Pontos").orderByChild("nome");
}else{
query =
reference.child("Pontos").orderByChild("nome").startAt(palavra).endAt(palavra+"\uf8f
f");
}
listaContato.clear();

query.addValueEventListener(new ValueEventListener() {
@Override
public void onDataChange(@NonNull DataSnapshot dataSnapshot) {
for(DataSnapshot snapshot:dataSnapshot.getChildren() ){
Pontos pontos = snapshot.getValue(Pontos.class);
listaContato.add(pontos);
}
arrayContato = new ArrayAdapter<Pontos>(Buscar.this,
android.R.layout.simple_list_item_1, listaContato);
lista.setAdapter(arrayContato);
lista.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View view,
int i, long l) {
Pontos pontos = (Pontos) lista.getAdapter().getItem(i);
Bundle dados = new Bundle();
dados.putDouble("latitude", pontos.getLatitude());
dados.putDouble("longitude", pontos.getLongitude());
dados.putString("nome", pontos.getNome());
dados.putString("id", pontos.getId());
Intent intent = new Intent(Buscar.this, Show.class);
intent.putExtras(dados);
startActivity(intent);
}
});
}

@Override
public void onCancelled(@NonNull DatabaseError databaseError) {

}
});
}

@Override
protected void onResume() {
super.onResume();
buscarLocal("");
}
}

14. Pressione as teclas Alt + Enter até que a assistência do Android Studio realize
todas as importações necessárias no arquivo. Mas dê uma atenção especial para a
importação de Query, que deve ser Query (com.google.firebase.databse). O único
erro que persistirá será o da classe Show que ainda não foi criada.
18

15.Clique na pasta com o nome da Package do seu projeto, clique novamente com o
botão direito do mouse, em new e clique em Java Class.

16.Nomeie a classe java como o nome Show (primeira letra maiúscula) e clique em
OK.

17.Digite o seguinte código abaixo de package:

public class Show extends FragmentActivity implements OnMapReadyCallback {

GoogleMap gMap;
Pontos ponto = new Pontos();
Button deletar;
FirebaseDatabase database;
DatabaseReference reference;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show);
Intent intent = getIntent();
if(intent != null){
Bundle dados = intent.getExtras();
if(dados != null){
ponto.setLatitude(dados.getDouble("latitude"));
ponto.setLongitude(dados.getDouble("longitude"));
ponto.setNome(dados.getString("nome"));
ponto.setId(dados.getString("id"));
}
}
deletar = findViewById(R.id.deletarID);
database = FirebaseDatabase.getInstance();
reference = database.getReference();

deletar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
reference.child("Pontos").child(ponto.getId()).removeValue();
startActivity(new Intent(Show.this, MainActivity.class));
Toast.makeText(Show.this, "Excluído com Sucesso!",
Toast.LENGTH_SHORT).show();
}
});
SupportMapFragment supportMapFragment = (SupportMapFragment)
getSupportFragmentManager()
.findFragmentById(R.id.mapShow);
supportMapFragment.getMapAsync(this);
}

@Override
public void onMapReady(GoogleMap googleMap) {
gMap = googleMap;
LatLng latLng = new LatLng(ponto.getLatitude(), ponto.getLongitude());
gMap.addMarker(new MarkerOptions().position(latLng).title(ponto.getNome()));
19

gMap.moveCamera(CameraUpdateFactory.newLatLngZoom(latLng, 15));
gMap.setMyLocationEnabled(true);
gMap.setTrafficEnabled(true);
}
}

18. Pressione as teclas Alt + Enter até que a assistência do Android Studio realize
todas as importações necessárias no arquivo.

19. Em app/manifests/AndroidManifest.xml adicionar o seguinte código abaixo da


tag application.
<activity android:name=".Show"></activity>
<activity android:name=".Buscar"></activity>
<activity android:name=".Cadastrar"></activity>

20. Por fim, pode ser necessário definir as regras do Database Realtime como públicas
para escrita e leitura, para fazer isso acesse o Firebase console no navegador,
clique em Database, Criar Banco de Dados, Selecione Iniciar no modo de teste,
clique em próximo, depois em concluído. Na parte superior, em frente a Database
selecione Realtime Database, clique em regras, e altere as duas regras de false
para true e clique em Publicar.
EXECUTANDO O 20

APLICATIVO

1. Selecione o Emulador de sua preferência e clique em Run App.

2. Na tela inicial do aplicativo, clique em SALVAR (primeira imagem).


3. Na tela de salvar uma localização, clique no mapa, na localização desejada,
depois nomeie a localização e clique em SALVAR (segunda imagem).
4. Voltando a tela inicial, ao clicar em BUSCAR, é possível buscar e visualizar os
lugares salvos (terceira imagem).