2011-08-22 13 views
22

Qual è il metodo consigliato per lo styling di un'app per iOS? Ad esempio, se ci sono più etichette o viste di testo, in che modo l'aggiornamento dello stile e del colore dei caratteri in un unico punto può aggiornare lo stile/il colore in tutti gli altri punti?Qual è il metodo consigliato per lo styling di un'app per iOS?

So che la sottoclassificazione potrebbe essere in un modo ... c'è un altro modo?

+0

Potrebbe essere necessario guardare questa libreria. Supporta più temi/skin al volo. Supporta immagini e colori al momento. Il supporto per i caratteri verrà aggiunto in futuro. https://github.com/charithnidarsha/MultiThemeManager –

risposta

9

Si potrebbe importare un file di intestazione standard in tutti i controller con diverse costanti fissati per lo styling ... ad esempio:

Styles.h

#define kFontSize 14 
#define kFontFamily @"Helevetica" 

controller

#import "Styles.h" // at the top 

myLabel.font = [UIFont fontWithName:kFontFamily size:kFontSize]; 

Personalmente penso che Interface Builder sia il modo migliore per stile, come questo risponde alla tua domanda direttamente.

+4

non lo svenderò, ma ... se si sceglie di seguire tale percorso, dichiarazioni esterne come: 'extern const CGFloat MONDarkThemeFontSize;' e 'extern NSString * const MONDarkThemeFontName; 'sono preferibili su' #define kShortName value' per molteplici ragioni. – justin

+0

Preferirei che questo sia il modo più semplice e adatto per l'app su cui sto lavorando. Grazie Alex e @Justin. – Yogesh

+0

Questa non è una buona idea. – DexterW

3

Simile a un'idea di Alex, è possibile creare una classe statica denominata ThemeManager:

typedef enum 
{ 
    defaultStyle, 
    redStyle, 
} ThemeStyles; 

@interface Level : NSObject 
{ 
    ThemeStyles currentTheme; 
} 

Tutte le classi che possono essere a tema importerà ThemeManager. Quindi, puoi creare metodi come:

+ (UIColor*) fontColor; 

Quali altre classi chiamerebbero quando desiderano un colore per il loro carattere. Quindi, se si vuole cambiare i temi, è possibile implementare fontColor come:

+ (UIColor*) fontColor 
{ 
    switch (currentTheme) 
    { 
     case defaultStyle: 
     return [UIColor blackColor]; 
     case redStyle: 
     return [UIColor redColor]; 
    } 
} 

Quando si desidera cambiare il tema, si potrebbe avere ThemeManager implementare un metodo come:

+ (void) changeTheme:(ThemeStyles)newTheme 
{ 
    currentTheme = newTheme; 
} 
6

Francamente, il migliore Il modo di procedere è utilizzare Interface Builder. Anche se potrebbe sembrare bello modificare una singola costante da qualche parte nel codice e fare in modo che l'intera app cambi stili, non funzionerà mai in questo modo. Ecco i miei ragionamenti:

1) Gli sviluppatori non scrivono il codice dell'interfaccia così come lo fa il generatore di interfacce. Il builder dell'interfaccia è uno strumento che è stato perfezionato, testato e utilizzato oltre anni. Offre font, allineamento del testo, ombra, ecc. È retrocompatibile per tutto il tempo che vorresti. Fornisce un modo molto semplice per qualsiasi numero di sviluppatori e progettisti di entrare e lavorare su qualcosa di molto semplice.

2) Ci sono sempre casi limite che dovrete tenere in considerazione. Certo, una semplice costante farà quello che vuoi il più delle volte, ma alla fine dovrai hackerare qualcosa qui dentro e introdurre qualcosa. Il codice di interfaccia "semplice" che hai scritto per iniziare crescerà, crescerà e crescerà. Altri sviluppatori dovranno mantenere quel codice. Dovrai mantenere quel codice. Dovrai archiviare e correggere bug, modificare questo, eccetto quello, ecc. Diventerà inevitabilmente un mucchio di pasticcio.

3) Più codice scrivi, più bug scrivi. Il builder dell'interfaccia serve a creare l'aspetto della maggior parte delle app iOS. Usalo. Non diventare troppo intelligente.

NOTA: Capisco che Interface Builder non possa fare tutto per tutte le app. Ci sono casi in cui la codifica di un'interfaccia è l'unica soluzione. Questa risposta è semplicemente una "best practice" generale che uso nella maggior parte delle mie app.

+2

+1. Basta creare pennini separati con stili diversi e ricaricare le viste. –

+1

Ricevo ancora app da gestire o progettare l'interfaccia utente tramite Objective-C. È bello sapere come si fa. – BlueConga

9

Aggiornamento: Suggerirei di iniziare comprendendo le API UIAppearance e vedendo quanto soddisfano le proprie esigenze. UIAppearance è un modo conveniente per fornire la stilizzazione predefinita personalizzata di attributi di controlli specifici a più livelli (ad esempio globalmente o contestualmente).


La mia risposta originale, che ha preceduto UIAppearance 's disponibilità:


dato che stiamo lavorando con un linguaggio basato oggetto ...

per l'implementazione, dipende su come vuoi che si comporti/esegua. quando l'implementazione diventa non banale, creerò spesso un protocollo. è possibile utilizzare metodi di classe o di metodi di istanza e significativamente ottimizzare questi tipi per il vostro uso, perché si crea un minor numero di colori intermedi, font, immagini, ecc

un'interfaccia di base potrebbe assumere la forma:

