SlideShare uma empresa Scribd logo
IBDESIGNABLESComo tornar mais interessante o desenvolvimento de interfaces
Thiago Holanda Diego Ventura
Concrete Solutions
Inventos Digitais
iMusica Corp
Crowd Mobile
POLÊMICA
Como você faria no seu storyboard para desenhar uma borda de
1px somente na parte de baixo de um elemento ?
POLÊMICA
Como você faria no seu storyboard para desenhar uma borda de
1px somente na parte de baixo de um elemento ?
ASSIM ?
POLÊMICA
E se nós disséssemos que você poderia desenhar essa linha via
código, sem usar uma UIView e visualizando o resultado em tempo
real no Interface Builder ? Quer ver ?
POLÊMICA
Quando surgiu ?
O IB DESIGNABLES é uma das grandes features disponibilizadas
pelo Xcode 6.
É possível renderizar elementos customizados em tempo real, sem
a necessidade de compilar a aplicação para ver o resultado.
Quando surgiu ?
O IB DESIGNABLES é uma das grandes features disponibilizadas
pelo Xcode 6.
É possível renderizar elementos customizados em tempo real, sem
a necessidade de compilar a aplicação para ver o resultado.
Quando usar ?
Quando você for usar a mesma estrutura de elemento duas ou mais
vezes;
Quando você não quiser ficar rodando o app e fazendo aquele fluxo
de 5 telas só pra ver se o gradiente ficou legal;
Propriedades disponíveis
• BOOL
• CGFloat
• CGPoint
• CGRect
• CGSize
• NSInteger
• NSString
• UIColor
• UIImage
Vantagens
• Ele facilita a forma como você implementa e reusa as suas
interfaces no storyboard;
• É possível fazer debug de uma custom view, sem precisar rodar a
aplicação inteira;
• Reuso de custom views;
• Ao reutilizar uma custom view, você não precisa configurar
constraints internas novamente;
• Agora você pode aliar o controle das interfaces via código com a
mágica do Interface Builder;
• Pra nunca mais precisar fazer uma UIView de 1pt 😜
Desvantagens
• Xcode se perde as vezes e deixa de renderizar as suas
modificações. Workaround ? Aplica jesus Windows, na causa:
reinicie a IDE;
• Código com erro, impede a renderização;
• Não é possível criar propriedade que seja uma lista, ex: enum;
• Propriedades são bem limitadas;
• De vez em quando, o Xcode pede arrego e o crash vira nosso
amigo;
IB DESIGNABLES
Demo
IB DESIGNABLES
Perguntas ?
Thiago Holanda Diego Ventura
Concrete Solutions
Inventos Digitais
thiago@holanda.mobi
iMusica Corp
Crowd Mobile
diego.ventura@me.com
Obrigado

Mais conteúdo relacionado

Semelhante a IBDESIGNABLE

Desenvolvendo para iOS com Cocoa-Touch
Desenvolvendo para iOS com Cocoa-TouchDesenvolvendo para iOS com Cocoa-Touch
Desenvolvendo para iOS com Cocoa-Touch
Campus Party Brasil
 
Design de Interfaces para Dispositivos Móveis
Design de Interfaces para Dispositivos MóveisDesign de Interfaces para Dispositivos Móveis
Design de Interfaces para Dispositivos Móveis
Instituto Faber-Ludens
 
O que há de incrível sobre o Flutter
O que há de incrível sobre o FlutterO que há de incrível sobre o Flutter
O que há de incrível sobre o Flutter
Wiliam Buzatto
 
Padrões de projeto para o Android - Interação para desenvolvedores
Padrões de projeto para o Android - Interação para desenvolvedoresPadrões de projeto para o Android - Interação para desenvolvedores
Padrões de projeto para o Android - Interação para desenvolvedores
Gustavo Bitencourt
 
Desenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluçõesDesenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluções
talkitbr
 
Desenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluçõesDesenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluções
Alessandra Rosa
 
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
Marcelo Marques Gonçalves
 
Apresentação android
Apresentação androidApresentação android
Apresentação android
Leandro Rodrigues
 
InfraGUIBuilder
InfraGUIBuilderInfraGUIBuilder
InfraGUIBuilder
Diogo Augusto Pereira
 
