Concrete Logo
Hamburger button

App Extension – Today Widget

  • Blog
  • 2 de Junho de 2016
Share

*Esse post foi originalmente publicado para o EquinociOS. Acesse aqui para ver o post e aqui para saber mais sobre a iniciativa.

App Extensions

App extensions é uma feature presente no XCode desde a versão 6 da IDE. Ela tem como objetivo melhorar a experiência do usuário e uma das partes mais interessantes é que você pode expandir uma ou mais funcionalidades do seu app para outros, fazendo com que os usuários possam interagir com ele mesmo usando outro aplicativo.

Podemos criar diversos tipos de extensions, mas os mais comuns são:

  • Share: compartilhar conteúdo com alguém ou outros aplicativos
  • Action: exibir um conteúdo ou executar uma ação dentro de outro contexto
  • Photo Editing: editar vídeo ou foto
  • Document Provider: acessar e/ou gerenciar um repositório de arquivos
  • Custom Keyboard: substituir o teclado padrão iOS por outro personalizado
  • Today Widget: obter informações relevantes ou executar ações rápidas no Centro de Notificações (Today Notification)

Today Notification – Widget

Neste post, vamos abordar o Today Notification. A ideia aqui é dar uma introdução ao assunto e estimular você a explorar mais esta feature que tanto agrega à experiência que o usuário tem ao utilizar seu app.

Um App Extension dentro do Centro de Notificações é chamado de Widget.

Widgets têm o objetivo de trazer informações relevantes ao usuário, como clima, compromissos ou cotação da bolsa (widgets que já vem habilitados por default), por exemplo.

Today Widgets precisam garantir que as informações exibidas estejam sempre atualizadas, responder de forma adequada às interações do usuário e ter boa performance (sempre importante lembrar este ponto, pois se não cuidar do consumo de memória com carinho, seu widget pode ser finalizado pelo sistema).

Chega de ~blá blá blá~ e vamos à parte prática da parada \o/

Neste post, abordaremos quatro pontos principais sobre a implementação do Today Widget:

  • Setup Inicial – adicionando Today Widget
  • Manipular elementos visuais em runtime
  • Atualização do conteúdo
  • Abrir um app que esteja no mesmo contexto do widget

Setup Inicial

Abra o Xcode e clique em Create a new Xcode project. Para este exemplo, podemos criar um Single View Application. Defina um nome para o seu projeto e let’s play a game =)

img1

Com o projeto aberto, clique em File > New > Target.

Em Application Extension, selecione Today Extension.

img2

Defina um nome para o projeto.

img3

Após isto, você será questionado se deseja ativar um scheme para o seu novo Target. Particularmente, eu prefiro já ativar pois assim você pode rodar e debugar o seu target de forma independente. Mas fica a seu critério, pode adicionar depois se achar necessário.

img4

Ao rodar o projeto você pode notar que ele já se encontra disponível no Today Notification.

img5

Manipulando Elementos Visuais

Outra coisa bacana do Today Extension é a liberdade que você tem para manipular os elementos visuais, como se estivesse trabalhando em uma tela do seu app.

Ao adicionar um novo target para o Today Extension, você pode notar – no Project Navigator – que foi criada uma pasta com o nome do seu target e dentro dela foram adicionados alguns arquivos como um Class para View Controller (.h e .m se o projeto for Objective-C e .swift se o projeto for Swift) , um Storyboard e um Info.plist.

Abrindo a implementação da View Controller, você pode notar que ela implementa o protocolo NCWidgetProviding.

Este protocolo possui alguns métodos que permitem você customizar o layout e alguns comportamentos do seu widget.

Agora abra o Storyboard. Note que temos um object View Controller adicionado com um layout padrão, com um label “Hello World”. É nesta view que vamos trabalhar nosso layout. Para o post não ficar muito longo e cansativo, dividi a implementação em três passos que podemos acompanhar nos vídeos abaixo. Enjoy!

Passo 1 – Customizando layout e comportamento

Passo 2 – Chamada simples de API

Passo 3 – Enviando uma ação para outro aplicativo

Para finalizar, vamos fazer nosso Widget se comunicar com nosso aplicativo. Esta comunicação será realizada por meio de um Custom URL Scheme.

E assim finalizamos nossa introdução ao Today Extension. Ficou alguma dúvida ou tem algum comentário a fazer? Aproveite os campos abaixo e até a próxima!

É desenvolvedor iOS e quer espaço em um time ágil de verdade? Acesse aqui.