Treinamento Android

Treinamento utilizado no evento WoMakers Code com intuito de apresentar o desenvolvimento Android para pessoas que possam ter ou não contato prévio com programação.
O objetivo deste treinamento é começar com uma tela simples e chegar até trazer dados de uma API e setar estes dados na tela.
Qualquer dúvida pode me encontrar nas redes sociais:
@_paulacr (Twitter)
paula.mecatronica@gmail.com
paula.rosa@arctouch.com

Transcript

1. Treinamento Android Básico Paula Rosa @_paularc (Twitter) paula.mecatronica@gmail.com paula.rosa@arctouch.com
2. TREINAMENTO ANDROID ANDROID STUDIO
3. X TREINAMENTO ANDROID | ANDROID STUDIO • 1 - árvore de arquivos • 2 - arquivo aberto • 3 - Ferramentas de build • 4 - Toolbar de Log/ debug/terminal 4 1 2 3
4. X TREINAMENTO ANDROID | ANDROID STUDIO 4 3 2 1 • 1 - Manifest Files - onde colocamos especificações de cada tela (como tema, nome do app, permissões, etc) • 2 - Arquivos Java/Kotlin (Parte lógica da aplicação) • 3 - Res (ou resources) é a parte visual da aplicação, onde estão arquivos de layout, estilos, textos, etc. • 4 - Arquivos do Gradle (Gerenciador de dependências do projeto)
5. X TREINAMENTO ANDROID | ANDROID STUDIO
6. X TREINAMENTO ANDROID | 1ª ENTREGA: CRIE UM PROJETO • Criar um novo projeto • Criar um emulador • Rodar o projeto com um texto simples “Hello word"
7. TREINAMENTO ANDROID LAYOUTS
8. X TREINAMENTO ANDROID | LAYOUTS • Representam a parte visual de uma aplicação Android. • Existem vários tipos de layouts, e cada um tem um propósito • Acontece também de combinarmos tipos de layouts (quando necessário)
9. X TREINAMENTO ANDROID | LAYOUTS: CONSTRAINT LAYOUT <?xml version="1.0" encoding="utf-8"?> <android.support.constraint.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"> <ImageView android:id="@+id/splashImagem" android:layout_width="200dp" android:layout_height="200dp" app:layout_constraintBottom_toTopOf="@+id/botaoIrParaHome" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.296" app:srcCompat="@drawable/gihub" /> <Button android:id="@+id/botaoIrParaHome" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Ir para Home" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </android.support.constraint.ConstraintLayout>
10. X TREINAMENTO ANDROID | LAYOUTS: RELATIVE LAYOUT <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/ic_launcher" android:layout_above="@id/button" android:layout_centerInParent="true"/> <Button android:id="@+id/button" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="button name" android:layout_alignParentBottom="true"/> </RelativeLayout>
11. X TREINAMENTO ANDROID | LAYOUTS: LINEAR LAYOUT <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/ic_launcher"/> <Button android:id="@+id/button" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="button name" android:layout_weight="1"/> </LinearLayout>
12. X TREINAMENTO ANDROID | LAYOUTS: FRAME LAYOUT <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/ic_launcher" android:scaleType="centerCrop"/> <ImageView android:layout_width="150dp" android:layout_height="150dp" android:src="@drawable/gihub" android:layout_gravity="center" /> </FrameLayout>
13. X TREINAMENTO ANDROID | LAYOUTS • Os layouts são arquivos com extensão .xml que possuem atributos, e assim o Android é capaz de entender como montar certo layout. • Existe sempre um layout pai (root) • ViewGroups são containers de views (permitem que nós adicionemos views dentro deles) • As views também podem existir sem um ViewGroup (aí seu pai passa a ser o root do layout)
14. X TREINAMENTO ANDROID | LAYOUTS <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginEnd="8dp" android:layout_marginStart="20dp" android:layout_marginTop="32dp" android:text="Hello World!" android:textSize="30sp" android:textColor="@android:color/darker_gray" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHorizontal_bias="0.0" app:layout_constraintStart_toEndOf="@+id/imageView" app:layout_constraintTop_toTopOf="parent" /> Wrap Content Match Parent Texto Texto Medidas exatas • Dimensões: dp • Textos: sp { Relações de layout { Atributos de View
15. X TREINAMENTO ANDROID | LAYOUTS { Filhos da ViewGroup { Atributos de ViewGroup <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical"> <ImageView /> <TextView /> </LinearLayout> • ScrollView • LinearLayout • RelativeLayout • ConstraintLayout • Recyclerview (listas) • CardView • ViewPager Exemplos de ViewGroups
16. X TREINAMENTO ANDROID | 2ª ENTREGA: CRIE UM LAYOUT • Criar um layout • Colocar todos atributos necessários • Rodar o aplicativo com o layout
17. X <?xml version="1.0" encoding="utf-8"?> <android.support.constraint.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"> <ImageView android:id="@+id/splashImagem" android:layout_width="match_parent" android:layout_height="0dp" android:scaleType="centerCrop" app:layout_constraintBottom_toTopOf="@+id/botaoIrParaHome" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHorizontal_bias="0.0" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:srcCompat=“@drawable/github" android:contentDescription=“@string/imagem_tela_inicial” /> <Button android:id="@+id/botaoIrParaHome" android:layout_width="match_parent" android:layout_height="0dp" android:text="Ir para Home" android:textSize="18sp" android:textAllCaps="false" android:background="@color/cor_botao" android:textColor="@color/branca" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </android.support.constraint.ConstraintLayout>
18. TREINAMENTO ANDROID ACTIVITY
19. X TREINAMENTO ANDROID | ACTIVITY • É a parte lógica da nossa tela (atividade) • Colocamos informações como o layout que será utilizado • Também podemos adicionar métodos para tratar os eventos gerados pelas views (como por exemplo click, long click, foco, etc)
20. X TREINAMENTO ANDROID | ACTIVITY • A herança é necessária para que possamos utilizar as funcionalidades do framework • O termo “compat" é utilizado no Android para indicar que o componente utilizado permite compatibilidade com versões anteriores do Android class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) //Layout que nossa activity irá "inflar" setContentView(R.layout.activity_main) } } Nome da Classe Herança Método
21. X TREINAMENTO ANDROID | CICLO DE VIDA • A activity possui um ciclo de vida específico. O Android controla o ciclo de vida • A activity pode entrar num estado de espera ao receber uma ligação telefônica por exemplo • As vezes será preciso sobrescrever alguns métodos do ciclo de vida, para a aplicação funcionar como o esperado
22. X
23. TREINAMENTO ANDROID INTENTS
24. X TREINAMENTO ANDROID | INTENTS • As intents são intenções, que podem trazer ou não dados (metadados) • O Android possui um sistema de mensagem envio/ receptor para executar certas tarefas • As intents são escutadas pelo sistema operacional ou até mesmo pelo seu aplicativo, para executar certas ações
25. X TREINAMENTO ANDROID | INTENTS Google photos lança uma intent Todos aplicativos que respondem a intent são mostrados
26. X TREINAMENTO ANDROID | INTENTS botaoIrParaHome.setOnClickListener { val uriIntent = Uri.parse("geo:37.7749,-122.4194") val mapIntent = Intent(Intent.ACTION_VIEW, uriIntent) startActivity(mapIntent) }
27. X TREINAMENTO ANDROID | INTENTS • No Android uma Activity não é instanciável, para navegar entre telas usamos as Intents. • Quando precisamos passar dados adicionais da tela atual para a próxima tela usamos objetos denominados EXTRAS e depois iniciamos nossa activity passando estes extras para ela.
28. X TREINAMENTO ANDROID | 3ª ENTREGA: ABRIR NOVA TELA AO CLICAR NO BOTÃO Clique no botão
29. X TREINAMENTO ANDROID | 3ª ENTREGA: ABRIR NOVA TELA AO CLICAR NO BOTÃO botaoIrParaHome.setOnClickListener { val intent = Intent(this@SplashActivity, MainActivity::class.java) startActivity(intent) } • No Android uma Activity não é instanciável, para navegar entre telas usamos as Intents. • Primeiro criamos um objeto intent, passando o contexto atual (activity atual) e passamos a tela que queremos abrir • Depois pedimos pra que o Android inicie a activity nova, passando a intent que criamos
30. X TREINAMENTO ANDROID | 4ª ENTREGA: PASSAR UM EXTRA PARA PRÓXIMA TELA • Criamos o objeto intent igual fizemos anteriormente • Para passar um extra dizemos uma chave e depois qual um valor (key-value) • Evitamos passar objetos gigantes entre uma tela e outra val extras = intent.extras val texto = extras.getString("chave") textoSegundaTela.text = texto val extras: Bundle? = intent.extras val texto: String? = extras?.getString("chave") textoSegundaTela.text = texto?: "Não tem extras"
31. TREINAMENTO ANDROID SEGUNDO LAYOUT
32. X TREINAMENTO ANDROID | 5ª ENTREGA: CONSTRUIR O SEGUNDO LAYOUT
33. TREINAMENTO ANDROID CUSTOMIZAÇÃO DE ELEMENTOS
34. X TREINAMENTO ANDROID | CUSTOMIZAÇÃO DE ESTILOS • Os elementos do layout podem ser customizados • Estas customizações são salvas em arquivos .xml na pasta drawable • Para aplicarmos a customização em um componente, declaramos o resource criado como background <shape xmlns:android="http://schemas.android.com/apk/res/android"> <stroke android:width="2sp" android:color="@color/cor_botao"/> <gradient android:startColor="@color/purple_dark" android:endColor="@color/cor_botao" android:gradientRadius="20dp" android:type="linear" android:angle="180"/> </shape>
35. X TREINAMENTO ANDROID | 6ª ENTREGA: APLICAR GRADIENTE NO BOTÃO
36. TREINAMENTO ANDROID INTERNACIONALIZAÇÃO
37. X TREINAMENTO ANDROID | INTERNACIONALIZAÇÃO • Permite que uma aplicação Android use a mesma String com textos diferentes dependendo da linguagem selecionada nas configurações • Criamos uma pasta values-XX dentro da pasta resources (onde xx é a sigla para a linguagem). Exemplo: values-en <Button android:id="@+id/botaoIrParaHome" android:layout_width="match_parent" android:layout_height="wrap_content" android:text=“@string/ir_para_home_text”/>
38. TREINAMENTO ANDROID RECYCLERVIEW
39. X TREINAMENTO ANDROID | LISTAS COM RECYCLER VIEW Adapter Item 1 Item 2 Item 3 … Item n Items Lista
40. X TREINAMENTO ANDROID | LISTAS COM RECYCLER VIEW
41. X TREINAMENTO ANDROID | 7ª ENTREGA: CRIAR UMA LISTA DE REPOSITÓRIOS dependencies { implementation 'com.android.support:recyclerview-v7:27.0.0' } class RepositoriesAdapter : RecyclerView.Adapter<RecyclerView.ViewHolder>() { override fun onCreateViewHolder(parent: ViewGroup?, viewType: Int): RecyclerView.ViewHolder { TODO("not implemented") } override fun getItemCount(): Int { TODO("not implemented") } override fun onBindViewHolder(holder: RecyclerView.ViewHolder?, position: Int) { TODO("not implemented") } }
42. X TREINAMENTO ANDROID | 7ª ENTREGA: CRIAR UMA LISTA DE REPOSITÓRIOS override fun getItemCount(): Int { return items.size } class ViewHolder(viewItem: View): RecyclerView.ViewHolder(viewItem) { val nameView = viewItem.repository_item fun bind(name: String) { nameView.text = name } }
43. X TREINAMENTO ANDROID | 7ª ENTREGA: CRIAR UMA LISTA DE REPOSITÓRIOS override fun onCreateViewHolder(parent: ViewGroup?, viewType: Int): RecyclerView.ViewHolder { val view = LayoutInflater.from(parent?.context) .inflate(R.layout.repository_item, parent, false) return ViewHolder(view) } override fun onBindViewHolder(holder: RecyclerView.ViewHolder?, position: Int) { val viewHolder = holder as ViewHolder viewHolder.bind(items[position]) }
44. TREINAMENTO ANDROID PICASSO (BIBLIOTECA DE IMAGEM)
45. X TREINAMENTO ANDROID | 8ª ENTREGA: CARREGAR AS IMAGENS ATRAVÉS DA URL DA IMAGEM dependencies { (...) implementation 'com.squareup.picasso:picasso:2.71828' }
46. X TREINAMENTO ANDROID | 8ª ENTREGA: CARREGAR AS IMAGENS ATRAVÉS DA URL DA IMAGEM Picasso.get() .load(URL_IMAGEM) .into(splashImagem) <uses-permission android:name="android.permission.INTERNET"/> AndroidManifest.xml SplashActivity.kt companion object { const val URL_IMAGEM = "http://i.imgur.com/DvpvklR.png" }
47. TREINAMENTO ANDROID RETROFIT (BIBLIOTECA DE NETWORK)
48. X TREINAMENTO ANDROID | 9ª ENTREGA: CONECTAR COM API DO GITHUB dependencies { (…) implementation 'com.squareup.picasso:picasso:2.71828' implementation 'com.squareup.retrofit2:retrofit:2.4.0' }
49. X TREINAMENTO ANDROID | 9ª ENTREGA: CONECTAR COM API DO GITHUB var retrofit = Retrofit.Builder() .baseUrl("https://api.github.com/") .addConverterFactory(GsonConverterFactory.create()) .build() interface GithubService { @GET("repositories") fun getCharacters(): Call<List<Character>> } fun getService(): GithubService? { return retrofit.create(GithubService::class.java) }
50. TREINAMENTO ANDROID CURSOS / DOCUMENTAÇÃO PRA ESTUDAR EM CASA
51. X TREINAMENTO ANDROID | PARA ESTUDAR EM CASA • https://br.udacity.com/course/new-android-fundamentals--ud851 (gratuito) • https://developer.android.com/ (documentação oficial / tutoriais ) • https://www.youtube.com/user/androiddevelopers • http://slack.androiddevbr.org/ (Slack AndroidDevBr)