Share
În acest tutorial veți fi introduși la una dintre cele mai frecvent utilizate clase Cocoa-Touch: UIAlertView. Cu această clasă, puteți notifica rapid utilizatorii cu privire la informațiile despre aplicații importante sau urgente. De asemenea, puteți forța feedback-ul utilizatorilor prin combinarea clasei UIAlertView cu protocolul UIAlertViewDelegate. Citiți mai departe pentru a afla cum!
Creați un nou proiect Xcode folosind șablonul "Single View Application".
Denumiți aplicația "AlertDemo" și introduceți propriul identificator al companiei sau folosiți "com.mobiletuts.alertdemo" dacă nu aveți încă unul. Setați "iPhone" pentru familia de dispozitive și păstrați verificările implicite. Când este gata, faceți clic pe Următorul.
Selectați o locație de pe hard disk pentru a stoca proiectul și apoi faceți clic pe "Salvați".
După crearea proiectului, extindeți folderul Fișiere suport în panoul Navigator de proiect în partea stângă a ferestrei Xcode. CTRL + Faceți clic pe (sau faceți clic cu butonul din dreapta) în dosarul Fișiere suport și selectați Adăugați> Grup nou. Denumiți noul grup "imagini", pentru că aici vom stoca grafica pentru aplicația noastră.
Descărcați fișierul de resurse al proiectului atașat la acest tutorial și deschideți dosarul "imagini". Glisați și plasați toate imaginile în grupul "imagini" pe care tocmai l-ați creat. Asigurați-vă că verificați "Copiați articolele în dosarul grupului de destinație (dacă este necesar)" deoarece acest lucru va asigura că resursele sunt de fapt copiate în proiectul dvs. și nu pur și simplu legate ca referințe. Setarea dvs. în Xcode ar trebui să pară acum similară cu aceasta:
Găsi MainStoryboard.storyboard fișier în Project Navigator și selectați-l. Tocmai ați deschis tabloul de bord pentru proiect, care ar trebui să fie format dintr-o singură scenă sau View Controller, pe care să putem modifica pentru a crea interfața pentru aplicație.
Cu Storyboard deschis, interfața Xcode ar trebui să afișeze acum biblioteca de obiecte în colțul din dreapta jos. Utilizați caseta de căutare a bibliotecii de obiecte pentru a găsi o UIImageView obiect. Plasați obiectul imaginii în centrul ecranului și redimensionați-l manual pentru a umple vederea. Apoi, găsiți imagine câmp în inspectorul de atribute (inspectorul de atribute trebuie să fie în partea dreaptă sus a Xcode). Setați valoarea pentru câmpul imagine la "background.png". Ar trebui să aveți acum o textura de oțel plăcută care umple controlerul de vizualizare.
Folosind din nou Biblioteca de obiecte, găsiți a UIButton obiect și apoi trageți acel buton pe scenă. Inspectorul de atribute ar trebui să afișeze acum informații pentru obiectul butonului. Seteaza tip coborâți câmpul la "personalizat". Apoi, setați imagine câmpul "button.png". Ar trebui să vedeți acum imaginea butonului de pe controlerul de vizualizare a scenei, dar probabil că nu arată bine. Cu butonul obiect selectat, va trebui să selectați Editor> Dimensiune pentru a se potrivi conținutului pentru a redimensiona automat limitele butonului la dimensiunea conținutului imaginii. Apoi, centrați butonul din ecran glisându-l spre mijloc.
Ar trebui să aveți acum butonul configurat corect pentru starea implicită, dar dorim să afișăm o altă imagine atunci când butonul este de fapt apăsat. Schimba config de stat scade valoarea la "evidențiat". Modificările pe care le faceți în inspectorul de atribute se vor aplica acum numai la starea evidențiată. Seteaza imagine atribut pentru starea butonului evidențiat la Buton-pressed.png. Storyboard-ul ar trebui să arate astfel:
Acesta este momentul potrivit pentru a vă testa progresul, astfel încât să vă salvați munca ( Fișier> Salvare) și apoi executați proiectul în simulatorul iPhone (Produs> Rulați). Acum ar trebui să puteți atinge butonul și să vedeți schimbarea imaginii în simulator.
Cu tabloul de bord al proiectului încă deschis, faceți clic pe butonul "Afișați editorul asistent" în partea dreaptă sus a ferestrei Xcode pentru a afișa înregistrarea codului sursă pentru ViewController.h. Din această perspectivă, țineți apăsat butonul Control (CTRL) și butonul mouse-ului (butonul stâng al mouse-ului, dacă mouse-ul dvs. are două) peste obiectul butonului din scena Storyboard și trageți-l în lista cu cod sursă, chiar deasupra @Sfârșit linia.
Se va deschide o nouă casetă de dialog, care va crea automat o conexiune între elementul de interfață și clasa de vizualizare a controlerului. Din acest pop-up puteți crea puncte de vânzare sau acțiuni. Prizele sunt folosite pentru a crea proprietăți care fac referință la obiectele din interfața Builder și acțiunile sunt folosite pentru a conecta metode la acțiunile obiectului IB.
Selectați "Acțiune" din conexiune drop down, introduceți "showMessage" ca nume de conexiune, apoi faceți clic pe Conectare. Interfața Builder ar fi trebuit să adauge următoarea linie la dvs. ViewController.h fişier:
- (IBAction) showMessage: (id) expeditor;
în plus, ViewController.m ar trebui să aibă acum această definiție a metodei:
- (IBAction) showMessage: (id) expeditor
Atunci când utilizatorul pune butonul, codul din această metodă va fi executat. Asta inseamna ca suntem in sfarsit gata sa sapa codul pentru a afisa a UIAlertView și să răspundă metodelor delegaților săi!
Acum, când aveți setarea șablonului de proiect, sunteți gata să utilizați UIAlertView pentru a declanșa mesajul când apăsați butonul personalizat. Deschide ViewController.m fișier și introduceți următoarele în showMessage metoda pe care ați creat-o mai devreme:
- (IBAction) showMessage: (id) expeditor UIAlertView * message = [[UIAlertView alin] initWithTitle: @ "Hello World!" message: @ "Acesta este primul mesaj UIAlertview." delegat: nil cancelButtonTitle: @ "OK" altButtonTitle: nil]; [mesajul arată];
Mai sus, creați și inițializați instanța dvs. din clasa UIAlertView. initWithTitle: și mesaj: parametrii sunt explicabili și ușor de înțeles după ce au apărut o alertă afișată. delega: parametru se referă la ce clasă ar trebui să primească mesaje de notificare delegate pentru UIAlertViewDelegate (demonstrat mai târziu). cancelButton: parametru este butonul implicit care va fi afișat împreună cu alerta și otherButtonTitles: parametrul este utilizat pentru a afișa una sau mai multe opțiuni suplimentare pe care utilizatorul le poate selecta.
După crearea unui obiect de alertă, [mesajul arată] apelul ne arată mesajul prin afișarea noului nostru UIAlertView pe ecran.
Dacă construiți și depanați aplicația acum, veți vedea că atingerea butonului duce la afișarea mesajului nostru!
NOTĂ: Dacă nu se întâmplă nimic când atingeți butonul din simulator, asigurați-vă că ați salvat efectiv modificările pe care le-ați făcut în fișierul Storyboard și că acțiunea "Touch up inside" este conectată la showMessage: metodă.
Adăugarea de butoane suplimentare la UIAlertView se poate face fie atunci când inițializați obiectul sau oricând după. Pentru a adăuga butoane la momentul inițializării în codul de mai sus, modificați pur și simplu showMessage: astfel:
UIAlertView * message = [[UIAlertView aliniere] initWithTitle: @ "Hello World!" message: @ "Acesta este primul mesaj UIAlertview." delegat: nil cancelButtonTitle: @ "butonul 1" altButtonTitles: @ "butonul 2", "butonul 3", nil]; [mesajul arată];
Pentru a adăuga butoane după ce ați inițializat alerta, ați folosi următoarele rânduri de cod:
UIAlertView * message = [[UIAlertView aliniere] initWithTitle: @ "Hello World!" message: @ "Acesta este primul mesaj UIAlertview." delegat: nil cancelButtonTitle: @ "butonul 1" altButtonTitle: nil]; [mesaj addButtonWithTitle: @ "Butonul 2"]; [mesaj addButtonWithTitle: @ "Butonul 3"]; [mesajul arată];
Ambele fragmente de coduri sunt echivalente, dar folosind addButtonWithTitle: vă permite să adăugați condiționate butoanele la alertele dvs., probabil prin împachetarea acestora dacă declaraţii.
Reveniți la ViewController.h și modificați linia de declarație de clasă astfel:
@ interfață ViewController: UIViewController
Acest lucru permite clasa ta să răspundă la UIAlertViewDelegate metode de protocol. Pentru a răspunde la butoanele butonului din UIAlertView, vom folosi - alertView: clickedButtonAtIndex: metoda protocolului. Înapoi în ViewController.m, adăugați aceasta în clasa dvs .:
- (void) alertView: (UIAlertView *) alertView clickedButtonAtIndex: (NSInteger) buttonIndex
După cum puteți vedea din numele metodei, această metodă va accepta un pointer la UIAlertView obiect pe care l-am creat mai devreme și indexul de butoane selectat de utilizator. S-ar putea să fiți tentat să schimbați condiționat condiția variabilei buttonIndex pentru a determina ce buton a fost selectat de către utilizator, dar ce s-ar întâmpla dacă adăugați în mod condiționat butoane la alertă? În acest scenariu, butonul cu indexul 1 ar putea să nu fie întotdeauna cel dorit. O modalitate mult mai bună este de a testa împotriva titlului butonului și apoi să acționați în consecință, după cum urmează:
- (void) alertView: (UIAlertView *) alertView clicedButtonAtIndex: (NSInteger) buttonIndex NSString * title = [butonul alertViewTitleAtIndex: buttonIndex]; dacă [[title esteEqualToString: @ "Butonul 1"]) NSLog (@ "Butonul 1 a fost selectat."); altfel dacă [[title esteEqualToString: @ "Buton 2"]) NSLog (@ "Butonul 2 a fost selectat."); altfel dacă ([title esteEqualToString: @ "Button 3"]) NSLog (@ "Butonul 3 a fost selectat.");
Există încă un punct de trecere pe care trebuie să-l facem înainte ca acest lucru să funcționeze. Reveniți la instrucțiunea de inițiere UIAlertView și actualizați delega: parametru pentru a accepta de sine cuvânt cheie în loc de zero. După aceasta, blocul de coduri ar trebui să arate astfel:
UIAlertView * message = [[UIAlertView aliniere] initWithTitle: @ "Hello World!" message: @ "Acesta este primul mesaj UIAlertview." delegat: self cancelButtonTitle: @ "butonul 1" altButtonTitles: @ "butonul 2", "butonul 3", nil]; [mesajul arată];
Dacă creați și depanați aplicația acum, ar trebui să puteți selecta mai multe butoane și să vedeți o declarație imprimată în consola când este selectat un buton (aveți nevoie de ajutor pentru a găsi consola?) Selectați Vizualizare> Zona de depanare> Activare consola din meniul Xcode).
Aceasta ar trebui să arate arătat ultimul ecran de alertă în simulator:
Acest lucru încheie tutorialul nostru introductiv pe UIAlertView. În plus față de ceea ce am acoperit astăzi, există multe alte opțiuni oferite de UIAlertViewDelegate protocol și, odată cu lansarea iOS 5, câteva modalități suplimentare de utilizare UIAlertView. Dacă doriți să vedeți un tutorial suplimentar cu privire la aceste subiecte de afișare avansată a alertelor, anunțați-ne în secțiunea de comentarii de mai jos! De asemenea, nu ezitați să trimiteți întrebări sau comentarii prin intermediul fie personalului meu twitter @ markhammonds, fie oficialul Mobiletuts + twitter account @envatomobile.
Accentsconagua