HTML5 Mobile Aula 1
HTML5 Mobile Aula 1HTML5 Mobile Aula 1
HTML5 Mobile Aula 1
Jose Berardo
 
Desenvolvimento de Apps e Games para iOS - Parte 2
Desenvolvimento de Apps e Games para iOS - Parte 2Desenvolvimento de Apps e Games para iOS - Parte 2
Desenvolvimento de Apps e Games para iOS - Parte 2
Erisvaldo Junior
 
Milton Onodera - Prototipação para Windows Phone usando o Expression Blend
Milton Onodera - Prototipação para Windows Phone usando o Expression BlendMilton Onodera - Prototipação para Windows Phone usando o Expression Blend
Milton Onodera - Prototipação para Windows Phone usando o Expression Blend
INdT
 
Workshop frontend
Workshop   frontendWorkshop   frontend
Workshop frontend
Leandro Mancini
 
Conheça a Plataforma Xamarin
Conheça a Plataforma XamarinConheça a Plataforma Xamarin
Conheça a Plataforma Xamarin
William S. Rodriguez
 
Demonstrador virtual web com recursos de Realidade Aumentada - Apresentação
Demonstrador virtual web com recursos de Realidade Aumentada - ApresentaçãoDemonstrador virtual web com recursos de Realidade Aumentada - Apresentação
Demonstrador virtual web com recursos de Realidade Aumentada - Apresentação
Leonardo Pereira Santos
 
Hello world hybrid apps oportunidades com ionic framework v2
Hello world hybrid apps  oportunidades com ionic framework v2Hello world hybrid apps  oportunidades com ionic framework v2
Hello world hybrid apps oportunidades com ionic framework v2
Ricardo Netto - MCP, MSP
 
Android ICS Highlights - AndroidRec
Android ICS Highlights - AndroidRecAndroid ICS Highlights - AndroidRec
Android ICS Highlights - AndroidRec
Antonio Marin Neto
 
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
Pedro Edson Silva Barros
 
Curso Básico Android - Aula 01
Curso Básico Android - Aula 01Curso Básico Android - Aula 01
Curso Básico Android - Aula 01
Lucas Boeing Scarduelli
 
Android: Projetando e Pensando em Design
Android: Projetando e Pensando em DesignAndroid: Projetando e Pensando em Design
Android: Projetando e Pensando em Design
Eloi Júnior
 

Semelhante a IBDESIGNABLE (20)

Desenvolvendo para iOS com Cocoa-Touch
Desenvolvendo para iOS com Cocoa-TouchDesenvolvendo para iOS com Cocoa-Touch
Desenvolvendo para iOS com Cocoa-Touch
 
Design de Interfaces para Dispositivos Móveis
Design de Interfaces para Dispositivos MóveisDesign de Interfaces para Dispositivos Móveis
Design de Interfaces para Dispositivos Móveis
 
O que há de incrível sobre o Flutter
O que há de incrível sobre o FlutterO que há de incrível sobre o Flutter
O que há de incrível sobre o Flutter
 
Padrões de projeto para o Android - Interação para desenvolvedores
Padrões de projeto para o Android - Interação para desenvolvedoresPadrões de projeto para o Android - Interação para desenvolvedores
Padrões de projeto para o Android - Interação para desenvolvedores
 
Desenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluçõesDesenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluções
 
Desenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluçõesDesenvolvendo APPs para múltiplas resoluções
Desenvolvendo APPs para múltiplas resoluções
 
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
Aplicativos hibridos-com-ionic-voce-tambem-pode-comecar-a-desenvolver-agora-t...
 
Apresentação android
Apresentação androidApresentação android
Apresentação android
 
InfraGUIBuilder
InfraGUIBuilderInfraGUIBuilder
InfraGUIBuilder
 
HTML5 Mobile Aula 1
HTML5 Mobile Aula 1HTML5 Mobile Aula 1
HTML5 Mobile Aula 1
 
Desenvolvimento de Apps e Games para iOS - Parte 2
Desenvolvimento de Apps e Games para iOS - Parte 2Desenvolvimento de Apps e Games para iOS - Parte 2
Desenvolvimento de Apps e Games para iOS - Parte 2
 
