Upload
motorola-mobility-motodev
View
1.629
Download
2
Embed Size (px)
Citation preview
Anna SchallerPeter van der Linden
Evangelistas da tecnologia AndroidPlataformas e serviços para desenvolvedores
Brasil - #appsum11br
Motorola Mobility
Introdução a fragmentos
2Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Fragments (fragmentos)
• Permitem que um aplicativo seja dividido em subcomponentes que podem ser gerenciados individualmente e combinados de diferentesmaneiras, como criando uma UI com vários painéis.
3Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Por que fragmentos?
• Do ponto de vista do desenvolvedor, a maior transição entre os smartphones e os tablets é o tamanho da tela.
• Os fragmentos criam uma ponte para os aplicativos que precisam ser otimizadas para smartphones e tablets
4Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Chegando lá
• Duas maneiras de se chegar lá
– Android 3.0 SDK
– Pacote Android Compatibility• Número de layouts
– Suporte para dois ou mais painéis em todos os lugares
– Suporte para painel único em todos os lugares• Ainda precisa de algum tipo de Activity(s)• Criar um par de fragmentos• Para cada fragmento visível adicionar uma UI• Adicionar os fragmentos a uma Activity
5Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
• Tamanho da tela
– pequeno, normal, grande, extra grande
• Para cada tamanho de tela há duas orientações
– Paisagem
– Retrato
• Plano para diferentes configurações
– /res/layout-small-land e /res/layout-small-port
– /res/layout-normal-land e /res/layout-normal-port
– /res/layout-large-land e /res/layout-large-port
– /res/layout-xlarge-land e /res/layout-xlarge-land
Planeje seus layouts
7Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Fragmentos: dois painéis
Fragmentode Lista Fragmento
Atividade
findFragmentById(R.id.DetailFragment)
setContentView(R.layout.main)
8Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Trabalhando com fragmentos no Android 3.01. Crie uma nova classe para cada um de seus fragmentos
• importe android.app.Fragment;
– estenda Fragment ou ListFragment (em vez de Activity)
– adicione chamadas de ciclo de vida2. Crie um novo arquivo resource.xml para cada fragmento
<ViewGroup> <UI elements> </ViewGroup>
3. Atualize main.xml com uma nova tag de fragmento para cada fragmento<fragmentclass="my.new.fragment.class"
android:id="@+id/fragmentIdX">4. Em MainApp.java (estende Activity)
• importe android.app.Fragment;
• carregue o layout do aplicativo com setContentView(R.layout.main)
• os itens da lista fragment1 se unem ao fragment2 com findFragmentById(R.id.fragmentIdX).
9Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Anatomia de um projeto: somente dois painéis(Android 3.0)
myFragmentProject|-- AndroidManifest.xml|-- /src|------- /main.java // estender Activity|------- /fragment1.java // estender Fragment, ListFragment, DialogFragment, etc|------- /fragment2.java // estender Fragment, ListFragment, DialogFragment, etc|--- /res|------- /layout-land // layout paisagem|----------- /main.xml // tags do w/fragment do arquivo de recursos do
aplicativo em orientação paisagem|----------- /fragment1.xml // layout da UI do fragmento 1 |----------- /fragment2.xml // layout paisagem da UI do fragmento 2|------- /layout-port // layout retrato|----------- /main.xml // tags do w/fragment do arquivo de recursos do
aplicativo em orientação retrato|----------- /fragment2.xml // layout retrato da UI do fragment 2|------- /values-xlarge| . . .
10Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0: main.java
• A atividade principal aplica um layout da forma habitual duranteonCreate()
• setContentView (R.layout.main) carrega o arquivo de recurso que contém o layout com as tags <fragment>. Os fragmentos são instanciados assim que a atividade carrega o layout.
11Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0: Layout principal
fragment1 (lista)
fragment2 (detalhe)
Paisagemlado a lado
12Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0: Layout principal
Retratoparte superior atéa parte inferior
largura e altura da listaprecisam ser invertidosquando muda aorientação
13Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0: Lista de fragmentos
Configuraçãodo adaptador de lista
criar retornode chamada do item de lista
encontrar fragmentode detalhe e atualizar imagem
nova chamadade ciclo de vidapara a Activity criada
14Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0: Detalhe do fragmento
Inflar exibiçãode detalhe ecarregar a primeiraimagem
substituirimagemcom base naposição da lista
15Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Código 3.0:UI de fragmentos
(fragmento 1)Item de lista
(fragmento 2)Framelayoutcom ImageView
16Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
• Definindo os recursos da UI
– Use as mesmas views e viewgroups como uma
Activity
Fragmentos com uma UI
listfragment.xml<TextView>
fragment.xml<FrameLayout>
<ImageView><LinearLayout><GridView>[. . .]dialogfragment
17Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Fragmentos sem uma UI
• Como os fragmentos podem ser compartilhados entre as Atividades, épossível executar uma thread em um fragmento “worker” (sem UI) e compartilhá-la entre as Activities
• Ainda assim é preciso definir o fragmento em uma classe separada(subclasse Fragment)
– /src/WorkerFragment.java• Não precisa de arquivo de recurso, já que não há UI
– res/layout/WorkerFragment.xml• A tag <fragment> não é necessária no arquivo de layout da atividade,
porém não há mais um ID para localização do fragmento• Sem um @+id, é preciso interagir com o fragmento por meio de uma
“tag”
18Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
findFragmentByTag()public static class WorkerFragmentextends Fragment {
[. . .] // fazer algo em uma linha de plano de fundo}
public static class myOtherFragment extends Fragment {@Overridepublic void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
FragmentManagerfm = getFragmentManager();
// Verifique se o workerfragmentfoi mantido.m WorkFragment = (WorkerFragment)fm.findFragmentByTag("work");
// Se não foi (ou éo primeiro tempo em execução), temos que criá-lo.if(mWorkFragment == null) {mWorkFragment = new WorkerFragment();
// Informe com quem ele estátrabalhando.mWorkFragment.setTargetFragment(this, 0);fm.beginTransaction().add(m WorkFragment, "work").com mit();
}}
}
19Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Android Compatibility Package (Pacote de compatibilidade do Android)
• também conhecido como “Fragmentos para Todos”• Honeycomb versus Pacote Android Compatibility• Qual é a diferença?
• A Compatibility Library funciona com API de nível 4 ou superior• Nova biblioteca que deve ser adicionada ao seu projeto• Novo tipo de Activity• Novas APIs
20Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Painel duplo (Android 2.2 em paisagem)
22Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Fragmentos: painel duplo
Fragmentode Lista Fragmento
FragmentActivity1
findFragmentById(R.id.DetailFragment)
setContentView(R.layout.main)
23Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Fragmentos: painel único
Fragmento
FragmentoActivity1
FragmentoActivity2
Fragmentode Lista
intent.setClass(getActivity(),Fragment2.class);startActivity(intent);
setContentView(R.layout.main)
findViewById(R.id.DetailFragment) is NULL
24Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Modificações para a Compatibility Library
• Atualizar recursos
– O layout retrato tem apenas a tag fragment1 (sem a tag fragment2)• Atualizar código
• importe android.v4.support.*
– Defina a função booleana com base na orientação
– Se orientation == landscape o painel é duplo• Exiba o fragment1 e fragment2
– Se orientation == portrait o painel é único• Abra fragment2 em uma nova FragmentActivity por meio de um intent
– Chame getSupportFragmentManager() em vez de getFragmentManager()
25Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Anatomia de um projeto: painel duplo + painel único (pacote Android Compatibility) myFragmentProject|-- AndroidManifest.xml|-- /src|------- /main.java // estender FragmentActivity|------- /fragment1.java // estender Fragment, ListFragment, DialogFragment, etc|------- /fragment2.java // estender Fragment, ListFragment, DialogFragment, etc|------- /fragment2Main.java // estender FragmentActivity|--- /res|------- /layout-land // layout paisagem (orientação natural do tablet)|----------- /main.xml // arquivo de recurso do tablet ou do aplicativo em
orientação paisagem (duplo)|----------- /fragment1.xml // layout da UI do fragmento 1 |----------- /fragment2.xml // layout da UI do fragment 2 |------- /layout-port // layout retrato (orientação natural do smartphone)|----------- /main.xml/ // arquivo de recurso do phone ou do aplicativo em
orientação retrato (único)|----------- /fragment1.xml|------- /values-xlarge| . . .
26Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Usando o Android Compatibility Package
• Configurando o ambiente
– Baixe o "Android Compatibility Package" utilizando o Android SDK & AVD Manager. No diretório de instalação do SDK, você encontraráextras/android/compatibility/v4/android-support-v4.jar.
– Crie um novo projeto Android no nível de API selecionado (4 a 10).
– Adicione o android-support-v4.jar ao diretório /libs do seu projeto.
– Se você é um usuário do Studio ou Eclipse, o adicione também ao seu build path para o projeto (Project (Projeto)->Properties(Propriedades)->Java Build Path (Caminho de Construção Java)->Libraries (Bibliotecas)->Add JAR (Incluir JAR).
27Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Apresentação do código
© 2010 Motorola Mobility, Inc.
28Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
A visão global
PRESSIONE
O celular precisa de duas telasÀ esquerda está uma lista, À direita estão os detalhes do ListItemselecionado
O tablet tem espaço para duas telas
Mas não temos uma maneira de colocar duas Activities em uma tela...
29Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Até agora!• Nós ainda não podemos colocar duas Activities na tela
• Mas podemos fazer algo quase tão bom quanto
• Nós podemos colocar a maior parte de nossa Activity em um Fragment
• Fragments podem estar em um layout sozinhos, com Viewsou outros Fragments. O Framework já nos oferece recursos de layout alternativos para telas de diferentes tamanhos. Assim, basta criar um novo layout para dispositivos extra grandes.
• Voilà: tornar apps convenientes para o tablet é somente "refatoração"
30Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Anatomia de um aplicativo (antes dos fragmentos)
PRESSIONE
setContentView(r.layout.showoneitem);
<LinearLayout …
<ScrollView …
res/layout/showoneitem.xml
ShowOneItemActivity.javaMainActivity.java
main.xml
31Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Indo para a próxima tela
PRESSIONE
onCreate(…) {
}
ShowOneItemActivity.javai = new Intent( Ctxt,ShowOneItemActivity.class);startActivity( i );
MainActivity.java
<activity android:name=".MainActivity"/><activity android:name=”.ShowOneItemActivity"/>
</application>
AndroidManifest.xml
32Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
A Estratégia Fragment para ShowOneItemActivity
• Nós vamos mudar todo o código ShowOneItemActivity para um Fragment
• Esse Fragment será invocado por ShowOneItemActivity quando estiver em um dispositivo de tela pequena, normal ou grande
• ... mas também pode ser incorporado no layout XML de alguma outra Activity, quando estiver em uma tela extra grande
• Portanto, há duas maneiras de entrar no ShowOneItemFragmentA partir da Activity que doou todo o seu código para o FragmentA partir de um layout XML , que pertence a alguma outra Activity
33Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Adicionará um Fragment para ShowOneItemActivity
<LinearLayout …
<ScrollView …
res/layout/showoneitem.xml
ShowOneItemActivity.javaQual é a sua aparênciaagora
Encaixe um Fragmentaqui
34Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Adicione um Fragment para ShowOneItemActivity
<LinearLayout …
<ScrollView …
showoneitem.xml
setContentView(r.layout.showoneitem_actfrag);ShowOneItemActivity.java
<fragment class=”ShowOneItemFragment”
android:layout_width=…
res/layout/showoneitem_actfrag.xml
… extends Fragment {public View onCreateView(
LayoutInflater i, ViewGroup c, Bundle b) {
return i.inflate( R.layout.showoneitem, c);
ShowOneItemFragment.java
35Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
O arquivo XML para um fragmento
<?xml version="1.0" encoding="utf-8"?><fragmentxmlns:android="http://schemas.android.com/apk/res/android"android:name="com.example.ShowOneItemFragment"android:layout_width="match_parent"android:layout_height="wrap_content"android:id="@ +id/showoneitemfragment">
</fragment>
• Dimensionamento comum de layout para informar a altura e largura
• Pontos de XML para o classfile do Fragment
• Deve fornecer a ele um id ou tag
36Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
O código de um fragmento
public class foo extends Fragment {public void onCreate()public View onCreateView(...) public void onPause() ...
}
• Quando você muda o código da Activity, ele mapeia próximo aos mesmos eventos LifeCycle• Esses três métodos podem ser o suficiente. Salve o estado em OnPause• onCreateView() infla o XML, retorna a View raiz do Fragment
37Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
A história até agora
• Refatoramos nossa Activity em uma Activity e um fragment
• Todo o código de Activity mudou para o Fragment. A Activity agora é apenas uma cobertura fina para o Fragment
• Podemos entrar no código como uma Activity ou um Fragment
• Como escolher adequadamente?
38Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Use o Alternative Resource (Recurso alternativo) para obter o layout correto!
PRESSIONE
XML para layout da telavermelha pequena
<fragment class= “a.b.c.d”
<fragment class=“w.x.y.z”
res/layout-xlarge/main.xml
res/layout/main.xml
setContentView(R.layout.main)
Deixe que o “frame work”!
39Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
As listas podem ser um grande problema com essa abordagem
• Você não tem um arquivo XML para a lista como um todo
• Você só tem um arquivo XML para uma entrada na lista
• O setListAdapter faz a mágica de distribuir a ListViewna ListActivity
• Mas você precisa de arquivos XML para chegar aos fragments a partir de Activities
• Solução? ListFragment! Similar ao ListActivity
40Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Um último conselho
• Os fragmentos são legais e você vai querer usá-los para que seus apps se adequem ao tablet
• Tenha muito cuidado com classes consistentes e nomes de arquivoXML!
• Alguns métodos de substituição exigem uma chamada para a superclasse, por exemplo, onCreate() ao usar uma FragmentActivity
• Dentro de um Fragment, getActivity() é muito útil
• Em uma Activity, estender FragmentActivity para obter operações de Fragment, como getSupportFragmentManager();
41Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Usando os Fragments: informações
• Informações de instruções no 3.0 Developer Guide (Guia do desenvolvedor do 3.0) em Fragments
• Consulte a 3.0 Reference para APIs
– android.app.Fragment
– android.app.ListFragment
• Exibe uma lista semelhante à ListActivity
– android.app.DialogFragment
• Exibe um diálogo flutuante
– android.app.FragmentManager
• Interface para interagir com o fragment (findFragmentById)
– android.app.FragmentTransaction
• APIs para operações de fragment (adicionar, remover, substituir, ocultar, mostrar)
42Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Usando Fragments: exemplos• Aplicativo Honeycomb Gallery para fragments do Android 3.0• Na pasta de extras do Android Compatibility Package
– /android-sdk/extras/android/compatibility/v4/samples/ApiDemos/src
/com/example/android/apis/app/
– Procure o Fragment<>.java para versão HC
– Fragment<>Support*.java para código do pacote Android Compatibility• Publicações do blog de Reto Meier
– http://blog.radioactiveyak.com/2011/02/android-app-surgery-earthquake-redux.html
– http://blog.radioactiveyak.com/2011/02/strategies-for-honeycomb-and-backwards.html
• Publicações do blog de Dianne Hackborn
– http://android-developers.blogspot.com/2011/02/android-30-fragments-api.html (The Android 3.0 Fragments API)
43Page
© 2011 Motorola Mobility, Inc.
MOTODEV App Summit 2011
Obtenha mais informações: developer.motorola.com
• Ferramentas
– MOTODEV Studio: IDE baseada no Eclipse com recursos adicionais (localização de String, gerente de banco de dados)
– App Validator: ferramenta on-line para pré-testes de aplicativos Androidpara compatibilidade entre dispositivos
• Artigos técnicos
– Dicas de programação para o Motorola XOOM
– Entendendo a compactação de textura• Especificações do produto
– http://developer.motorola.com/products/xoom/• Fóruns de discussão