Mostrando postagens com marcador Page. Mostrar todas as postagens
Mostrando postagens com marcador Page. Mostrar todas as postagens

domingo, 16 de setembro de 2012

Paginação com Swipe no Android

Olá povo,

O versão 20 do plugin ADT (Android Development Toolkit) trouxe algumas novidades, entre elas, alguns templates de projetos que podemos optar na criação de um novo projeto Android. Hoje vou  explicar cada um desses templates e ver como utilizar o template que permite fazer uma paginação similar a do Google Play mostrada abaixo.


Note que a tela "Mais rentáveis" está em evidência, mas podemos notar que há uma opção a esquerda e outra a direita na parte superior. Esse é o intuito da paginação, que permitirá ao usuário exibir a próxima informação apenas deslizando para os lados. Vamos mostrar como fazer isso na sua aplicação.
Inicie a criação de um novo projeto e preencha os campos conforme abaixo e pressione Next.


Na segunda tela, há a opção de criarmos uma Activity em branco ou do tipo Mestre/Detalhe. A primeira cria uma Activity simples,  já a segunda, cria uma Activity que exibe uma listagem e os respectivos detalhes. Se a aplicação estiver executando em um tablet, a listagem e os detalhes de um item aparecem na mesma Activity, caso seja um smartphone, a listagem ficará em uma Activity e os detalhes serão exibidos em outra.
Selecione Blank Activity e clique em Next.
A próxima tela do assistente, solicita o nome da Activity que queremos criar, o nome do seu respectivo arquivo de layout e o título da Activity. Mas a informação mais interessante para nós aqui é o campo Navigation Type, que nos dá as seguintes opções:
A opção None não cria nenhuma opção pré-definida de navegação;
Selecionando Tabs, será criada uma estrutura básica de um Activity com abas usando uma ActionBar (que requer Android 4.1);
Tabs + Swipe é igual a anterior, mas será possível alternar entre as abas com o gesto de swipe (também requer Android 4.1);
Swipe Views + Title Strip permite alternar entre views usando swipe, e o título da view corrente é mostrado em um componente PageStrip;
A última opção é a Dropdown, que configura uma ActionBar onde o usuário poderá selecionar, através de um combobox, a tela que deseja abrir. Ao selecionar o item da lista, um Fragment será carregado (também requer Android 4.1)
Vamos utilizar a opção Swipe Views + Title Strip, pois funcionará em todas as versões do Android. Selecione-a e clique em Finish.
Uma coisa curiosa, é que para utilizar os templates acima, o assistente exige que seja selecionada a versão 4.0.1 do Android na primeira tela do assistente. Mas no caso do template que selecionamos, é possível fazer algumas alterações no projeto para que o mesmo funcione em aparelhos com versões anteriores. Tudo isso, graças a API de compatibilidade do Google (que fica na pasta libs do projeto).
1) Clique com o botão direito sobre o projeto e selecione Properties. Na tela que for exibida, selecione Android do lado esquerdo e em seguida, selecione Android 2.3 (API Level 10) e clique em OK.
2) A Activity dará erro, pois estamos importando duas classes que não existem no Android 2.3: android.app.ActionBar e android.app.FragmentTransaction. Remova esses dois imports.
3) Agora vá no AndroidManifest.xml e modifique o minSdkVersion para 10 (Android 2.3).
<uses-sdk
  android:minSdkVersion="10"
  android:targetSdkVersion="15"/>
4) Dará erro agora nas pastas values-v11, values-v14 e menu. Remova as três.
5) E para finalizar, remova o método onCreateOptionsMenu da sua Activity.

Pronto! Agora é só rodar no seu dispositivo 2.3, o resultado ficará como abaixo:
Qualquer dúvida, deixem seus comentários.

4br4ç05,
nglauber

P.S.: Post relacionado: http://nglauber.blogspot.com.br/2011/09/pagescroll.html

segunda-feira, 19 de setembro de 2011

PageScroll

Olá povo,

Certo dia, assisti uma apresentação de Silvio Meira em que ele falou que nós, como desenvolvedores, tínhamos sempre que olhar para uma aplicação e pensar: "como esses caras [desenvolvedores] fizeram isso?". Às vezes, utilizamos a aplicação sem notarmos coisas simples que poderíamos incorporar aos nossos próprios aplicativos (cuidado com as patentes :p).

Pois bem. Eu achei interessante na aplicação do TweetDeck, a forma com que ele alternava entre a Timeline e as Mentions, apenas rolando da tela na horizontal. Similar ao que é feito na home screen do próprio Android para alternar entre os "desktops".

Achava que o Android já tivesse um componente para fazer isso, mas não achei. Tentei fazer com um Gallery, mas o resultado não ficou legal. Finalmente, achei um componente chamado HorizontalPager, disponível em http://code.google.com/p/deezapps-widgets/. Distribuído sobre licença Apache, ele realiza o comportamento que eu queria e pode ser incorporado ao seu projeto sem culpa :)

Disponibilizei um projeto que utiliza "esse carinha" neste link. E Abaixo temos um screenshot do mesmo.



EDITADO
Depois de publicar esse post, recebi a dica de @acvilarim que existe uma outra forma de obter esse mesmo comportamento com a API do próprio Android: utilizando as classes ViewPager e PagerAdapter. Entretanto essas classes estão em uma biblioteca separada que provê compatibilidade da versão 1.6 em diante com o Honeycomb (3.x). Para instalá-la, você pode seguir esse tutorial aqui.
Meu colega Marcelo Alves me indicou esse artigo para começar a mexer com o ViewPager e o PagerAdapter. De qualquer forma, postei aqui um exemplo que fiz idêntico ao anterior, mas usando essa API.

4br4ç05,
nglauber