Milton Onodera - Prototipação para Windows Phone usando o Expression Blend
Milton Onodera - Prototipação para Windows Phone usando o Expression BlendMilton Onodera - Prototipação para Windows Phone usando o Expression Blend
Milton Onodera - Prototipação para Windows Phone usando o Expression Blend
 
Workshop frontend
Workshop   frontendWorkshop   frontend
Workshop frontend
 
Conheça a Plataforma Xamarin
Conheça a Plataforma XamarinConheça a Plataforma Xamarin
Conheça a Plataforma Xamarin
 
Demonstrador virtual web com recursos de Realidade Aumentada - Apresentação
Demonstrador virtual web com recursos de Realidade Aumentada - ApresentaçãoDemonstrador virtual web com recursos de Realidade Aumentada - Apresentação
Demonstrador virtual web com recursos de Realidade Aumentada - Apresentação
 
Hello world hybrid apps oportunidades com ionic framework v2
Hello world hybrid apps  oportunidades com ionic framework v2Hello world hybrid apps  oportunidades com ionic framework v2
Hello world hybrid apps oportunidades com ionic framework v2
 
Android ICS Highlights - AndroidRec
Android ICS Highlights - AndroidRecAndroid ICS Highlights - AndroidRec
Android ICS Highlights - AndroidRec
 
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
Aplicativos Móveis: PWA, Instants Apps. Vamos entender?
 
Curso Básico Android - Aula 01
Curso Básico Android - Aula 01Curso Básico Android - Aula 01
Curso Básico Android - Aula 01
 
Android: Projetando e Pensando em Design
Android: Projetando e Pensando em DesignAndroid: Projetando e Pensando em Design
Android: Projetando e Pensando em Design
 

IBDESIGNABLE

  • 1. IBDESIGNABLESComo tornar mais interessante o desenvolvimento de interfaces Thiago Holanda Diego Ventura Concrete Solutions Inventos Digitais iMusica Corp Crowd Mobile
  • 2. POLÊMICA Como você faria no seu storyboard para desenhar uma borda de 1px somente na parte de baixo de um elemento ?
  • 3. POLÊMICA Como você faria no seu storyboard para desenhar uma borda de 1px somente na parte de baixo de um elemento ? ASSIM ?
  • 4. POLÊMICA E se nós disséssemos que você poderia desenhar essa linha via código, sem usar uma UIView e visualizando o resultado em tempo real no Interface Builder ? Quer ver ?
  • 6. Quando surgiu ? O IB DESIGNABLES é uma das grandes features disponibilizadas pelo Xcode 6. É possível renderizar elementos customizados em tempo real, sem a necessidade de compilar a aplicação para ver o resultado.
  • 7. Quando surgiu ? O IB DESIGNABLES é uma das grandes features disponibilizadas pelo Xcode 6. É possível renderizar elementos customizados em tempo real, sem a necessidade de compilar a aplicação para ver o resultado.
  • 8. Quando usar ? Quando você for usar a mesma estrutura de elemento duas ou mais vezes; Quando você não quiser ficar rodando o app e fazendo aquele fluxo de 5 telas só pra ver se o gradiente ficou legal;
  • 9. Propriedades disponíveis • BOOL • CGFloat • CGPoint • CGRect • CGSize • NSInteger • NSString • UIColor • UIImage
  • 10. Vantagens • Ele facilita a forma como você implementa e reusa as suas interfaces no storyboard; • É possível fazer debug de uma custom view, sem precisar rodar a aplicação inteira; • Reuso de custom views; • Ao reutilizar uma custom view, você não precisa configurar constraints internas novamente; • Agora você pode aliar o controle das interfaces via código com a mágica do Interface Builder; • Pra nunca mais precisar fazer uma UIView de 1pt 😜
  • 11. Desvantagens • Xcode se perde as vezes e deixa de renderizar as suas modificações. Workaround ? Aplica jesus Windows, na causa: reinicie a IDE; • Código com erro, impede a renderização; • Não é possível criar propriedade que seja uma lista, ex: enum; • Propriedades são bem limitadas; • De vez em quando, o Xcode pede arrego e o crash vira nosso amigo;
  • 14. Thiago Holanda Diego Ventura Concrete Solutions Inventos Digitais thiago@holanda.mobi iMusica Corp Crowd Mobile diego.ventura@me.com Obrigado