@protocol MONLabelThemeProtocol 

- (UIFont *)labelFont; 
- (UIColor *)labelTextColor; 
- (UITextAlignment)labelTextAlignment; 
// ... 
@end 

@protocol MONTableViewCellThemeProtocol 

- (UIFont *)tableViewCellFont; 
- (UIColor *)tableViewCellTextColor; 
- (UIImage *)tableViewCellImage; 
- (NSInteger)tableViewCellIndentationLevel; 
- (CGFloat)tableViewCellIndentationWidth; 
// ... 
@end 

poi un tema semplice amalgamare potrebbe essere dichiarato così:

@interface MONAmalgamateThemeBase : NSObject 
    < MONLabelThemeProtocol, MONTableViewCellThemeProtocol > 
{ 
@protected 
    /* labels */ 
    UIFont * labelFont; 
    UIColor * labelTextColor; 
    UITextAlignment labelTextAlignment; 
    // ... 
    /* table view cells */ 
    UIFont * tableViewCellFont; 
    UIColor * tableViewCellTextColor; 
    UIImage * tableViewCellImage; 
    NSInteger tableViewCellIndentationLevel; 
    CGWidth tableViewCellIndentationWidth; 
    // ... 
} 

@end 

in questo esempio, l'amalgamare definisce i getter e dealloc e si attende che le sottoclassi per inizializzare le variabili di istanza. è anche possibile supportare l'inizializzazione pigra se i tempi di inizializzazione sono elevati (ad esempio utilizza molte immagini).

poi una specializzazione potrebbe assumere la forma:

@interface MONDarkTheme : MONAmalgamateThemeBase 
@end 

@implementation MONDarkTheme 

- (id)init 
{ 
    self = [super init]; 
    if (nil != self) { 
     labelFont = [[UIFont boldSystemFontOfSize:15] retain]; 
     labelTextColor = [[UIColor redColor] retain]; 
     // and so on... 
    } 
    return self; 
} 

// ... 

@end 

/* declare another theme and set it up appropriately */ 
@interface MONLightTheme : MONAmalgamateThemeBase 
@end 

poi basta riutilizzare le istanze a tema (ad esempio MONDarkTheme) in tutta l'applicazione per stilizzare i punti di vista. se hai molti temi o non sono banali da costruire, allora potresti voler creare una collezione per temi (gestore temi). l'amalgamato potrebbe anche prendere un parametro, come init con tema se le tue esigenze sono semplici. puoi anche configurare oggetti da registrare per le modifiche ai temi, se hai bisogno di supporto per le modifiche dinamiche.

, infine, è possibile creare un semplice applicatore tema per rendere la vita più facile - in questo modo:

@interface UILabel (MONThemeAdditions) 

- (void)mon_applyMONLabelTheme:(id<MONLabelTheme>)theme; 

@end 

@implementation UILabel (MONThemeAdditions) 

- (void)mon_applyMONLabelTheme:(id<MONLabelTheme>)theme 
{ 
    assert(theme); 
    if (nil == theme) return; 
    self.font = [theme labelFont]; 
    self.textColor = [theme labelTextColor]; 
    self.textAlignment = [theme labelTextAlignment]; 
} 

@end 
+0

Mi piace questa risposta, anche se è piuttosto vecchia. Quanto è applicabile ora l'API di UIAppearance? – bandejapaisa

+0

@bandejapaisa ho aggiornato la mia risposta. ci sono 105 occorrenze di 'UI_APPEARANCE_SELECTOR' in iOS7: c'è un controllo sufficiente per la maggior parte delle esigenze delle app. se hai bisogno di più granularità o controllo della memoria, degli attributi, degli stili o delle funzionalità dell'applicativo (in realtà, stavo proprio iniziando con le possibilità lì), allora l'approccio sopra può offrirti tutto il controllo disponibile. Mi piace anche perché non è né necessariamente globale né invadente. Vedo gli approcci come simili, ma "UIAppearance" tende verso la convenienza, mentre il mio si appoggia al controllo. inoltre, tendo a scrivere le interfacce utente ... – justin

+0

@bandejapaisa ... a livello di programmazione, quindi questo tende a essere un problema ricorrente con l'alta località (è facile applicare e spingere i temi intorno quando tutti i dettagli esistono nello stesso posto). diventa più difficile quando i dettagli esistono in più punti: quando si incorporano storyboard, XIB e alcuni codici. iow, sarà meno conveniente introdurre e applicare questi temi programmatici quando cose come l'inizializzazione vengono spostate dalla sorgente al caricamento di SB/XIB. in tal caso, è possibile eseguire l'override solo per applicare i temi. – justin

1

io uso plists. Proprio come localizzo le stringhe, uso la stessa procedura per cambiare i temi. Ho codificato un singleton che carica un tema plist corrente e un plist fallback. Quindi sostituisco i nomi delle risorse con le chiavi e le macro funzioni che estraggono il nome reale della risorsa dal singleton.

Contro: è necessario impostare la risorsa per ciascun elemento, non solo impostarlo in NIB.
Pro: una volta che hai finito, la maggior parte del prossimo tema coinvolge photoshop e textmate, non IB o codice.

3

È possibile utilizzare un'astrazione di terze parti di UIAppearance:

Utilizzando uno storyboard ha un sacco di vantaggi, ma molte opzioni di stile non sono disponibili, non ultimo dei quali sono i caratteri personalizzati. Se vuoi un'interfaccia utente profondamente personalizzata, avrai bisogno di un codice di stile per farlo accadere.

Problemi correlati