– Buongiorno a tutti.
Se sei qui per qualche interfaccia utente adattiva
nel mondo di iOS, sei nel posto giusto.
Se non lo sei, allora non lo sei.
Comunque, iniziamo.
Mi chiamo Sam.
Questa è una grande immagine della mia faccia.
Mi piace iniziare con una grande immagine della mia faccia
normalmente è un po ‘più grande di quello,
ma questa è la mia faccia qui.
Se non riesci a vederlo, puoi anche vederlo lì, lì,
e immagino anche lassù.
Sono @iwantmyrealname sui Twitters.
Lavoro per un’azienda chiamata Razeware,
questo è responsabile per la piccola azienda alle spalle
il grande sforzo di squadra che va avanti
raywenderlich.com.
Immagino che qualcuno di voi abbia sentito parlare di raywenderlich.com?
Sì? Qualche cenno, è grandioso.
Quindi sì, lavoro per loro.
Ho degli adesivi e il 10% di sconto
per i libri e le cose, e, oh, questo non funzionerà,
Ho un libro gratis da regalare alla persona
chi pone la migliore domanda, ma dopo le domande
sono anonimi, non so come funzionerà.
Forse lo farò, beh, non lo so.
Qualcuno viene a parlarmi bene
e potrei darti un libro gratis.
Forse funzionerà.
Comunque, parliamo di alcune interfacce utente adattive.
Quindi, all’inizio, molti, molti anni fa,
quando abbiamo iniziato a sviluppare iOS,
anche quando non era chiamato iOS,
si chiamava iPhone OS, indietro nel buio,
c’era una taglia che dovevamo costruire per.
Taglia unica. Il bello, il vecchio iPhone da tre pollici e mezzo.
Quelli erano i giorni.
Ho avuto un telefono come questo per molti anni,
Mi sono liberato del mio iPhone 4 non molto tempo fa.
Avevamo una taglia per cui costruire.
Progettare i layout è stato facile.
Dico che c’era una taglia, l’hai fatto
anche avere a che fare con il paesaggio,
ma questo è due, giusto?
Potresti fare qualcosa per ritratto
e quindi ruotarlo per il paesaggio,
o se sei su un iPhone, il più delle volte,
diresti solo che non ti è permesso di farlo in modo paesaggistico.
Deve essere ritratto.
Quelli erano i giorni.
E poi è arrivato l’iPad.
L’iPad, questo enorme tipo di lavagna
che potevi, ai vecchi tempi di iPad uno,
era rivoluzionario,
ma erano sufficientemente diversi.
Queste due dimensioni erano completamente diverse.
Quindi potresti semplicemente creare due app completamente separate,
o potenzialmente potresti creare la stessa app
e fai diversi layout e cose,
ma erano due cose separate.
Due app separate.
Poi è arrivato l’iPhone da quattro pollici,
con l’iPhone 5 e il 5s.
E questa era della stessa larghezza dei tre e mezzo,
ha appena aggiunto qualcosa in più in basso.
Dimensioni perfette per attaccare un annuncio lì.
E quello era abbastanza spesso quello che è successo.
Basta attaccare qualcosa lungo il fondo.
Non ha molta importanza, a nessuno importa davvero.
Molto spesso, se tu fossi di nuovo dentro, come ho detto,
Ho avuto un iPhone da tre pollici e mezzo per un tempo molto lungo,
allora il design era per i quattro pollici,
e vorrei finire per perdere qualcosa
dal basso, e non avrebbe funzionato.
O come a volte lo vedi ora,
se stai legando o qualcosa e il bar
in cima diventa più grande, quindi le cose vengono semplicemente tagliate
in fondo e a nessuno importa davvero
perché nessuno, non ha bisogno di preoccuparsi di quella cosa,
queste persone con vecchi telefoni, non ci importava di loro.
Poi l’anno scorso, lungo l’iPhone 6, è stato copiato
dal fattore di forma di Android,
e poi era a quattro punti sette pollici, e poi
il cinque punto cinque, il massiccio iPhone 6 Plus,
e 6s Plus ora, copiati dal mondo di
piatti da tavola, questa grande cosa enorme che
non potresti mai tenere in una mano,
è stata un’azione a due mani che ti stavi muovendo.
Tante e tante cose, tante taglie diverse.
E poi quest’anno, in arrivo presto,
è così grande che non si adatta alla diapositiva.
L’iPad Pro è enorme,
è ancora un altro fattore di forma con cui dobbiamo confrontarci,
e infatti, non solo l’iPad Pro è enorme,
se si copia l’immagine dal sito Web di Apple,
vedi il braccio che devi usare
l’iPad Pro, è anche enorme.
È enormemente enorme!
Il mio braccio non è così lungo.
Ad ogni modo, sono 12 diversi fattori di forma
che devi progettare per ora.
Se conti il fatto che devi
fai il ritratto e il paesaggio e devi farlo
per l’iPhone 4, l’iPhone 5, l’iPhone 6,
l’iPad e l’iPad Pro,
e il 6 Plus, come se fossero sei cose diverse,
due fattori di forma, cioè 12.
In passato, avremmo scritto un codice come questo,
dove dovresti solo investigare
nel tuo codice, stiamo usando un iPad,
se lo siamo, allora vai a fare questo particolare layout
e scriveremmo qualche codice di layout.
O forse, non siamo su un iPad,
ma siamo nel paesaggio, o siamo dentro, mi dispiace,
lasciato il paesaggio, il paesaggio giusto, siamo nel paesaggio,
allora dobbiamo fare questo particolare bit di codice.
Ora questo non si ridimensiona, giusto?
Non puoi continuare a farlo
per 12 diversi fattori di forma,
semplicemente non funziona
Sarebbe pazzesco provare e farlo.
E questo è il motivo per cui …
Credo che questa volta l’anno scorso, un po ‘più tempo fa,
Apple ha inventato il layout adattivo,
Dico inventato, è abbastanza simile a quello che era
essere, esisteva nel tipo di progettazione web reattiva
per un po ‘o Android ha avuto
roba del genere anche per molto tempo.
Ma è arrivato Adaptive Layout e questo è nuovo
approccio a fare alcuni layout,
o è uno strato sopra
il modo in cui eseguiamo i layout.
Alcuni dei fatti chiave su questo,
astrae il layout dalle specifiche del design.
Non ci interessa più che sia un iPad, non più
cura che sia un iPhone 6s Plus, con orientamento orizzontale.
Invece, raggruppiamo tutte queste cose diverse insieme
in questo tipo di cose delle classi di dimensioni ondulate a mano,
quindi piuttosto che dire che questo è molti pixel,
punti di vista, diciamo bene in realtà,
non è molto spazio in orizzontale.
Ci occupiamo invece di queste classi.
Puoi iniziare a usarlo da iOS 8,
e ovviamente anche iOS 9 lo supporta,
ed è completamente supportato in Xcode e Interface Builder,
e dico pienamente supportato …
pienamente supportato come qualsiasi cosa
in Xcode e Interface Builder,
Adaptive Layout è, ed è carina, carina
ragionevole da usare in queste due cose.
Dio solo sa, voglio dire, quante persone sono state
usando Auto Layout per un po ‘?
Sei tu, i fan del layout automatico?
A qualcuno piace il layout automatico?
Veramente? Va bene.
Auto Layout è molto meglio di prima.
Era atroce, era il più difficile
cosa al mondo da usare, nessuno ha avuto idea
cosa è andato storto, quando è andato storto,
che è successo tutto il tempo.
È molto meglio ora di quanto lo fosse.
Se fosse stato introdotto ora,
come questa nuova straordinaria tecnologia,
come è adesso, sarebbe molto di più
accessibile e utilizzabile.
Mi piace, ma non costruisco le cose, quindi non importa.
Cosa significa veramente, questa cosa di classe di dimensioni?
Piuttosto che dire che hai questa quantità di spazio,
questo molti pixel, questo molti punti,
stiamo parlando in termini di quanto spazio c’è davvero?
Quanto spazio abbiamo per adattarci alle cose?
E dividiamo le classi di grandezza
in due classi di dimensioni diverse.
Parliamo di qualcosa che è compatto,
non c’è molto spazio, siamo limitati
in qualche modo, o regolare, c’è un normale
quantità di spazio, qualunque cosa significhi.
E lo facciamo in due diverse dimensioni.
Puoi dire che orizzontale o verticale,
così puoi essere in orizzontale compatto,
e verticalmente regolari.
È solo un modo di specificare,
c’è questa quantità di spazio in questa vista particolare.
Come funziona, ciao.
Come si fa a mappare i dispositivi reali?
Perché questo non significa niente al momento
finché non vedi come è gentile
lavora nel mondo reale.
Quando prendi un iPad,
e un iPad Pro, in entrambe le dimensioni,
è sempre regolare
C’è sempre un sacco di spazio in verticale
e un sacco di spazio in orizzontale,
non c’è mai tempo su un iPad dove
non puoi adattare la quantità di contenuti in
che vuoi, in una sorta di moda ondulata a mano.
Ma quando guardi un iPhone, allora
quando è in verticale, allora dici che lo è
larghezza compatta, non c’è molto spazio,
larghezza su un iPhone.
Quando lo giri, paesaggio
quindi ora non c’è molto spazio in verticale.
Questo è ora compatto.
La cosa strana da fare con l’iPhone,
è che ti aspetteresti queste scatole viola e arancione
qui solo per scambiare, giusto?
Perché non si scambiano?
Bene, penso, penso che se pensi di tenere
un iPhone in verticale, quindi tradizionalmente
se stai leggendo molti contenuti o qualcosa del genere,
tu faresti scorrere su e giù, e questo lo fa
senso perfetto, giusto?
C’è molto spazio perché scorri.
Ma se lo ruoto, non scorri a sinistra ea destra,
nessuno legge mai qualcosa e poi scorre
fino a un lato, e poi
scorre tutto indietro per leggere l’inizio di
alla riga successiva, non è solo il modo in cui lo fai.
Quindi puoi dire che è compatto.
Il tempo in cui non è compatto,
è con l’iPhone 6 o il paesaggio 6 Plus,
che è così grande da poter contenere un sacco di cose lì dentro.
Ora in questo momento l’anno scorso,
questo genere di cose ha senso,
ma è un po ‘strano, è un po’,
qual è il punto di tutto ciò?
Ma ora, con iOS 9, questo inizia a fare un po ‘
più senso perché il problema con le classi di dimensioni,
quando sono collegati ai dispositivi, è,
bene, non hai davvero fatto molta astrazione,
perché se ho questo dispositivo ed è in questo
orientamento, mi dà sempre le stesse classi dimensionali,
quindi qual è il punto?
Non ha alcun senso, perché io, piuttosto che trovare
fuori da quale classe di grandezza sono, posso solo scoprirlo
quale dispositivo è, perché c’è una mappatura uno-a-uno,
quelle cose non cambiano mai.
Ma con l’avvento del multi-tasking,
finalmente comincia a dare un po ‘più senso.
Ad esempio, un iPad è sempre regolarmente regolare,
indipendentemente da quale dimensione, quale
orientamento è tenuto dentro
Tuttavia, quando inizi a fare il multi-tasking,
che è nuovo in iOS 9, giusto, quindi l’idea con
multitasking iOS 9, puoi prendere il tuo iPad
e puoi scorrere verso destra da destra
e puoi avere un’altra app in arrivo su
lato destro, e se hai un caro
o nuovo iPad, quindi puoi spostarlo ulteriormente
e hanno due app affiancate.
A questo punto, ora stai lavorando su un iPad,
hai un orientamento particolare,
ma non sai quali saranno le dimensioni della tua app,
perché la tua app può essere avviata
e poi lo scoprirai se sei in verticale
e fai scorrere qualcosa dal lato,
ora efficacemente, hai due app per iPhone
correndo uno accanto all’altro.
Quindi, la stessa app in esecuzione, ma nella configurazione
userebbe se fosse su un iPhone.
Ha una classe di dimensioni orizzontale compatta
e classe di dimensione verticale regolare.
E poi se lo fai ruotare, ora hai questo
altra configurazione con regolare regolare
e regolare regolare, e quindi finalmente
hai un compatto compatto regolare.
E poi credo in iPad Pro,
allora puoi avere due regolari regolari
app affiancate.
Quindi, a questo punto, ora lo abbiamo astratto
da solo specifiche del dispositivo.
Ora possiamo avere cose diverse in esecuzione su un dispositivo.
Quindi, il mio tipo di cinque punti su come,
come andresti sull’adozione di Adaptive Layout,
qual è un processo ragionevole per fare questo?
Perché, voglio dire, l’obiettivo finale è quello
Creo uno storyboard e regola tutto.
Non abbiamo bisogno di più storyboard.
Puoi usare uno storyboard e questo funzionerà
su un iPad, funzionerà su un iPhone, lo farà
eseguire su tutti i diversi dispositivi iOS.
E sarebbe fantastico, vero?
Non abbiamo questo problema dove abbiamo
quattro diversi storyboard, e abbiamo
per assicurarci di aggiornare ognuno di loro.
Gli aggiornamenti a uno di loro significheranno questo
tutto si aggiorna in modo appropriato.
Quindi come si fa a riguardo?
Beh, questi sono il mio tipo di, mio,
l’approccio che consiglierei,
e prima dovresti costruire il tuo layout di base,
questo è il prendiamo tutto ciò che vogliamo
sullo schermo, questo è il layout
che vogliamo accadere la maggior parte del tempo.
E poi sostituiresti una di quelle classi di dimensioni,
e ti mostrerò cosa significano le classi di dimensioni prevalenti
quando entriamo in un po ‘di una demo.
E poi disinstalli i vincoli irrilevanti,
quindi stiamo parlando di layout automatico qui,
quindi hai questi limiti,
che determina la dimensione e la posizione delle diverse visualizzazioni,
e puoi fare questa cosa chiamata disinstallandoli, giusto?
Quindi abbiamo scelto una classe di dimensioni particolare,
e voglio prendere questi vincoli e buttarli via.
In questa classe di dimensioni, non sono interessato a questi vincoli.
Tutto il resto, li vogliamo, non questo.
Quindi li disinstalliamo, quindi ne aggiungeremo alcuni nuovi
vincoli per essere sicuro di ottenere il layout
che in realtà vogliamo in questa nuova classe di dimensioni.
E poi continui a ripeterlo,
e la cosa importante con questo è,
che quello che non fai è andare nel tuo storyboard
e crea un layout per iPhone,
e poi, quindi uso come,
Vorrei entrare e dire bene, quindi se un compatto
larghezza e altezza normale, versione per iPhone,
Ritratto di iPhone, voglio questo layout,
costruiscilo e poi dillo bene, voglio costruire
un iPad ora, quindi ho intenzione di andare a fare il
regolare regolare, buttare via tutto e ricominciare.
Questo non ti aiuta affatto.
L’approccio è iniziare con questo layout di base
e poi lavorarci sopra.
Ok, diamo un’occhiata, potrei parlarne tutto il giorno,
ma è molto più utile, penso, da vedere
succede in Xcode e Interface Builder.
Quindi ho costruito questo progetto, è un progetto molto semplice.
E se ti mostro su un iPhone al momento,
quindi sembra solo, è solo
un’app per iPhone, è un’app di dettaglio principale standard.
E mentre tocchi ciascuna di queste righe,
poi ottieni questa pagina di dettaglio,
ha una foto in alto e poi questi
tipo di dettagli in basso.
E il problema con questo è che quando lo ruoto,
allora non c’è più spazio per quelli,
l’etichetta di testo con i dettagli,
poi cadono dal fondo.
Quindi quello che voglio fare è vedere come posso usarlo
Layout adattivo per modificare questo layout
quando non c’è abbastanza spazio per quella verticale,
per quella etichetta dettagli in basso.
Ora, le parole che sto usando, come sono
esprimendo questo sta dicendo bene, per quando non c’è
abbastanza spazio in questo tipo di dimensione,
questo è esattamente il problema del tipo di classe di dimensioni, giusto?
Stiamo dicendo che in verticale, è compatto.
Verticalmente, non c’è abbastanza spazio per adattarsi.
Così ho, questo layout al momento,
è costruito con il layout di base, questo è solo il
layout, li ho tutti disposti,
uno sopra l’altro.
E ora voglio entrare e guardare e vedere bene,
in realtà, quando non c’è abbastanza spazio in verticale,
Voglio fare un layout diverso.
Voglio sovrascrivere il layout,
quando non c’è abbastanza spazio in verticale,
è una classe di dimensioni verticali compatta.
Quante persone hanno usato classi di dimensioni prima?
Questo è buono, perché altrimenti saresti seduto lì
pensando che fosse inutile, è grandioso.
Ok, ora puoi vedere, non molto bene, è molto piccolo.
Potrei farcela, lo so, farò solo dello zoom.
Va bene. Quindi se diamo un’occhiata.
Quindi questo è lo storyboard.
Se rimpicciolisci lo storyboard, puoi vedere,
come ho detto, è solo una cosa di dettaglio principale standard,
e ci concentreremo solo qui
su questo controller vista qui, e tutto il
demo che sto facendo oggi
è disponibile su GitHub, ti darò un link alla fine.
E tutto quello che sto facendo è negli storyboard,
Non ho fatto nulla nel codice, il che significa che
puoi guardare le differenze in GitHub
e non significheranno nulla, perché loro
erano solo differenze di storyboard.
Ok, quindi questo è il layout, come ho detto all’inizio,
abbiamo questo tipo di, abbiamo l’immagine
dei pancake, il titolo, questo genere di cose,
sono tutti collegati come ci aspettavamo.
Ora quello che puoi fare per le classi di dimensioni è
se riesco a ricordare come zoomare, giusto.
Giù in fondo qui, puoi vedere questo WNEH qualsiasi,
giù proprio qui in basso.
E quello che c’è, è qualcosa di nuovo
in Xcode 6 e ovviamente continua in Xcode 7.
Quella è la classe di dimensioni che ha la precedenza su thingy-ma-jig.
Questo è il termine tecnico.
E se tocco questo, vedi questa strana cosa da nove quadrati.
E se mi muovo, puoi vedere che mi sta dando
queste diverse combinazioni di classe di dimensioni.
E inizia con questa qualsiasi base
valori per tutti i layout.
Tutto ciò che metto quando sono in quella classe di dimensioni ha la precedenza,
apparirà in ogni singolo strato che faccio.
E, mentre stavo parlando, voglio occuparmi di un caso
dove non c’è abbastanza spazio in verticale,
quindi quello che sto per fare è, questo è il mio layout di base,
Ora vado a scavalcare
per uno strato di altezza compatto, ecco qui un’altezza compatta.
Non è un’altezza compatta specifica, larghezza compatta
o larghezza regolare, altezza compatta,
Mi occupo solo di altezza compatta,
perché non mi interessa la larghezza, mi interessa l’altezza.
Quando non c’è abbastanza spazio in verticale,
Ho intenzione di entrare e cambiare qualcosa.
Quindi, per farlo, lo tocco lì dentro,
e se faccio lo zoom indietro, puoi vedere
ora ho questa barra blu.
E quello che ho intenzione di fare,
ricorda la seconda fase del mio piano?
Quindi ora sono nel palco dove sto andando
disinstallare i diversi vincoli che non mi interessano.
Ora voglio l’immagine sul lato sinistro,
e tutte le informazioni dettagliate sul lato destro.
Quindi tutto quello che ho intenzione di fare, un po ‘di layout automatico,
Ho intenzione di entrare e rimuovere i pezzi
che non mi interessa.
Quindi se ho l’immagine, apro l’ispettore taglia,
puoi vedere tutti i diversi
vincoli e cose che abbiamo
in basso a sinistra.
Quindi sono sulla foto al momento.
Ho lo spazio finale per le super viste,
questo è per quelli di noi con le lingue da destra a sinistra
sul lato destro,
abbiamo lo spazio principale in modo che sia il lato sinistro,
contenitore di contenuto distanziato in basso, quindi il contenitore del contenuto
è una vista vuota, beh non una vista vuota,
una vista bianca che contiene tutte le cose
in fondo che mi muoverò
sul lato destro.
Abbiamo uno spazio migliore per la guida ai layout,
quindi è bloccarlo in cima,
e contenitore di contenuto di uguale altezza.
Quindi voglio rimuovere alcuni di quelli.
Ora cosa puoi fare con le classi di dimensioni
è dire, non mi interessa di questo particolare
vincolo per questo layout.
Quindi sto per dire, voglio che questo sia finito,
Voglio che l’immagine sia finita sul lato sinistro.
Quindi cosa non voglio più fare
è appuntare lo spazio finale sul lato destro,
perché allora non sarebbe possibile
Quindi quello che faccio è selezionarlo nell’ispettore taglia
e premere backspace, o mi dispiace, premere Elimina.
E puoi vedere ora, è disattivato.
C’è qualcosa qui, questa classe di taglia su tutto,
devi assicurarti di essere su tutti, perché
altrimenti ti mostrerà solo quelli
per questa particolare classe di dimensioni.
Ora che è disattivato, significa che non lo sarà più
applicare in questo override di altezza compatto.
Cos’altro non voglio,
Inoltre, non voglio lo spazio di fondo per il contenitore dei contenuti
e anche io non voglio altezza uguale al contenitore dei contenuti.
Quindi ora ho solo questo ruolo in cima.
Ora posso fare esattamente lo stesso con il contenitore dei contenuti,
quindi ora ho selezionato il contenitore dei contenuti,
questa è una scatola bianca in basso,
e puoi già vederlo,
due di questi sono in grigio.
Questo perché i vincoli sono tra due diversi
visualizzazioni e se ho disinstallato il vincolo su una vista,
quindi ovviamente viene disinstallato dall’altra vista.
Non puoi averne uno, come un mezzo ostacolo installato.
Quindi abbiamo già perso lo spazio migliore per la visualizzazione delle immagini
e altezza uguale alla vista dell’immagine,
ora questo in basso, l’unico altro che noi
voler disinstallare è lo spazio principale.
Non lo facciamo, non lo vogliamo più appuntato sul lato sinistro.
Quindi posso selezionare quello lì dentro e
premi cancella e quello va.
Quindi ora abbiamo ancora due vincoli
ognuno di quelli che vogliamo ancora utilizzare.
Quello che non vogliamo, sono questi altri.
E ora se faccio lo zoom indietro, oh no, non così.
Rimpicciolisci in questo modo e ingrandisci qui.
Troppi zoom.
Quindi quello che posso fare ora è approssimativamente trovarli
dove li voglio, trovo molto più facile lavorare così,
quindi prenderò questo,
il contenitore dei contenuti vuole andare da qualche parte in quel modo,
e la vista dell’immagine vuole andare da qualche parte in questo modo.
Ignora semplicemente il fatto che sembra un po ‘spazzatura al momento.
Quindi, ora, la prossima fase di quel piano in cinque fasi,
era quello di aggiungere i nuovi vincoli.
E quando sei nella modalità barra blu,
significa che qualsiasi vincolo che aggiungi,
esisterà solo in questo override particolare della classe di dimensioni.
Non è più necessario preoccuparsi del layout di base,
Li aggiungerò e loro solo lo faranno
esistono per questo override di classe di dimensioni.
Quindi quello che voglio fare è prendere questa immagine
e voglio assicurarmi che,
quindi, torna indietro di nuovo.
Usando questi piccoli pulsanti in basso,
se hai familiarità con Auto Layout,
probabilmente li usi sempre.
Usa quello che assomiglia un po ‘a un lottatore,
che è il menu pin.
Se tocchi questo,
allora puoi vedere che aggiungo un vincolo,
quindi dovrei, ho selezionato l’immagine al momento.
Voglio, ora ho bisogno di aggiungere un nuovo vincolo
per appuntare l’immagine in basso.
Quindi sto andando a colpire quella barra degli occhi lì.
Quindi selezionerò il contenitore dei contenuti,
questo ha bisogno di uno nuovo per fissarlo in cima.
Ho quindi bisogno di altri due vincoli,
Ho bisogno di, ho intenzione di afferrare l’immagine
oltre al contenitore del contenuto,
Voglio impostare la spaziatura orizzontale
e voglio impostarli come larghezze uguali.
Qualcosa che è cambiato in Xcode 7, è quello
ora c’è questo nuovo vincolo di aggiunta,
mi dispiace di averlo fatto, tu controlli la resistenza
da una all’altra destra, e poi se si preme
shift, quindi puoi selezionare più vincoli
che vuoi aggiungere allo stesso tempo.
Qualcosa di nuovo in Xcode 7 è
ora c’è questo menu di vincoli aggiuntivi.
Prima, hai fatto questa cosa strana dove hai cliccato
via al menu e probabilmente ha aggiunto i vincoli,
ora c’è un pulsante reale da dire
fallo per me, lo voglio davvero.
Quindi ho aggiunto quei vincoli e penso,
bene, vedremo tra un momento, che ho ora
aggiunto i vincoli che volevo,
quindi ora se uso, non so che tipo di
nave spaziale sembra,
nessuna idea.
Se ora utilizzo questo menu,
e dì aggiorna tutti i frame,
e poi zoom indietro,
rimpicciolire e zoomare su questo.
Eccoci.
Questo è più o meno quello che stavo cercando.
So che l’immagine non va bene,
ma questo è, non dispiace, il testo non va bene,
non sono preoccupato per questo, ora sono riuscito
per fare questo layout diverso,
quindi voglio solo verificare se funziona.
Quanti di voi hanno,
quante persone usano gli storyboard?
Ho visto qualche uso di storyboard, giusto?
Quante persone sono a conoscenza del nuovo,
nuovo in Xcode 6 Preview Assistant Editor?
Oh, va bene, quindi alcune persone lo sono, e va bene.
Quindi l’editor di sistema, tradizionalmente quando sei dentro
storyboard, porta in classe chi sei
lavorando con, giusto?
In Xcode 6 e ovviamente continua in Xcode 7,
se tu, nella barra di salto in alto,
qui, e dove dice automatico,
puoi selezionare l’anteprima,
e quello che fa è darti una scatola grigia.
Oh, lo so, non sono selezionato, eccoci.
Quello che fa è, piuttosto che dover correre
ogni diverso simulatore e ruotalo per vedere cosa
il tuo controller di visualizzazione particolare sarà simile,
puoi invece usarlo per,
facciamo un po ‘più grande,
Posso aggiungere, usando questo piccolo vantaggio in basso,
Posso aggiungere molte dimensioni diverse,
anteprime di dimensioni diverse in base ai diversi dispositivi,
e puoi ruotarli e vedere come si comporta.
E questa è la cosa importante, giusto, è quello
questi due uno accanto all’altro, iPhone in verticale,
foto in cima ai dettagli, iPhone in orizzontale,
l’immagine è ora a sinistra dei dettagli.
Questo è esattamente ciò che volevamo fare.
Non abbiamo toccato alcun codice, abbiamo fatto tutto
Interface Builder e lo abbiamo fatto disinstallando
e l’installazione di alcuni vincoli, che è piuttosto interessante
Penso, non è, non molto difficile.
E se ti piace Interface Builder,
bene se non ti piace Interface Builder,
Apple continuerà a spingerlo giù per la gola.
Non è così male.
Quindi, alcune cose su quei vincoli che abbiamo creato.
Se apro, alcune di queste cose vincolanti
sopra nel contorno del documento,
lo noterai in fondo qui,
abbiamo alcuni vincoli sfumati.
Significa che i vincoli sono in grigio
questi vincoli esistono, ma non sono installati,
non sono in funzione, non sono attivi
nell’override della classe di dimensioni corrente.
E infatti, se io,
Vieni qui,
se torno al layout di base, noterai
un paio di cose, prima di tutto,
ora questo è tornato alla sua dimensione originale,
e qui sotto, probabilmente non puoi vederlo,
se lo faccio di nuovo, così puoi vederlo
in compatto, poi quelli che sono stati installati cambiano, ok?
Cambiano secondo
quale classe di dimensioni ha la precedenza su di te.
E anche se usi l’ispettore degli attributi
qui, noterai che c’è questo nuovo
cosa in fondo
che ha, non è controllato.
Installato non è controllato per niente,
che è il layout di base, ma esiste un override della classe di dimensione
per larghezza qualsiasi altezza C, compatto,
dove è controllato.
Ciò significa che è solo installato
per una particolare classe di dimensioni.
È fantastico.
E questa piccola cosa in più apparirà più spesso.
Cioè, ciò significa fondamentalmente che esiste un modo
puoi sovrascriverlo per una determinata classe di dimensioni.
Va bene, d’accordo.
Torniamo indietro ad alcune diapositive.
Beh, ho la sensazione che sia una diapositiva.
Ok, quindi è lì, ti ho mostrato come puoi
andare su una sorta di adattività.
Vincoli, puoi prendere un vincolo
e tu puoi decidere, lo voglio
in questa particolare classe di dimensioni o no?
È abbastanza bello, puoi riallineare, riorganizzare
il tuo layout in molti modi diversi.
Ma non è tutto ciò che puoi fare con Adaptive Layout.
Ci sono altre cose che sono anche adattive.
L’installazione di vincoli è la prima
di cui ti ho parlato,
ma puoi anche modificare la costante su un vincolo.
Quindi se hai un vincolo che dice,
la spaziatura tra queste due viste
dovrebbe essere dieci punti, quindi posso dire
bene se ho abbastanza spazio,
allora in realtà dovrebbe essere un centinaio di punti,
e posso farlo senza dover
elimina quel vincolo e creane uno nuovo.
Stranamente, non puoi modificare il moltiplicatore del vincolo.
Quindi sai che i vincoli hanno una costante
e hanno un moltiplicatore,
se hai bisogno di cambiare il moltiplicatore,
allora in realtà devi disinstallare
il vincolo e crearne uno nuovo.
Non so davvero perché.
Puoi cambiare il carattere, quindi se ho un font particolare,
e voglio cambiare la dimensione del carattere,
è qualcosa che ti aspetteresti
potresti voler fare bene?
Tra un iPhone e un iPad voglio cambiare
questa dimensione del carattere per renderla più grande su un iPad.
Beh, puoi farlo abbastanza semplicemente.
E vedremo, faremo una breve demo di alcuni di questi.
E infine, guarda l’installazione,
e questo è anche abbastanza importante.
Se hai un layout
per un iPhone, e vuoi usarlo,
riutilizzare la stessa cosa su un iPad,
allora probabilmente non lo vorresti
cambia la dimensione del carattere e la spaziatura,
e riallineare cose diverse.
Qualcosa che probabilmente vorresti fare
è in realtà aggiungere nuove viste, giusto, avrebbe senso giusto?
Bene, puoi farlo anche tu.
Quindi penso, visto il tempo, a che ora finiamo?
15 minuti.
Ti mostrerò alcuni di questi perché voglio mostrarti
qualcosa di molto bello
Quello che voglio fare è la demo cambiando le dimensioni e cambiando
il font, e se guardi nel repository Git,
allora puoi vedere le installazioni della vista,
così come è possibile installare le viste e disinstallarle.
Ma, il carattere è davvero facile, e infatti,
in molte volte su tutto il layout adattivo e Xcode,
ogni volta che vedi questo piccolo vantaggio,
questo piccolo, piccolo piccolo vantaggio accanto a una delle proprietà,
ciò significa che posso fornire un override di classe di dimensioni per quello.
E infatti, se tocco questo,
puoi aggiungere la personalizzazione della dimensione della classe
e quindi puoi usare questo sistema di menu non intuitivo
per scegliere quale classe di dimensioni ignorare.
Il modo più semplice per farlo è farlo
salta di nuovo nella classe di dimensioni sostituita che desideri.
Quindi ho intenzione di scegliere ora regolare regolare,
è di dimensioni iPad, e poi se ho colpito il plus,
allora puoi vedere quello che suggerisce
è l’override della classe di dimensione corrente.
Ora qualcosa che è davvero abbastanza confuso,
Trovo, quando sei nella modalità barra blu,
override della classe di dimensione, se aggiungo una vista,
Esisterà solo in quella vista.
Se aggiungo un vincolo, esisterà solo in questo,
scusa, se aggiungi una visualizzazione, esiste solo in questo
override della classe di dimensione, se aggiungo un vincolo,
Esisterà solo in quell’override della classe di dimensioni.
Se rimuovo una vista o rimuovo un vincolo,
si verificheranno solo all’interno di quell’override della classe di dimensioni.
Se cambio il carattere, questo cambia il layout di base.
Se cambio una costante, questo cambia il layout di base.
Quindi devi sempre ricordarlo
cosa esattamente cosa sto facendo,
e se voglio cambiare il carattere,
quindi ho bisogno di fare clic sul piccolo vantaggio.
Così spesso, passerò attraverso e cambierò il carattere
e poi tornerò a quello originale e
mi rendo conto di averlo cambiato anche lì,
e poi devi tornare indietro e provare e
ricorda cosa fosse o cosa fosse
attraverso la cronologia degli annullamenti per trovarlo.
Quindi usa il piccolo vantaggio, e poi mi dà
larghezza regolare, altezza regolare, e poi ho appena avuto
una scatola di font standard, giusto, quindi posso entrare e
Ho intenzione di scegliere un font diverso e tutti
su un iPad ama una festa, quindi usiamo il font del party.
Facciamolo dimensione 60.
E questo dovrebbe significare
oh, cambiamo anche qualche spaziatura mentre siamo qui.
Così ho, mentre sono su questo ho deciso che in realtà
Posso, posso aumentare lo spazio tra la festa,
tra il carattere del partito … (ridacchia)
Tra il font del titolo e la barra gialla.
Quindi se ho selezionato quell’etichetta lì e
Guardo i vincoli a cui sono associato,
uno di questi è lo spazio in basso per la barra gialla,
e se tocco questo, allora qui puoi notare che lo ero
parlando della costante e anche questo è un po ‘
più accanto ad esso, quindi posso aggiungere una dimensione,
aggiungi un override per quello e trasformalo in
100 e vedremo cosa fa.
Quindi se apro l’anteprima,
e aggiungine uno per l’iPad,
scorrere fino in fondo,
zumare un po ‘,
Xcode non è molto buono in spazi ristretti.
Ho dovuto dare questa demo in 800 per 600 una volta.
Dovresti, come sfida, un giorno,
prova e usa Xcode a 800 per 600.
Eccoci, quindi voglio dire che è fatto quello che volevamo.
Proprio qui, questo override di classe dimensionale è regolare.
Ha cambiato il carattere in quello piuttosto sfarzoso
font di festa, e ora c’è un enorme divario tra
l’altra barra e quella sopra.
Quindi, in passato, avresti dovuto passare attraverso
e fai tutto quel codice if-then-else
e tu dovresti, voglio dire se stavi usando dei vincoli,
allora dovresti afferrare quel vincolo
e modificare la proprietà su di esso o
rimuovere un vincolo o è possibile utilizzare diversi storyboard.
Ma per compiti semplici come questo, puoi ottenere
abbastanza lontano usando solo il
Override della classe di dimensioni del layout adattivo per questo tipo di cose.
Non ti mostrerò l’installazione di viste diverse,
perché non ho tempo, ma è di nuovo molto simile,
se sono in override della classe di dimensioni, aggiungo una vista,
Esisterà solo in quella visione e io posso
aggiungi i vincoli e le cose come appropriato.
Quindi, voglio saltare molto velocemente
come funziona nel codice,
cosa significa in realtà questa roba?
Perché l’abbiamo visto in Interface Builder, ma in realtà,
puoi avere una lunga strada in Interface Builder, ma
quasi certamente ad un certo punto, vorrete
entra e combatti con il codice.
Quindi, tutte queste cose esistono in questo
nuovo codice di classe UITraitCollection, che
è stato presentato l’anno scorso.
Ora è il posto giusto per scoprirlo
cose diverse sul dispositivo, in modo da poter ottenere il
idioma dell’interfaccia utente. Quindi, è un iPhone, è un iPad?
È possibile ottenere la scala di visualizzazione, che è,
beh, stavo per dire sta diventando sempre più irrilevante,
ma è ora con retina HD, suppongo che non lo è.
In modo che tutto ciò che vi darà
uno, due o tre, a seconda di
il numero di pixel per punto.
Puoi ottenere le due classi di dimensioni, quindi posso scoprirlo
se posso entrare in possesso di un ‘traitCollection’,
Posso scoprire qual è la mia attuale classe di dimensioni.
E poi nuovo in iOS 9 è questa capacità di tocco di forza,
quindi se hai un iPhone 6 o un Plus 6s,
puoi scoprire se hai o no quello
Cose tattili in 3-D, quindi se puoi determinare o meno
quanto è difficile spingere il dito sullo schermo.
Quindi, come posso ottenere uno di questi ‘traitCollection?
Bene, usi un ambiente tratto.
L’ambiente dei tratti è solo un protocollo
e su di esso, ha una proprietà chiamata `traitCollection`.
Quindi posso afferrare un `traitCollection`,
e ha anche questa utile funzione
`traitCollectionDidChange`, e
ne parleremo tra un secondo.
Ora cosa adotta questo protocollo? `UIScreen`,` UIWindow`,
“UIPresentationController”, “UIViewController” e “UIView”,
questo significa che se ti trovi in una di queste cose,
puoi scoprire qual è la tua attuale ‘traitCollection’.
E quindi, in che classe di grandezza sei.
Devi solo chiedere “traitCollection”,
e poi sarai, avrai ciò che devi sapere.
Cos’è questo “traitCollectionDidChange”?
Quando lo faranno, verrebbe chiamato
ogni volta che la “traitCollection” è cambiata, giusto?
Quando accadrà?
Cosa succede se ho preso un iPhone in verticale,
e l’ho ruotato, quindi il ‘traitCollection’
di ogni vista, visualizza controller, controller di presentazione,
lo schermo e la finestra riceveranno ‘traitCollectionDidChange’
perché lo hai ruotato.
Sei passato da altezza normale, larghezza compatta,
per compattare altezza, larghezza compatta o avanti
un iPhone Plus, larghezza regolare.
Quindi potresti usarlo per gestire la rotazione,
gestire qualsiasi tipo di codice che si desidera eseguire
quando il ‘traitCollection’ viene modificato.
È un po ‘masticatore, non ha grana molto fine,
e lo vedremo tra un momento.
L’altra cosa che potresti fare,
è in realtà sovrascrivere le classi di dimensioni.
Perché vorresti farlo, così com’è
sembra un po ‘strano.
Ma puoi costruire un controller di visualizzazione che ha
un particolare layout per una determinata classe di dimensioni.
E poi ti rendi conto in realtà, sono su un iPad,
ma ho creato un controller di visualizzazione contenitore,
e sto mettendo questo altro controller di visualizzazione in esso,
c’è in realtà abbastanza piccolo, giusto?
Voglio usare l’iPad o il layout
che ho definito per larghezza compatta
perché questo controller di visualizzazione è così piccolo,
quindi voglio un controller vista contenitore,
che potresti costruire da solo,
un controller di visualizzazione contenitore personalizzato,
in realtà puoi dire, per i controller di vista di mio figlio,
o questo particolare controller di visualizzazione figlio,
Voglio invece usare questo ‘traitCollection’.
Non voglio … Sono su questa enorme tela di un iPad,
ma il mio contenitore, uno dei miei controller di visualizzazione figlio
è solo questo grande
Quindi è una larghezza compatta.
Quindi potresti usare questo, ed è abbastanza semplice da usare,
semplicemente, ti costruisci un ‘traitCollection’
con gli override che desideri,
e lo si passa al controller di visualizzazione figlio
attraverso questo metodo, che si trova su `UIViewController`.
Questo mi porta all’ultimo protocollo che
Voglio introdurre, e questo è `UIContentContainer`,
e questo è un modo leggermente più fine
affrontando queste transizioni tra ‘traitCollection’s.
Così hai fatto, hai questo in `UITraitEnvironment`,
ottieni ‘traitCollectionDidChange`,
beh, è un po ‘tipo di mazza giusta,
all’improvviso ti viene solo detto
giusto il “traitCollection” è cambiato, rimettiti in gioco.
Come gestisci per assicurarti di essere
gestire le animazioni in modo piacevole,
come fai a fare qualcosa del genere?
Ecco dove si desidera utilizzare questi metodi
che si trovano su `UIContentContainer`,
e `UIContentContainer` è adottato da
`UIViewController` e` UIPresentationController`.
Questi hanno, hanno questo `willTransitionToTraitCollection`
quindi hai esattamente lo stesso momento,
bene, prima che la transizione avvenga ora,
ti viene detto che ti trasferirai in questa “traitCollection”,
e all’interno di questo, si ottiene un `transitionCoordinator`,
che per quelli di voi che hanno fatto un qualsiasi “UIViewController”
transizioni, che sono un mare enorme di incredibilmente
lunghi nomi di protocollo, che cosa ti permette di dire,
“Voglio fare questa animazione,
“e voglio farlo allo stesso tempo
“come sempre le animazioni che il sistema sta facendo.”
E questo è veramente utile, ti dirò perché
è davvero utile in un minuto,
l’altro metodo su quelli, `viewWillTransitionToSize`.
Quindi la domanda che tutti chiedono sempre è,
“Il mio iPad è regolare, indipendentemente dall’orientamento,
“Non ha alcun senso.
“Perché dovrebbe succedere?
“Non è utile per me.
C’è chiaramente meno spazio. “E il metodo è questo
davvero utile per questo è `viewWillTransitionToSize`.
Questo viene chiamato ogni volta che il controller di visualizzazione
cambia dimensione e prima di iOS 9,
sarebbe praticamente solo a rotazione,
a meno che non si stia eseguendo un contenimento complesso del controller di visualizzazione
te stesso, che sarebbe fondamentalmente solo sulla rotazione.
Il controller della vista passerebbe alla dimensione.
Quindi quando si ruota un iPad, il metodo migliore è quello
sarà chiamato, perché la dimensione cambierà,
il metodo bottom non verrà chiamato.
Perché il ‘traitCollection’ non lo fa.
E questo mi porta alla deprecazione della rotazione.
In iOS 8, questi adorabili vecchi metodi
per aver a che fare con la rotazione erano tutti deprecati.
Non puoi, beh, puoi usarli,
non dovresti usare ruoterà per …
`willAnimateRotationToInterfaceOrientation`
o `didRotateFromInterfaceOrientation`.
Tutto questo è sparito, quindi come diavolo
ti occupi della rotazione ora?
E questo è un tipo di cambiamento nel paradigma di
`WillTransitionToSize`.
Usa invece quel metodo.
Questo è un esempio del metodo utilizzato.
Quindi non pensare alla rotazione come a muovere un dispositivo,
pensala come il tuo controller di visualizzazione sta cambiando le dimensioni.
Perché dal punto di vista dell’utente,
è tutto ciò che è realmente successo, giusto?
Se ti sei seduto all’interno del tuo controller di visualizzazione,
il fatto che il dispositivo sia ruotato è irrilevante.
La cosa interessante è che hai cambiato taglia.
Quindi puoi usare questo, voglio dire questo esempio qui,
usa quel coordinatore, questo coordinatore di transizione,
e chiama questa “animateAlongsideTransition” lì.
In modo che ci sia permesso di dire
quando avviene questa rotazione, il sistema
prenderà il tuo controller di visualizzazione,
e lo ruoterà per te, e
lo ridimensionerà per te, in un’animazione.
Voglio fare un’altra animazione al suo fianco,
è esattamente l’animazione che voglio fare.
E questa è solo una Transizione CA.
Penso che, ho ottenuto, ho cinque minuti.
Voglio parlare molto, molto, molto brevemente delle viste dello stack,
perché le visualizzazioni dello stack, ho parlato molto di layout automatico.
Le visualizzazioni dello stack sono nuove in iOS 9 e lo sono,
se non hai usato Auto Layout prima,
ora è un buon momento per entrarci,
perché le viste dello stack ti faranno risparmiare un sacco di dolore.
Quali sono?
Voglio costruire una vista come questa, giusto?
Quindi ho una visione bianca e ho
ha queste tre viste al suo interno
Come potrei farlo con i vincoli?
Beh, avrei bisogno di appuntare quello in alto
e sul lato sinistro,
Avrei bisogno di appuntarlo sul lato destro,
e appuntare quello arancione verso il basso.
Dovrei aggiungere alcuni vincoli
per distanziarli pure, giusto,
quindi voglio mettere un divario tra loro.
Direi anche che voglio allinearli per tutto il centro,
Li voglio così che siano tutti
centro allineato l’uno con l’altro.
E poi finalmente voglio dire quello arancione
dovrebbe avere la stessa larghezza del
quello grigio, e poi quello viola nel mezzo
userà solo la sua dimensione di contenuto intrinseco.
Questo è un sacco di vincoli,
quindi penso che sia come 12 vincoli,
che è molto per costruire qualcosa che è così semplice.
Quindi stack view, stack view è esistito
su OS X per diversi anni, ora
sono molto meglio ora in OS X con,
ora corrispondono a ciò che è stato introdotto in iOS.
È praticamente uguale al layout lineare
da Android, che è esistito
per molti, molti, molti anni.
Cosa fai?
Bene, quella pila guarda lì,
scusa, quella disposizione attorno al bordo è una vista pila.
E una vista stack ha proprietà su di essa,
quindi aggiungo alcune visualizzazioni alla vista dello stack,
Dico su quale asse mi piacerebbe che fosse orientato,
e ho impostato alcune cose come la spaziatura,
quanto distanti dovrebbero essere queste cose?
Voglio dire che sono tutti allineati nel mezzo,
e poi devo usare alcuni vincoli,
perché devo posizionare questa vista dello stack
da qualche parte nel suo più ampio,
nella sua visione più ampia.
Quindi ora ne ho usati due e poi ho potuto
aggiungi altri due vincoli se volessi
pin esattamente a una dimensione specifica.
Questo è quindi quattro, possibilmente due vincoli
per fare quello stesso layout, io solo
Chuck le cose e lo costruisce.
Non penso di avere tempo per questa demo,
ma voglio mostrarti una cosa,
e questo è,
in Xcode, imparare e amare
questo piccolo bottone qui.
C’è come una freccia che cade giù per delle scale.
Che lì crea una vista pila,
prendi alcune viste, per quante ne vuoi,
spingere quel pulsante, renderà una vista pila.
Da lì, puoi modificare tutti i tipi di cose diverse.
E la cosa interessante delle viste dello stack,
ora ho una vista stack qui per mostrarti.
Ho usato nella cella di visualizzazione tabella, celle di visualizzazione tabella,
quelli che sono notoriamente
difficile da stendere automaticamente.
L’ho appena buttato in una pila,
e una volta che l’ho fatto, se afferro la vista pila,
puoi vedere che sono molto, giocano
molto bene con l’adattabilità.
Hanno questi vantaggi sul lato,
il che significa che posso aggiungere sostituzioni di classe di dimensioni
per cose come l’asse, così
quello che stavo per mostrarti è che posso fare cosa dove io
cambiato da essere allineato verticalmente
allineato orizzontalmente, solo aggiungendo
una classe di dimensioni sostituisce la vista pila.
Davvero semplice
Posso cambiare l’allineamento, la distribuzione,
Posso cambiare la spaziatura, tutte queste cose diverse
davvero, semplicemente usando l’adattività.
Ne vale davvero la pena, sono tranquilli
davvero piuttosto potente se usato con adattività.
Quindi, per finire, solo alcuni suggerimenti
dal mondo della adattabilità.
Uno, conoscere il layout automatico,
è, c’è un po ‘di una curva di apprendimento,
ma non è impossibile, ne vale la pena.
All’inizio non è così difficile come potrebbe sembrare.
Usa il layout adattivo per i layout a tratti generici.
Quindi, non puoi aspettarti di essere in grado di fare tutto
del tuo layout usando questi strumenti di adattamento.
Sono lì per te per ottenere il layout abbastanza giusto,
usa Adaptive Layout e poi puoi inserire il codice
e inizia a usare le cose a grana fine che vuoi fare.
Come quella vista o transizione alle dimensioni.
Inizia sempre con un layout di base e l’override.
Mai e poi mai, mai, mai entrare in uno storyboard e dire,
bene voglio un iPad, quindi vado a
iniziare con regolari regolari.
Ora voglio fare un iPhone in verticale così
Ho intenzione di andare normale compatta.
Inizia con il layout di base con niente,
e poi allenati, beh, cosa voglio cambiare
per questo particolare override.
La vita è più facile con le viste dello stack.
Se è possibile utilizzare iOS 9, andare e indagare su di loro.
Se non puoi, allora ci sono alcuni open source
cose là fuori che saranno equivalenti.
Rendono il layout molto più semplice.
Se annidi le viste dello stack insieme, puoi davvero,
renderà la vita molto più facile, fidati di me.
Ora è il momento di diventare Adaptive.
Come ho detto, ne hai 12 diversi
layout da fare al momento, potresti farlo con
diverse app, puoi farlo
con più storyboard,
date a Adaptive Layout un passaggio e vedetelo o meno
puoi andare ovunque
Sono @iwantmyrealname su Twitter e
puoi prendere il codice per questo
al mio GitHub, e per finire,
per favore ricordati di valutare la sessione,
e ti ringrazio tanto tanto per essere venuto.
Grazie.
(il pubblico applaude)
– Quindi non abbiamo, un minuto per le domande,
quindi penso che il migliore sarebbe probabilmente
come gestisci i compiti?
Perché siamo stati abituati a loro
volendo tutto pixel perfetto.
– [Sam] Sì, questo è, voglio dire che è uno dei
principali sfide associate a questa adattabilità,
ed è qualcosa che penso sia il mondo del web
ha attraversato diversi anni fa
con questo tipo di idea di reattività … Ricordo quando
Ho fatto il web design per la prima volta, ho passato molto tempo
cercando di farlo sembrare perfetto pixel
tra Firefox e Internet Explorer e
Immagino che fosse prima di Chrome, quindi Opera
o qualcosa del genere, e tu saresti lì a cercare di allenarti
bene perché non è identico a questo,
e alla fine sembrammo aver superato questa fase
in questa idea, beh, in realtà il contenuto è
la parte importante, questi sono i pezzi
che vogliamo costruire quel contenuto,
questo è il modo in cui vogliamo avvolgerlo.
Ma ciò che non necessariamente abbiamo è
Voglio un pixel design perfetto qui, qui e qui.
E certamente sembra aver funzionato
nel mondo web, come una sorta di
alla fine ci sono arrivati.
E penso che dobbiamo fare lo stesso tipo di cosa,
ha tutto a che fare con l’educazione,
Voglio dire se tu dici al tuo designer,
sì, puoi avere disegni pixel perfetti, ora vai via e
disegnami 12 diversi disegni, o più di fatto,
perché non solo hanno avuto a che fare con
i diversi dispositivi, ora con il multitasking,
devi fare i conti bene, e se sei un terzo
della larghezza dello schermo su un iPad,
in verticale, e poi in orizzontale,
e poi cosa succede se sei metà della larghezza,
e poi oh, c’è anche un iPad Pro.
Se gli dici che devono progettare 20 diversi
disegni pixel perfetti per quella app,
allora potrebbero iniziare a farsi un’idea
di ciò che fa questa adattività, e diventa
bene, quali elementi vuoi lì,
e quando diventa così stretto, come dovremmo riorganizzarlo.
Perché è esattamente ciò che accade nel web, giusto?
Perdi quella grande barra dei menu in alto,
e diventa quella strana cosa del drop-down dell’hamburger
che occupa l’intero schermo su un iPhone.
E penso che sia, voglio dire che non è necessariamente
la soluzione giusta, ma questo è l’unico
tipo di modo di farlo davvero, è di tipo di
dimostrare questo tipo di cose e uscire dal
pixel mondo perfetto in realtà
il contenuto è la cosa con cui abbiamo a che fare,
come lo facciamo sembrare buono
come possiamo in questi diversi modi.
Freddo. Grazie mille.
Se sei qui per qualche interfaccia utente adattiva
nel mondo di iOS, sei nel posto giusto.
Se non lo sei, allora non lo sei.
Comunque, iniziamo.
Mi chiamo Sam.
Questa è una grande immagine della mia faccia.
Mi piace iniziare con una grande immagine della mia faccia
normalmente è un po ‘più grande di quello,
ma questa è la mia faccia qui.
Se non riesci a vederlo, puoi anche vederlo lì, lì,
e immagino anche lassù.
Sono @iwantmyrealname sui Twitters.
Lavoro per un’azienda chiamata Razeware,
questo è responsabile per la piccola azienda alle spalle
il grande sforzo di squadra che va avanti
raywenderlich.com.
Immagino che qualcuno di voi abbia sentito parlare di raywenderlich.com?
Sì? Qualche cenno, è grandioso.
Quindi sì, lavoro per loro.
Ho degli adesivi e il 10% di sconto
per i libri e le cose, e, oh, questo non funzionerà,
Ho un libro gratis da regalare alla persona
chi pone la migliore domanda, ma dopo le domande
sono anonimi, non so come funzionerà.
Forse lo farò, beh, non lo so.
Qualcuno viene a parlarmi bene
e potrei darti un libro gratis.
Forse funzionerà.
Comunque, parliamo di alcune interfacce utente adattive.
Quindi, all’inizio, molti, molti anni fa,
quando abbiamo iniziato a sviluppare iOS,
anche quando non era chiamato iOS,
si chiamava iPhone OS, indietro nel buio,
c’era una taglia che dovevamo costruire per.
Taglia unica. Il bello, il vecchio iPhone da tre pollici e mezzo.
Quelli erano i giorni.
Ho avuto un telefono come questo per molti anni,
Mi sono liberato del mio iPhone 4 non molto tempo fa.
Avevamo una taglia per cui costruire.
Progettare i layout è stato facile.
Dico che c’era una taglia, l’hai fatto
anche avere a che fare con il paesaggio,
ma questo è due, giusto?
Potresti fare qualcosa per ritratto
e quindi ruotarlo per il paesaggio,
o se sei su un iPhone, il più delle volte,
diresti solo che non ti è permesso di farlo in modo paesaggistico.
Deve essere ritratto.
Quelli erano i giorni.
E poi è arrivato l’iPad.
L’iPad, questo enorme tipo di lavagna
che potevi, ai vecchi tempi di iPad uno,
era rivoluzionario,
ma erano sufficientemente diversi.
Queste due dimensioni erano completamente diverse.
Quindi potresti semplicemente creare due app completamente separate,
o potenzialmente potresti creare la stessa app
e fai diversi layout e cose,
ma erano due cose separate.
Due app separate.
Poi è arrivato l’iPhone da quattro pollici,
con l’iPhone 5 e il 5s.
E questa era della stessa larghezza dei tre e mezzo,
ha appena aggiunto qualcosa in più in basso.
Dimensioni perfette per attaccare un annuncio lì.
E quello era abbastanza spesso quello che è successo.
Basta attaccare qualcosa lungo il fondo.
Non ha molta importanza, a nessuno importa davvero.
Molto spesso, se tu fossi di nuovo dentro, come ho detto,
Ho avuto un iPhone da tre pollici e mezzo per un tempo molto lungo,
allora il design era per i quattro pollici,
e vorrei finire per perdere qualcosa
dal basso, e non avrebbe funzionato.
O come a volte lo vedi ora,
se stai legando o qualcosa e il bar
in cima diventa più grande, quindi le cose vengono semplicemente tagliate
in fondo e a nessuno importa davvero
perché nessuno, non ha bisogno di preoccuparsi di quella cosa,
queste persone con vecchi telefoni, non ci importava di loro.
Poi l’anno scorso, lungo l’iPhone 6, è stato copiato
dal fattore di forma di Android,
e poi era a quattro punti sette pollici, e poi
il cinque punto cinque, il massiccio iPhone 6 Plus,
e 6s Plus ora, copiati dal mondo di
piatti da tavola, questa grande cosa enorme che
non potresti mai tenere in una mano,
è stata un’azione a due mani che ti stavi muovendo.
Tante e tante cose, tante taglie diverse.
E poi quest’anno, in arrivo presto,
è così grande che non si adatta alla diapositiva.
L’iPad Pro è enorme,
è ancora un altro fattore di forma con cui dobbiamo confrontarci,
e infatti, non solo l’iPad Pro è enorme,
se si copia l’immagine dal sito Web di Apple,
vedi il braccio che devi usare
l’iPad Pro, è anche enorme.
È enormemente enorme!
Il mio braccio non è così lungo.
Ad ogni modo, sono 12 diversi fattori di forma
che devi progettare per ora.
Se conti il fatto che devi
fai il ritratto e il paesaggio e devi farlo
per l’iPhone 4, l’iPhone 5, l’iPhone 6,
l’iPad e l’iPad Pro,
e il 6 Plus, come se fossero sei cose diverse,
due fattori di forma, cioè 12.
In passato, avremmo scritto un codice come questo,
dove dovresti solo investigare
nel tuo codice, stiamo usando un iPad,
se lo siamo, allora vai a fare questo particolare layout
e scriveremmo qualche codice di layout.
O forse, non siamo su un iPad,
ma siamo nel paesaggio, o siamo dentro, mi dispiace,
lasciato il paesaggio, il paesaggio giusto, siamo nel paesaggio,
allora dobbiamo fare questo particolare bit di codice.
Ora questo non si ridimensiona, giusto?
Non puoi continuare a farlo
per 12 diversi fattori di forma,
semplicemente non funziona
Sarebbe pazzesco provare e farlo.
E questo è il motivo per cui …
Credo che questa volta l’anno scorso, un po ‘più tempo fa,
Apple ha inventato il layout adattivo,
Dico inventato, è abbastanza simile a quello che era
essere, esisteva nel tipo di progettazione web reattiva
per un po ‘o Android ha avuto
roba del genere anche per molto tempo.
Ma è arrivato Adaptive Layout e questo è nuovo
approccio a fare alcuni layout,
o è uno strato sopra
il modo in cui eseguiamo i layout.
Alcuni dei fatti chiave su questo,
astrae il layout dalle specifiche del design.
Non ci interessa più che sia un iPad, non più
cura che sia un iPhone 6s Plus, con orientamento orizzontale.
Invece, raggruppiamo tutte queste cose diverse insieme
in questo tipo di cose delle classi di dimensioni ondulate a mano,
quindi piuttosto che dire che questo è molti pixel,
punti di vista, diciamo bene in realtà,
non è molto spazio in orizzontale.
Ci occupiamo invece di queste classi.
Puoi iniziare a usarlo da iOS 8,
e ovviamente anche iOS 9 lo supporta,
ed è completamente supportato in Xcode e Interface Builder,
e dico pienamente supportato …
pienamente supportato come qualsiasi cosa
in Xcode e Interface Builder,
Adaptive Layout è, ed è carina, carina
ragionevole da usare in queste due cose.
Dio solo sa, voglio dire, quante persone sono state
usando Auto Layout per un po ‘?
Sei tu, i fan del layout automatico?
A qualcuno piace il layout automatico?
Veramente? Va bene.
Auto Layout è molto meglio di prima.
Era atroce, era il più difficile
cosa al mondo da usare, nessuno ha avuto idea
cosa è andato storto, quando è andato storto,
che è successo tutto il tempo.
È molto meglio ora di quanto lo fosse.
Se fosse stato introdotto ora,
come questa nuova straordinaria tecnologia,
come è adesso, sarebbe molto di più
accessibile e utilizzabile.
Mi piace, ma non costruisco le cose, quindi non importa.
Cosa significa veramente, questa cosa di classe di dimensioni?
Piuttosto che dire che hai questa quantità di spazio,
questo molti pixel, questo molti punti,
stiamo parlando in termini di quanto spazio c’è davvero?
Quanto spazio abbiamo per adattarci alle cose?
E dividiamo le classi di grandezza
in due classi di dimensioni diverse.
Parliamo di qualcosa che è compatto,
non c’è molto spazio, siamo limitati
in qualche modo, o regolare, c’è un normale
quantità di spazio, qualunque cosa significhi.
E lo facciamo in due diverse dimensioni.
Puoi dire che orizzontale o verticale,
così puoi essere in orizzontale compatto,
e verticalmente regolari.
È solo un modo di specificare,
c’è questa quantità di spazio in questa vista particolare.
Come funziona, ciao.
Come si fa a mappare i dispositivi reali?
Perché questo non significa niente al momento
finché non vedi come è gentile
lavora nel mondo reale.
Quando prendi un iPad,
e un iPad Pro, in entrambe le dimensioni,
è sempre regolare
C’è sempre un sacco di spazio in verticale
e un sacco di spazio in orizzontale,
non c’è mai tempo su un iPad dove
non puoi adattare la quantità di contenuti in
che vuoi, in una sorta di moda ondulata a mano.
Ma quando guardi un iPhone, allora
quando è in verticale, allora dici che lo è
larghezza compatta, non c’è molto spazio,
larghezza su un iPhone.
Quando lo giri, paesaggio
quindi ora non c’è molto spazio in verticale.
Questo è ora compatto.
La cosa strana da fare con l’iPhone,
è che ti aspetteresti queste scatole viola e arancione
qui solo per scambiare, giusto?
Perché non si scambiano?
Bene, penso, penso che se pensi di tenere
un iPhone in verticale, quindi tradizionalmente
se stai leggendo molti contenuti o qualcosa del genere,
tu faresti scorrere su e giù, e questo lo fa
senso perfetto, giusto?
C’è molto spazio perché scorri.
Ma se lo ruoto, non scorri a sinistra ea destra,
nessuno legge mai qualcosa e poi scorre
fino a un lato, e poi
scorre tutto indietro per leggere l’inizio di
alla riga successiva, non è solo il modo in cui lo fai.
Quindi puoi dire che è compatto.
Il tempo in cui non è compatto,
è con l’iPhone 6 o il paesaggio 6 Plus,
che è così grande da poter contenere un sacco di cose lì dentro.
Ora in questo momento l’anno scorso,
questo genere di cose ha senso,
ma è un po ‘strano, è un po’,
qual è il punto di tutto ciò?
Ma ora, con iOS 9, questo inizia a fare un po ‘
più senso perché il problema con le classi di dimensioni,
quando sono collegati ai dispositivi, è,
bene, non hai davvero fatto molta astrazione,
perché se ho questo dispositivo ed è in questo
orientamento, mi dà sempre le stesse classi dimensionali,
quindi qual è il punto?
Non ha alcun senso, perché io, piuttosto che trovare
fuori da quale classe di grandezza sono, posso solo scoprirlo
quale dispositivo è, perché c’è una mappatura uno-a-uno,
quelle cose non cambiano mai.
Ma con l’avvento del multi-tasking,
finalmente comincia a dare un po ‘più senso.
Ad esempio, un iPad è sempre regolarmente regolare,
indipendentemente da quale dimensione, quale
orientamento è tenuto dentro
Tuttavia, quando inizi a fare il multi-tasking,
che è nuovo in iOS 9, giusto, quindi l’idea con
multitasking iOS 9, puoi prendere il tuo iPad
e puoi scorrere verso destra da destra
e puoi avere un’altra app in arrivo su
lato destro, e se hai un caro
o nuovo iPad, quindi puoi spostarlo ulteriormente
e hanno due app affiancate.
A questo punto, ora stai lavorando su un iPad,
hai un orientamento particolare,
ma non sai quali saranno le dimensioni della tua app,
perché la tua app può essere avviata
e poi lo scoprirai se sei in verticale
e fai scorrere qualcosa dal lato,
ora efficacemente, hai due app per iPhone
correndo uno accanto all’altro.
Quindi, la stessa app in esecuzione, ma nella configurazione
userebbe se fosse su un iPhone.
Ha una classe di dimensioni orizzontale compatta
e classe di dimensione verticale regolare.
E poi se lo fai ruotare, ora hai questo
altra configurazione con regolare regolare
e regolare regolare, e quindi finalmente
hai un compatto compatto regolare.
E poi credo in iPad Pro,
allora puoi avere due regolari regolari
app affiancate.
Quindi, a questo punto, ora lo abbiamo astratto
da solo specifiche del dispositivo.
Ora possiamo avere cose diverse in esecuzione su un dispositivo.
Quindi, il mio tipo di cinque punti su come,
come andresti sull’adozione di Adaptive Layout,
qual è un processo ragionevole per fare questo?
Perché, voglio dire, l’obiettivo finale è quello
Creo uno storyboard e regola tutto.
Non abbiamo bisogno di più storyboard.
Puoi usare uno storyboard e questo funzionerà
su un iPad, funzionerà su un iPhone, lo farà
eseguire su tutti i diversi dispositivi iOS.
E sarebbe fantastico, vero?
Non abbiamo questo problema dove abbiamo
quattro diversi storyboard, e abbiamo
per assicurarci di aggiornare ognuno di loro.
Gli aggiornamenti a uno di loro significheranno questo
tutto si aggiorna in modo appropriato.
Quindi come si fa a riguardo?
Beh, questi sono il mio tipo di, mio,
l’approccio che consiglierei,
e prima dovresti costruire il tuo layout di base,
questo è il prendiamo tutto ciò che vogliamo
sullo schermo, questo è il layout
che vogliamo accadere la maggior parte del tempo.
E poi sostituiresti una di quelle classi di dimensioni,
e ti mostrerò cosa significano le classi di dimensioni prevalenti
quando entriamo in un po ‘di una demo.
E poi disinstalli i vincoli irrilevanti,
quindi stiamo parlando di layout automatico qui,
quindi hai questi limiti,
che determina la dimensione e la posizione delle diverse visualizzazioni,
e puoi fare questa cosa chiamata disinstallandoli, giusto?
Quindi abbiamo scelto una classe di dimensioni particolare,
e voglio prendere questi vincoli e buttarli via.
In questa classe di dimensioni, non sono interessato a questi vincoli.
Tutto il resto, li vogliamo, non questo.
Quindi li disinstalliamo, quindi ne aggiungeremo alcuni nuovi
vincoli per essere sicuro di ottenere il layout
che in realtà vogliamo in questa nuova classe di dimensioni.
E poi continui a ripeterlo,
e la cosa importante con questo è,
che quello che non fai è andare nel tuo storyboard
e crea un layout per iPhone,
e poi, quindi uso come,
Vorrei entrare e dire bene, quindi se un compatto
larghezza e altezza normale, versione per iPhone,
Ritratto di iPhone, voglio questo layout,
costruiscilo e poi dillo bene, voglio costruire
un iPad ora, quindi ho intenzione di andare a fare il
regolare regolare, buttare via tutto e ricominciare.
Questo non ti aiuta affatto.
L’approccio è iniziare con questo layout di base
e poi lavorarci sopra.
Ok, diamo un’occhiata, potrei parlarne tutto il giorno,
ma è molto più utile, penso, da vedere
succede in Xcode e Interface Builder.
Quindi ho costruito questo progetto, è un progetto molto semplice.
E se ti mostro su un iPhone al momento,
quindi sembra solo, è solo
un’app per iPhone, è un’app di dettaglio principale standard.
E mentre tocchi ciascuna di queste righe,
poi ottieni questa pagina di dettaglio,
ha una foto in alto e poi questi
tipo di dettagli in basso.
E il problema con questo è che quando lo ruoto,
allora non c’è più spazio per quelli,
l’etichetta di testo con i dettagli,
poi cadono dal fondo.
Quindi quello che voglio fare è vedere come posso usarlo
Layout adattivo per modificare questo layout
quando non c’è abbastanza spazio per quella verticale,
per quella etichetta dettagli in basso.
Ora, le parole che sto usando, come sono
esprimendo questo sta dicendo bene, per quando non c’è
abbastanza spazio in questo tipo di dimensione,
questo è esattamente il problema del tipo di classe di dimensioni, giusto?
Stiamo dicendo che in verticale, è compatto.
Verticalmente, non c’è abbastanza spazio per adattarsi.
Così ho, questo layout al momento,
è costruito con il layout di base, questo è solo il
layout, li ho tutti disposti,
uno sopra l’altro.
E ora voglio entrare e guardare e vedere bene,
in realtà, quando non c’è abbastanza spazio in verticale,
Voglio fare un layout diverso.
Voglio sovrascrivere il layout,
quando non c’è abbastanza spazio in verticale,
è una classe di dimensioni verticali compatta.
Quante persone hanno usato classi di dimensioni prima?
Questo è buono, perché altrimenti saresti seduto lì
pensando che fosse inutile, è grandioso.
Ok, ora puoi vedere, non molto bene, è molto piccolo.
Potrei farcela, lo so, farò solo dello zoom.
Va bene. Quindi se diamo un’occhiata.
Quindi questo è lo storyboard.
Se rimpicciolisci lo storyboard, puoi vedere,
come ho detto, è solo una cosa di dettaglio principale standard,
e ci concentreremo solo qui
su questo controller vista qui, e tutto il
demo che sto facendo oggi
è disponibile su GitHub, ti darò un link alla fine.
E tutto quello che sto facendo è negli storyboard,
Non ho fatto nulla nel codice, il che significa che
puoi guardare le differenze in GitHub
e non significheranno nulla, perché loro
erano solo differenze di storyboard.
Ok, quindi questo è il layout, come ho detto all’inizio,
abbiamo questo tipo di, abbiamo l’immagine
dei pancake, il titolo, questo genere di cose,
sono tutti collegati come ci aspettavamo.
Ora quello che puoi fare per le classi di dimensioni è
se riesco a ricordare come zoomare, giusto.
Giù in fondo qui, puoi vedere questo WNEH qualsiasi,
giù proprio qui in basso.
E quello che c’è, è qualcosa di nuovo
in Xcode 6 e ovviamente continua in Xcode 7.
Quella è la classe di dimensioni che ha la precedenza su thingy-ma-jig.
Questo è il termine tecnico.
E se tocco questo, vedi questa strana cosa da nove quadrati.
E se mi muovo, puoi vedere che mi sta dando
queste diverse combinazioni di classe di dimensioni.
E inizia con questa qualsiasi base
valori per tutti i layout.
Tutto ciò che metto quando sono in quella classe di dimensioni ha la precedenza,
apparirà in ogni singolo strato che faccio.
E, mentre stavo parlando, voglio occuparmi di un caso
dove non c’è abbastanza spazio in verticale,
quindi quello che sto per fare è, questo è il mio layout di base,
Ora vado a scavalcare
per uno strato di altezza compatto, ecco qui un’altezza compatta.
Non è un’altezza compatta specifica, larghezza compatta
o larghezza regolare, altezza compatta,
Mi occupo solo di altezza compatta,
perché non mi interessa la larghezza, mi interessa l’altezza.
Quando non c’è abbastanza spazio in verticale,
Ho intenzione di entrare e cambiare qualcosa.
Quindi, per farlo, lo tocco lì dentro,
e se faccio lo zoom indietro, puoi vedere
ora ho questa barra blu.
E quello che ho intenzione di fare,
ricorda la seconda fase del mio piano?
Quindi ora sono nel palco dove sto andando
disinstallare i diversi vincoli che non mi interessano.
Ora voglio l’immagine sul lato sinistro,
e tutte le informazioni dettagliate sul lato destro.
Quindi tutto quello che ho intenzione di fare, un po ‘di layout automatico,
Ho intenzione di entrare e rimuovere i pezzi
che non mi interessa.
Quindi se ho l’immagine, apro l’ispettore taglia,
puoi vedere tutti i diversi
vincoli e cose che abbiamo
in basso a sinistra.
Quindi sono sulla foto al momento.
Ho lo spazio finale per le super viste,
questo è per quelli di noi con le lingue da destra a sinistra
sul lato destro,
abbiamo lo spazio principale in modo che sia il lato sinistro,
contenitore di contenuto distanziato in basso, quindi il contenitore del contenuto
è una vista vuota, beh non una vista vuota,
una vista bianca che contiene tutte le cose
in fondo che mi muoverò
sul lato destro.
Abbiamo uno spazio migliore per la guida ai layout,
quindi è bloccarlo in cima,
e contenitore di contenuto di uguale altezza.
Quindi voglio rimuovere alcuni di quelli.
Ora cosa puoi fare con le classi di dimensioni
è dire, non mi interessa di questo particolare
vincolo per questo layout.
Quindi sto per dire, voglio che questo sia finito,
Voglio che l’immagine sia finita sul lato sinistro.
Quindi cosa non voglio più fare
è appuntare lo spazio finale sul lato destro,
perché allora non sarebbe possibile
Quindi quello che faccio è selezionarlo nell’ispettore taglia
e premere backspace, o mi dispiace, premere Elimina.
E puoi vedere ora, è disattivato.
C’è qualcosa qui, questa classe di taglia su tutto,
devi assicurarti di essere su tutti, perché
altrimenti ti mostrerà solo quelli
per questa particolare classe di dimensioni.
Ora che è disattivato, significa che non lo sarà più
applicare in questo override di altezza compatto.
Cos’altro non voglio,
Inoltre, non voglio lo spazio di fondo per il contenitore dei contenuti
e anche io non voglio altezza uguale al contenitore dei contenuti.
Quindi ora ho solo questo ruolo in cima.
Ora posso fare esattamente lo stesso con il contenitore dei contenuti,
quindi ora ho selezionato il contenitore dei contenuti,
questa è una scatola bianca in basso,
e puoi già vederlo,
due di questi sono in grigio.
Questo perché i vincoli sono tra due diversi
visualizzazioni e se ho disinstallato il vincolo su una vista,
quindi ovviamente viene disinstallato dall’altra vista.
Non puoi averne uno, come un mezzo ostacolo installato.
Quindi abbiamo già perso lo spazio migliore per la visualizzazione delle immagini
e altezza uguale alla vista dell’immagine,
ora questo in basso, l’unico altro che noi
voler disinstallare è lo spazio principale.
Non lo facciamo, non lo vogliamo più appuntato sul lato sinistro.
Quindi posso selezionare quello lì dentro e
premi cancella e quello va.
Quindi ora abbiamo ancora due vincoli
ognuno di quelli che vogliamo ancora utilizzare.
Quello che non vogliamo, sono questi altri.
E ora se faccio lo zoom indietro, oh no, non così.
Rimpicciolisci in questo modo e ingrandisci qui.
Troppi zoom.
Quindi quello che posso fare ora è approssimativamente trovarli
dove li voglio, trovo molto più facile lavorare così,
quindi prenderò questo,
il contenitore dei contenuti vuole andare da qualche parte in quel modo,
e la vista dell’immagine vuole andare da qualche parte in questo modo.
Ignora semplicemente il fatto che sembra un po ‘spazzatura al momento.
Quindi, ora, la prossima fase di quel piano in cinque fasi,
era quello di aggiungere i nuovi vincoli.
E quando sei nella modalità barra blu,
significa che qualsiasi vincolo che aggiungi,
esisterà solo in questo override particolare della classe di dimensioni.
Non è più necessario preoccuparsi del layout di base,
Li aggiungerò e loro solo lo faranno
esistono per questo override di classe di dimensioni.
Quindi quello che voglio fare è prendere questa immagine
e voglio assicurarmi che,
quindi, torna indietro di nuovo.
Usando questi piccoli pulsanti in basso,
se hai familiarità con Auto Layout,
probabilmente li usi sempre.
Usa quello che assomiglia un po ‘a un lottatore,
che è il menu pin.
Se tocchi questo,
allora puoi vedere che aggiungo un vincolo,
quindi dovrei, ho selezionato l’immagine al momento.
Voglio, ora ho bisogno di aggiungere un nuovo vincolo
per appuntare l’immagine in basso.
Quindi sto andando a colpire quella barra degli occhi lì.
Quindi selezionerò il contenitore dei contenuti,
questo ha bisogno di uno nuovo per fissarlo in cima.
Ho quindi bisogno di altri due vincoli,
Ho bisogno di, ho intenzione di afferrare l’immagine
oltre al contenitore del contenuto,
Voglio impostare la spaziatura orizzontale
e voglio impostarli come larghezze uguali.
Qualcosa che è cambiato in Xcode 7, è quello
ora c’è questo nuovo vincolo di aggiunta,
mi dispiace di averlo fatto, tu controlli la resistenza
da una all’altra destra, e poi se si preme
shift, quindi puoi selezionare più vincoli
che vuoi aggiungere allo stesso tempo.
Qualcosa di nuovo in Xcode 7 è
ora c’è questo menu di vincoli aggiuntivi.
Prima, hai fatto questa cosa strana dove hai cliccato
via al menu e probabilmente ha aggiunto i vincoli,
ora c’è un pulsante reale da dire
fallo per me, lo voglio davvero.
Quindi ho aggiunto quei vincoli e penso,
bene, vedremo tra un momento, che ho ora
aggiunto i vincoli che volevo,
quindi ora se uso, non so che tipo di
nave spaziale sembra,
nessuna idea.
Se ora utilizzo questo menu,
e dì aggiorna tutti i frame,
e poi zoom indietro,
rimpicciolire e zoomare su questo.
Eccoci.
Questo è più o meno quello che stavo cercando.
So che l’immagine non va bene,
ma questo è, non dispiace, il testo non va bene,
non sono preoccupato per questo, ora sono riuscito
per fare questo layout diverso,
quindi voglio solo verificare se funziona.
Quanti di voi hanno,
quante persone usano gli storyboard?
Ho visto qualche uso di storyboard, giusto?
Quante persone sono a conoscenza del nuovo,
nuovo in Xcode 6 Preview Assistant Editor?
Oh, va bene, quindi alcune persone lo sono, e va bene.
Quindi l’editor di sistema, tradizionalmente quando sei dentro
storyboard, porta in classe chi sei
lavorando con, giusto?
In Xcode 6 e ovviamente continua in Xcode 7,
se tu, nella barra di salto in alto,
qui, e dove dice automatico,
puoi selezionare l’anteprima,
e quello che fa è darti una scatola grigia.
Oh, lo so, non sono selezionato, eccoci.
Quello che fa è, piuttosto che dover correre
ogni diverso simulatore e ruotalo per vedere cosa
il tuo controller di visualizzazione particolare sarà simile,
puoi invece usarlo per,
facciamo un po ‘più grande,
Posso aggiungere, usando questo piccolo vantaggio in basso,
Posso aggiungere molte dimensioni diverse,
anteprime di dimensioni diverse in base ai diversi dispositivi,
e puoi ruotarli e vedere come si comporta.
E questa è la cosa importante, giusto, è quello
questi due uno accanto all’altro, iPhone in verticale,
foto in cima ai dettagli, iPhone in orizzontale,
l’immagine è ora a sinistra dei dettagli.
Questo è esattamente ciò che volevamo fare.
Non abbiamo toccato alcun codice, abbiamo fatto tutto
Interface Builder e lo abbiamo fatto disinstallando
e l’installazione di alcuni vincoli, che è piuttosto interessante
Penso, non è, non molto difficile.
E se ti piace Interface Builder,
bene se non ti piace Interface Builder,
Apple continuerà a spingerlo giù per la gola.
Non è così male.
Quindi, alcune cose su quei vincoli che abbiamo creato.
Se apro, alcune di queste cose vincolanti
sopra nel contorno del documento,
lo noterai in fondo qui,
abbiamo alcuni vincoli sfumati.
Significa che i vincoli sono in grigio
questi vincoli esistono, ma non sono installati,
non sono in funzione, non sono attivi
nell’override della classe di dimensioni corrente.
E infatti, se io,
Vieni qui,
se torno al layout di base, noterai
un paio di cose, prima di tutto,
ora questo è tornato alla sua dimensione originale,
e qui sotto, probabilmente non puoi vederlo,
se lo faccio di nuovo, così puoi vederlo
in compatto, poi quelli che sono stati installati cambiano, ok?
Cambiano secondo
quale classe di dimensioni ha la precedenza su di te.
E anche se usi l’ispettore degli attributi
qui, noterai che c’è questo nuovo
cosa in fondo
che ha, non è controllato.
Installato non è controllato per niente,
che è il layout di base, ma esiste un override della classe di dimensione
per larghezza qualsiasi altezza C, compatto,
dove è controllato.
Ciò significa che è solo installato
per una particolare classe di dimensioni.
È fantastico.
E questa piccola cosa in più apparirà più spesso.
Cioè, ciò significa fondamentalmente che esiste un modo
puoi sovrascriverlo per una determinata classe di dimensioni.
Va bene, d’accordo.
Torniamo indietro ad alcune diapositive.
Beh, ho la sensazione che sia una diapositiva.
Ok, quindi è lì, ti ho mostrato come puoi
andare su una sorta di adattività.
Vincoli, puoi prendere un vincolo
e tu puoi decidere, lo voglio
in questa particolare classe di dimensioni o no?
È abbastanza bello, puoi riallineare, riorganizzare
il tuo layout in molti modi diversi.
Ma non è tutto ciò che puoi fare con Adaptive Layout.
Ci sono altre cose che sono anche adattive.
L’installazione di vincoli è la prima
di cui ti ho parlato,
ma puoi anche modificare la costante su un vincolo.
Quindi se hai un vincolo che dice,
la spaziatura tra queste due viste
dovrebbe essere dieci punti, quindi posso dire
bene se ho abbastanza spazio,
allora in realtà dovrebbe essere un centinaio di punti,
e posso farlo senza dover
elimina quel vincolo e creane uno nuovo.
Stranamente, non puoi modificare il moltiplicatore del vincolo.
Quindi sai che i vincoli hanno una costante
e hanno un moltiplicatore,
se hai bisogno di cambiare il moltiplicatore,
allora in realtà devi disinstallare
il vincolo e crearne uno nuovo.
Non so davvero perché.
Puoi cambiare il carattere, quindi se ho un font particolare,
e voglio cambiare la dimensione del carattere,
è qualcosa che ti aspetteresti
potresti voler fare bene?
Tra un iPhone e un iPad voglio cambiare
questa dimensione del carattere per renderla più grande su un iPad.
Beh, puoi farlo abbastanza semplicemente.
E vedremo, faremo una breve demo di alcuni di questi.
E infine, guarda l’installazione,
e questo è anche abbastanza importante.
Se hai un layout
per un iPhone, e vuoi usarlo,
riutilizzare la stessa cosa su un iPad,
allora probabilmente non lo vorresti
cambia la dimensione del carattere e la spaziatura,
e riallineare cose diverse.
Qualcosa che probabilmente vorresti fare
è in realtà aggiungere nuove viste, giusto, avrebbe senso giusto?
Bene, puoi farlo anche tu.
Quindi penso, visto il tempo, a che ora finiamo?
15 minuti.
Ti mostrerò alcuni di questi perché voglio mostrarti
qualcosa di molto bello
Quello che voglio fare è la demo cambiando le dimensioni e cambiando
il font, e se guardi nel repository Git,
allora puoi vedere le installazioni della vista,
così come è possibile installare le viste e disinstallarle.
Ma, il carattere è davvero facile, e infatti,
in molte volte su tutto il layout adattivo e Xcode,
ogni volta che vedi questo piccolo vantaggio,
questo piccolo, piccolo piccolo vantaggio accanto a una delle proprietà,
ciò significa che posso fornire un override di classe di dimensioni per quello.
E infatti, se tocco questo,
puoi aggiungere la personalizzazione della dimensione della classe
e quindi puoi usare questo sistema di menu non intuitivo
per scegliere quale classe di dimensioni ignorare.
Il modo più semplice per farlo è farlo
salta di nuovo nella classe di dimensioni sostituita che desideri.
Quindi ho intenzione di scegliere ora regolare regolare,
è di dimensioni iPad, e poi se ho colpito il plus,
allora puoi vedere quello che suggerisce
è l’override della classe di dimensione corrente.
Ora qualcosa che è davvero abbastanza confuso,
Trovo, quando sei nella modalità barra blu,
override della classe di dimensione, se aggiungo una vista,
Esisterà solo in quella vista.
Se aggiungo un vincolo, esisterà solo in questo,
scusa, se aggiungi una visualizzazione, esiste solo in questo
override della classe di dimensione, se aggiungo un vincolo,
Esisterà solo in quell’override della classe di dimensioni.
Se rimuovo una vista o rimuovo un vincolo,
si verificheranno solo all’interno di quell’override della classe di dimensioni.
Se cambio il carattere, questo cambia il layout di base.
Se cambio una costante, questo cambia il layout di base.
Quindi devi sempre ricordarlo
cosa esattamente cosa sto facendo,
e se voglio cambiare il carattere,
quindi ho bisogno di fare clic sul piccolo vantaggio.
Così spesso, passerò attraverso e cambierò il carattere
e poi tornerò a quello originale e
mi rendo conto di averlo cambiato anche lì,
e poi devi tornare indietro e provare e
ricorda cosa fosse o cosa fosse
attraverso la cronologia degli annullamenti per trovarlo.
Quindi usa il piccolo vantaggio, e poi mi dà
larghezza regolare, altezza regolare, e poi ho appena avuto
una scatola di font standard, giusto, quindi posso entrare e
Ho intenzione di scegliere un font diverso e tutti
su un iPad ama una festa, quindi usiamo il font del party.
Facciamolo dimensione 60.
E questo dovrebbe significare
oh, cambiamo anche qualche spaziatura mentre siamo qui.
Così ho, mentre sono su questo ho deciso che in realtà
Posso, posso aumentare lo spazio tra la festa,
tra il carattere del partito … (ridacchia)
Tra il font del titolo e la barra gialla.
Quindi se ho selezionato quell’etichetta lì e
Guardo i vincoli a cui sono associato,
uno di questi è lo spazio in basso per la barra gialla,
e se tocco questo, allora qui puoi notare che lo ero
parlando della costante e anche questo è un po ‘
più accanto ad esso, quindi posso aggiungere una dimensione,
aggiungi un override per quello e trasformalo in
100 e vedremo cosa fa.
Quindi se apro l’anteprima,
e aggiungine uno per l’iPad,
scorrere fino in fondo,
zumare un po ‘,
Xcode non è molto buono in spazi ristretti.
Ho dovuto dare questa demo in 800 per 600 una volta.
Dovresti, come sfida, un giorno,
prova e usa Xcode a 800 per 600.
Eccoci, quindi voglio dire che è fatto quello che volevamo.
Proprio qui, questo override di classe dimensionale è regolare.
Ha cambiato il carattere in quello piuttosto sfarzoso
font di festa, e ora c’è un enorme divario tra
l’altra barra e quella sopra.
Quindi, in passato, avresti dovuto passare attraverso
e fai tutto quel codice if-then-else
e tu dovresti, voglio dire se stavi usando dei vincoli,
allora dovresti afferrare quel vincolo
e modificare la proprietà su di esso o
rimuovere un vincolo o è possibile utilizzare diversi storyboard.
Ma per compiti semplici come questo, puoi ottenere
abbastanza lontano usando solo il
Override della classe di dimensioni del layout adattivo per questo tipo di cose.
Non ti mostrerò l’installazione di viste diverse,
perché non ho tempo, ma è di nuovo molto simile,
se sono in override della classe di dimensioni, aggiungo una vista,
Esisterà solo in quella visione e io posso
aggiungi i vincoli e le cose come appropriato.
Quindi, voglio saltare molto velocemente
come funziona nel codice,
cosa significa in realtà questa roba?
Perché l’abbiamo visto in Interface Builder, ma in realtà,
puoi avere una lunga strada in Interface Builder, ma
quasi certamente ad un certo punto, vorrete
entra e combatti con il codice.
Quindi, tutte queste cose esistono in questo
nuovo codice di classe UITraitCollection, che
è stato presentato l’anno scorso.
Ora è il posto giusto per scoprirlo
cose diverse sul dispositivo, in modo da poter ottenere il
idioma dell’interfaccia utente. Quindi, è un iPhone, è un iPad?
È possibile ottenere la scala di visualizzazione, che è,
beh, stavo per dire sta diventando sempre più irrilevante,
ma è ora con retina HD, suppongo che non lo è.
In modo che tutto ciò che vi darà
uno, due o tre, a seconda di
il numero di pixel per punto.
Puoi ottenere le due classi di dimensioni, quindi posso scoprirlo
se posso entrare in possesso di un ‘traitCollection’,
Posso scoprire qual è la mia attuale classe di dimensioni.
E poi nuovo in iOS 9 è questa capacità di tocco di forza,
quindi se hai un iPhone 6 o un Plus 6s,
puoi scoprire se hai o no quello
Cose tattili in 3-D, quindi se puoi determinare o meno
quanto è difficile spingere il dito sullo schermo.
Quindi, come posso ottenere uno di questi ‘traitCollection?
Bene, usi un ambiente tratto.
L’ambiente dei tratti è solo un protocollo
e su di esso, ha una proprietà chiamata `traitCollection`.
Quindi posso afferrare un `traitCollection`,
e ha anche questa utile funzione
`traitCollectionDidChange`, e
ne parleremo tra un secondo.
Ora cosa adotta questo protocollo? `UIScreen`,` UIWindow`,
“UIPresentationController”, “UIViewController” e “UIView”,
questo significa che se ti trovi in una di queste cose,
puoi scoprire qual è la tua attuale ‘traitCollection’.
E quindi, in che classe di grandezza sei.
Devi solo chiedere “traitCollection”,
e poi sarai, avrai ciò che devi sapere.
Cos’è questo “traitCollectionDidChange”?
Quando lo faranno, verrebbe chiamato
ogni volta che la “traitCollection” è cambiata, giusto?
Quando accadrà?
Cosa succede se ho preso un iPhone in verticale,
e l’ho ruotato, quindi il ‘traitCollection’
di ogni vista, visualizza controller, controller di presentazione,
lo schermo e la finestra riceveranno ‘traitCollectionDidChange’
perché lo hai ruotato.
Sei passato da altezza normale, larghezza compatta,
per compattare altezza, larghezza compatta o avanti
un iPhone Plus, larghezza regolare.
Quindi potresti usarlo per gestire la rotazione,
gestire qualsiasi tipo di codice che si desidera eseguire
quando il ‘traitCollection’ viene modificato.
È un po ‘masticatore, non ha grana molto fine,
e lo vedremo tra un momento.
L’altra cosa che potresti fare,
è in realtà sovrascrivere le classi di dimensioni.
Perché vorresti farlo, così com’è
sembra un po ‘strano.
Ma puoi costruire un controller di visualizzazione che ha
un particolare layout per una determinata classe di dimensioni.
E poi ti rendi conto in realtà, sono su un iPad,
ma ho creato un controller di visualizzazione contenitore,
e sto mettendo questo altro controller di visualizzazione in esso,
c’è in realtà abbastanza piccolo, giusto?
Voglio usare l’iPad o il layout
che ho definito per larghezza compatta
perché questo controller di visualizzazione è così piccolo,
quindi voglio un controller vista contenitore,
che potresti costruire da solo,
un controller di visualizzazione contenitore personalizzato,
in realtà puoi dire, per i controller di vista di mio figlio,
o questo particolare controller di visualizzazione figlio,
Voglio invece usare questo ‘traitCollection’.
Non voglio … Sono su questa enorme tela di un iPad,
ma il mio contenitore, uno dei miei controller di visualizzazione figlio
è solo questo grande
Quindi è una larghezza compatta.
Quindi potresti usare questo, ed è abbastanza semplice da usare,
semplicemente, ti costruisci un ‘traitCollection’
con gli override che desideri,
e lo si passa al controller di visualizzazione figlio
attraverso questo metodo, che si trova su `UIViewController`.
Questo mi porta all’ultimo protocollo che
Voglio introdurre, e questo è `UIContentContainer`,
e questo è un modo leggermente più fine
affrontando queste transizioni tra ‘traitCollection’s.
Così hai fatto, hai questo in `UITraitEnvironment`,
ottieni ‘traitCollectionDidChange`,
beh, è un po ‘tipo di mazza giusta,
all’improvviso ti viene solo detto
giusto il “traitCollection” è cambiato, rimettiti in gioco.
Come gestisci per assicurarti di essere
gestire le animazioni in modo piacevole,
come fai a fare qualcosa del genere?
Ecco dove si desidera utilizzare questi metodi
che si trovano su `UIContentContainer`,
e `UIContentContainer` è adottato da
`UIViewController` e` UIPresentationController`.
Questi hanno, hanno questo `willTransitionToTraitCollection`
quindi hai esattamente lo stesso momento,
bene, prima che la transizione avvenga ora,
ti viene detto che ti trasferirai in questa “traitCollection”,
e all’interno di questo, si ottiene un `transitionCoordinator`,
che per quelli di voi che hanno fatto un qualsiasi “UIViewController”
transizioni, che sono un mare enorme di incredibilmente
lunghi nomi di protocollo, che cosa ti permette di dire,
“Voglio fare questa animazione,
“e voglio farlo allo stesso tempo
“come sempre le animazioni che il sistema sta facendo.”
E questo è veramente utile, ti dirò perché
è davvero utile in un minuto,
l’altro metodo su quelli, `viewWillTransitionToSize`.
Quindi la domanda che tutti chiedono sempre è,
“Il mio iPad è regolare, indipendentemente dall’orientamento,
“Non ha alcun senso.
“Perché dovrebbe succedere?
“Non è utile per me.
C’è chiaramente meno spazio. “E il metodo è questo
davvero utile per questo è `viewWillTransitionToSize`.
Questo viene chiamato ogni volta che il controller di visualizzazione
cambia dimensione e prima di iOS 9,
sarebbe praticamente solo a rotazione,
a meno che non si stia eseguendo un contenimento complesso del controller di visualizzazione
te stesso, che sarebbe fondamentalmente solo sulla rotazione.
Il controller della vista passerebbe alla dimensione.
Quindi quando si ruota un iPad, il metodo migliore è quello
sarà chiamato, perché la dimensione cambierà,
il metodo bottom non verrà chiamato.
Perché il ‘traitCollection’ non lo fa.
E questo mi porta alla deprecazione della rotazione.
In iOS 8, questi adorabili vecchi metodi
per aver a che fare con la rotazione erano tutti deprecati.
Non puoi, beh, puoi usarli,
non dovresti usare ruoterà per …
`willAnimateRotationToInterfaceOrientation`
o `didRotateFromInterfaceOrientation`.
Tutto questo è sparito, quindi come diavolo
ti occupi della rotazione ora?
E questo è un tipo di cambiamento nel paradigma di
`WillTransitionToSize`.
Usa invece quel metodo.
Questo è un esempio del metodo utilizzato.
Quindi non pensare alla rotazione come a muovere un dispositivo,
pensala come il tuo controller di visualizzazione sta cambiando le dimensioni.
Perché dal punto di vista dell’utente,
è tutto ciò che è realmente successo, giusto?
Se ti sei seduto all’interno del tuo controller di visualizzazione,
il fatto che il dispositivo sia ruotato è irrilevante.
La cosa interessante è che hai cambiato taglia.
Quindi puoi usare questo, voglio dire questo esempio qui,
usa quel coordinatore, questo coordinatore di transizione,
e chiama questa “animateAlongsideTransition” lì.
In modo che ci sia permesso di dire
quando avviene questa rotazione, il sistema
prenderà il tuo controller di visualizzazione,
e lo ruoterà per te, e
lo ridimensionerà per te, in un’animazione.
Voglio fare un’altra animazione al suo fianco,
è esattamente l’animazione che voglio fare.
E questa è solo una Transizione CA.
Penso che, ho ottenuto, ho cinque minuti.
Voglio parlare molto, molto, molto brevemente delle viste dello stack,
perché le visualizzazioni dello stack, ho parlato molto di layout automatico.
Le visualizzazioni dello stack sono nuove in iOS 9 e lo sono,
se non hai usato Auto Layout prima,
ora è un buon momento per entrarci,
perché le viste dello stack ti faranno risparmiare un sacco di dolore.
Quali sono?
Voglio costruire una vista come questa, giusto?
Quindi ho una visione bianca e ho
ha queste tre viste al suo interno
Come potrei farlo con i vincoli?
Beh, avrei bisogno di appuntare quello in alto
e sul lato sinistro,
Avrei bisogno di appuntarlo sul lato destro,
e appuntare quello arancione verso il basso.
Dovrei aggiungere alcuni vincoli
per distanziarli pure, giusto,
quindi voglio mettere un divario tra loro.
Direi anche che voglio allinearli per tutto il centro,
Li voglio così che siano tutti
centro allineato l’uno con l’altro.
E poi finalmente voglio dire quello arancione
dovrebbe avere la stessa larghezza del
quello grigio, e poi quello viola nel mezzo
userà solo la sua dimensione di contenuto intrinseco.
Questo è un sacco di vincoli,
quindi penso che sia come 12 vincoli,
che è molto per costruire qualcosa che è così semplice.
Quindi stack view, stack view è esistito
su OS X per diversi anni, ora
sono molto meglio ora in OS X con,
ora corrispondono a ciò che è stato introdotto in iOS.
È praticamente uguale al layout lineare
da Android, che è esistito
per molti, molti, molti anni.
Cosa fai?
Bene, quella pila guarda lì,
scusa, quella disposizione attorno al bordo è una vista pila.
E una vista stack ha proprietà su di essa,
quindi aggiungo alcune visualizzazioni alla vista dello stack,
Dico su quale asse mi piacerebbe che fosse orientato,
e ho impostato alcune cose come la spaziatura,
quanto distanti dovrebbero essere queste cose?
Voglio dire che sono tutti allineati nel mezzo,
e poi devo usare alcuni vincoli,
perché devo posizionare questa vista dello stack
da qualche parte nel suo più ampio,
nella sua visione più ampia.
Quindi ora ne ho usati due e poi ho potuto
aggiungi altri due vincoli se volessi
pin esattamente a una dimensione specifica.
Questo è quindi quattro, possibilmente due vincoli
per fare quello stesso layout, io solo
Chuck le cose e lo costruisce.
Non penso di avere tempo per questa demo,
ma voglio mostrarti una cosa,
e questo è,
in Xcode, imparare e amare
questo piccolo bottone qui.
C’è come una freccia che cade giù per delle scale.
Che lì crea una vista pila,
prendi alcune viste, per quante ne vuoi,
spingere quel pulsante, renderà una vista pila.
Da lì, puoi modificare tutti i tipi di cose diverse.
E la cosa interessante delle viste dello stack,
ora ho una vista stack qui per mostrarti.
Ho usato nella cella di visualizzazione tabella, celle di visualizzazione tabella,
quelli che sono notoriamente
difficile da stendere automaticamente.
L’ho appena buttato in una pila,
e una volta che l’ho fatto, se afferro la vista pila,
puoi vedere che sono molto, giocano
molto bene con l’adattabilità.
Hanno questi vantaggi sul lato,
il che significa che posso aggiungere sostituzioni di classe di dimensioni
per cose come l’asse, così
quello che stavo per mostrarti è che posso fare cosa dove io
cambiato da essere allineato verticalmente
allineato orizzontalmente, solo aggiungendo
una classe di dimensioni sostituisce la vista pila.
Davvero semplice
Posso cambiare l’allineamento, la distribuzione,
Posso cambiare la spaziatura, tutte queste cose diverse
davvero, semplicemente usando l’adattività.
Ne vale davvero la pena, sono tranquilli
davvero piuttosto potente se usato con adattività.
Quindi, per finire, solo alcuni suggerimenti
dal mondo della adattabilità.
Uno, conoscere il layout automatico,
è, c’è un po ‘di una curva di apprendimento,
ma non è impossibile, ne vale la pena.
All’inizio non è così difficile come potrebbe sembrare.
Usa il layout adattivo per i layout a tratti generici.
Quindi, non puoi aspettarti di essere in grado di fare tutto
del tuo layout usando questi strumenti di adattamento.
Sono lì per te per ottenere il layout abbastanza giusto,
usa Adaptive Layout e poi puoi inserire il codice
e inizia a usare le cose a grana fine che vuoi fare.
Come quella vista o transizione alle dimensioni.
Inizia sempre con un layout di base e l’override.
Mai e poi mai, mai, mai entrare in uno storyboard e dire,
bene voglio un iPad, quindi vado a
iniziare con regolari regolari.
Ora voglio fare un iPhone in verticale così
Ho intenzione di andare normale compatta.
Inizia con il layout di base con niente,
e poi allenati, beh, cosa voglio cambiare
per questo particolare override.
La vita è più facile con le viste dello stack.
Se è possibile utilizzare iOS 9, andare e indagare su di loro.
Se non puoi, allora ci sono alcuni open source
cose là fuori che saranno equivalenti.
Rendono il layout molto più semplice.
Se annidi le viste dello stack insieme, puoi davvero,
renderà la vita molto più facile, fidati di me.
Ora è il momento di diventare Adaptive.
Come ho detto, ne hai 12 diversi
layout da fare al momento, potresti farlo con
diverse app, puoi farlo
con più storyboard,
date a Adaptive Layout un passaggio e vedetelo o meno
puoi andare ovunque
Sono @iwantmyrealname su Twitter e
puoi prendere il codice per questo
al mio GitHub, e per finire,
per favore ricordati di valutare la sessione,
e ti ringrazio tanto tanto per essere venuto.
Grazie.
(il pubblico applaude)
– Quindi non abbiamo, un minuto per le domande,
quindi penso che il migliore sarebbe probabilmente
come gestisci i compiti?
Perché siamo stati abituati a loro
volendo tutto pixel perfetto.
– [Sam] Sì, questo è, voglio dire che è uno dei
principali sfide associate a questa adattabilità,
ed è qualcosa che penso sia il mondo del web
ha attraversato diversi anni fa
con questo tipo di idea di reattività … Ricordo quando
Ho fatto il web design per la prima volta, ho passato molto tempo
cercando di farlo sembrare perfetto pixel
tra Firefox e Internet Explorer e
Immagino che fosse prima di Chrome, quindi Opera
o qualcosa del genere, e tu saresti lì a cercare di allenarti
bene perché non è identico a questo,
e alla fine sembrammo aver superato questa fase
in questa idea, beh, in realtà il contenuto è
la parte importante, questi sono i pezzi
che vogliamo costruire quel contenuto,
questo è il modo in cui vogliamo avvolgerlo.
Ma ciò che non necessariamente abbiamo è
Voglio un pixel design perfetto qui, qui e qui.
E certamente sembra aver funzionato
nel mondo web, come una sorta di
alla fine ci sono arrivati.
E penso che dobbiamo fare lo stesso tipo di cosa,
ha tutto a che fare con l’educazione,
Voglio dire se tu dici al tuo designer,
sì, puoi avere disegni pixel perfetti, ora vai via e
disegnami 12 diversi disegni, o più di fatto,
perché non solo hanno avuto a che fare con
i diversi dispositivi, ora con il multitasking,
devi fare i conti bene, e se sei un terzo
della larghezza dello schermo su un iPad,
in verticale, e poi in orizzontale,
e poi cosa succede se sei metà della larghezza,
e poi oh, c’è anche un iPad Pro.
Se gli dici che devono progettare 20 diversi
disegni pixel perfetti per quella app,
allora potrebbero iniziare a farsi un’idea
di ciò che fa questa adattività, e diventa
bene, quali elementi vuoi lì,
e quando diventa così stretto, come dovremmo riorganizzarlo.
Perché è esattamente ciò che accade nel web, giusto?
Perdi quella grande barra dei menu in alto,
e diventa quella strana cosa del drop-down dell’hamburger
che occupa l’intero schermo su un iPhone.
E penso che sia, voglio dire che non è necessariamente
la soluzione giusta, ma questo è l’unico
tipo di modo di farlo davvero, è di tipo di
dimostrare questo tipo di cose e uscire dal
pixel mondo perfetto in realtà
il contenuto è la cosa con cui abbiamo a che fare,
come lo facciamo sembrare buono
come possiamo in questi diversi modi.
Freddo. Grazie mille.
Please follow and like us: