11 Jun, 2013 09:41

Estilizando seu app com UIAppearance

UIAppearance permite que você defina a aparência de todos as instâncias de uma classe com um só comando. Funciona assim:

[[UINavigationBar appearance] setTintColor:[UIColor redColor]];

O código acima fará com que todas as UINavigationBar do seu app tenha o fundo vermelho.

Vamos a mais exemplos. Digamos que meu aplicativo tenha a aparência abaixo:

Aparência padrão do aplicativo

Colocando o código abaixo no seu app delegate:

// Todos os UINavigationBar com fundo verde
[[UINavigationBar appearance] setTintColor:[UIColor greenColor]];  

// Todos os UIBarButtonItem com fundo verde escuro
[[UIBarButtonItem appearance] setTintColor:[UIColor colorWithRed:0 green:0.7 blue:0 alpha:1.0]];

// Todos os títulos dos UINavigationBar com fonte 'Chalkboard SE', cinza e sombra branca
[[UINavigationBar appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
                                                      [UIFont fontWithName:@"Chalkboard SE" size:18], UITextAttributeFont,
                                                      [UIColor darkGrayColor], UITextAttributeTextColor,
                                                      [UIColor whiteColor], UITextAttributeTextShadowColor,
                                                      [NSValue valueWithCGSize:CGSizeMake(0, 1)], UITextAttributeTextShadowOffset,
                                                      nil]];

Teríamos o - nada belo, admito - resultado abaixo

Aparência customizada do aplicativo

Interessante. Mas veja que acabamos com um efeito colateral indesejado: o texto e os botoes do popover foram afetados e ficaram estranhos. (Tudo bem, o layout todo ficou estranho, mas você entendeu a ideia :P)

O protocolo UIAppearance permite que você modifique elementos dentro de uma hierarquia numa linha de raciocínio semelhante aos seletores CSS. Assim:

// Removendo fundo para UIBarButtonItem dentro de UIPopoverController
[[UIBarButtonItem appearanceWhenContainedIn:[UIPopoverController class], nil] setTintColor:nil];

// Removendo atributos do título para UINavigationBar dentro de UIPopoverController
[[UINavigationBar appearanceWhenContainedIn:[UIPopoverController class], nil] setTitleTextAttributes:nil];

Agora, o resultado fica assim

Aparência customizada mas controlada

Bem "melhor", não? :)

Limitações

Infelizmente, nem todos os componentes visuais seguem o protocolo UIAppearance e os que seguem não permitem que todas as propriedades sejam definidas. Para saber quais as classes que seguem o protocolo e quais propriedades estão disponíveis, confira a lista.

A documentão do UIAppearance está disponível [aqui].(http://developer.apple.com/library/ios/#documentation/uikit/reference/UIAppearance_Protocol/)

Ao navegar neste site, você consente o uso de cookies nossos e de terceiros, que coletam informações anônimas e são essenciais para melhorar sua experiência em nosso site.