Share
I denna handledning introduceras du till en av de vanligaste kakao-touch klasserna: UIAlertView. Med den här klassen kan du snabbt informera användare om viktig eller brådskande ansökningsinformation. Du kan också tvinga användaråterkoppling genom att kombinera UIAlertView-klassen med protokollet UIAlertViewDelegate. Läs vidare för att lära dig hur!
Skapa ett nytt Xcode-projekt med mallen "Enkel visningsprogram".
Namn ansökan "AlertDemo" och sätt in din egen företagsidentifierare eller använd "com.mobiletuts.alertdemo" om du inte har en ännu. Ställ in "iPhone" för enhetsfamiljen och behåll standardkontrollerna. När du är klar klickar du på Nästa.
Välj en plats på hårddisken för att lagra projektet och klicka sedan på "Spara".
När du har skapat ditt projekt, expandera mappen Supporting Files i rutan Projekt Navigator till vänster om Xcode-fönstret. CTRL + Klicka (eller högerklicka) i mappen Supporting Files och välj Lägg till> Ny grupp. Namn den nya gruppen "bilder" eftersom det är här vi ska lagra grafiken för vår ansökan.
Ladda ner projektresursfilen som bifogas denna handledning och öppna mappen "bilder". Dra och släpp alla bilderna i gruppen "bilder" du just skapat. Var noga med att kolla "Kopiera objekt till destinationsgruppens mapp (om det behövs)" eftersom detta kommer att se till att resurserna faktiskt kopieras till ditt projekt och inte bara kopplas till referenser. Din inställning i Xcode ska nu likna följande:
Hitta MainStoryboard.storyboard filen i Project Navigator och välj den. Du har just öppnat storyboardet för projektet, som ska bestå av en enda scen eller View Controller, som vi kan modifiera för att skapa gränssnittet för applikationen.
När Storyboard öppnas, ska Xcode-gränssnittet nu visa objektbiblioteket i nedre högra hörnet. Använd sökrutan för objektbiblioteket för att hitta en UIImageView objekt. Placera bildobjektet mitt på skärmen och ändra det manuellt för att fylla visningen. Därefter hittar du bild fält i attribut inspektören (attribut inspektören ska vara i högra delen av Xcode). Ställ in värdet för bildfältet till "background.png". Du borde nu ha en fin stålstruktur som fyller vykontrollen.
Använda Objektbiblioteket igen, hitta en UIButton objekt och dra sedan den knappen på scenen. Attributinspektören bör nu visa information för knappobjektet. Ställ in typ rulla ner fältet till "anpassade". Ställ sedan in bild fält till "button.png". Du ska nu se knappbilden på scenvynskontrollen, men det ser nog inte ut rätt. Med det markerade knappobjektet måste du välja Redaktör> Storlek för att passa innehåll för att automatiskt ändra storlek på knappens gränser till storleken på bildinnehållet. Därefter centrerar du knappen på skärmen genom att dra den mot mitten.
Du bör nu ha knappen konfigurerad korrekt för standardstatus, men vi vill visa en annan bild när knappen faktiskt trycks in. Ändra state config släpp ner värdet till "markerat". De ändringar som du gör i attributinspektören nu kommer bara att gälla för det markerade tillståndet. Ställ in bild attribut för den markerade knappstatus till knapp-pressed.png. Din Storyboard ska nu se ut så här:
Det här är en bra tid att testa dina framsteg, så spara ditt arbete ( Arkiv> Spara) och kör sedan projektet i iPhone-simulatorn (Produkt> Kör). Du ska nu kunna trycka på knappen och se bildändringen i simulatorn.
När projekthistorikpanelen fortfarande är öppen klickar du på knappen "Visa assistentredigeraren" längst upp till höger om Xcode-fönstret för att visa källkodslistan för ViewController.h. Håll i så fall både Control (CTRL) -knappen och musknappen (vänster musknapp om musen har två) över knappobjektet i Storyboard-scenen och dra sedan in i källkodslistan, precis ovanför @slutet linje.
En ny dialogruta öppnas som automatiskt skapar en anslutning mellan gränssnittselementet och din klasskontroll för visning. Från den här popupen kan du skapa butiker eller åtgärder. Outlets används för att skapa egenskaper som refererar till dina gränssnittsbyggareobjekt, och åtgärder används för att ansluta metoder till IB-objektåtgärder.
Välj "Åtgärd" från förbindelse drop down, skriv "showMessage" som anslutningsnamn och klicka sedan på Connect. Gränssnittsbyggare borde bara ha lagt till följande rad i din ViewController.h fil:
- (IBAction) showMessage: (id) avsändare;
För övrigt, ViewController.m bör nu ha denna metoddefinition:
- (IBAction) showMessage: (id) avsändare
När användaren knackar på knappen, kommer koden i den här metoden att köras. Det betyder att vi äntligen är redo att gräva in i koden för att visa en UIAlertView och svara på sina delegerade metoder!
Nu när du har inställt projektmallar är du redo att använda UIAlertView för att utlösa ditt meddelande när du trycker på den anpassade knappen. Öppna ViewController.m fil och skriv följande i showMessage metod du skapade tidigare:
- (IBAction) showMessage: (id) avsändare UIAlertView * message = [[UIAlertView alloc] initWithTitle: @ "Hello World!" meddelande: @ "Detta är ditt första UIAlertview-meddelande." delegera: noll cancelButtonTitle: @ "OK" otherButtonTitles: nil]; [meddelandevisning];
Ovan skapar och initierar du din förekomst av UIAlertView-klassen. De initWithTitle: och meddelande: Parametrarna är självförklarande och lättförståliga efter att ha visat en varning visas. De delegera: Parameter hänvisar till vilken klass som ska få meddelanden för delegerade meddelanden för UIAlertViewDelegate (visat senare). De cancelButton: parametern är standardknappen som ska visas tillsammans med varningen och otherButtonTitles: Parametern används för att visa ett eller flera ytterligare alternativ som användaren kan välja.
Efter att ha skapat ett varningsobjekt, [meddelandevisning] samtal visar faktiskt vårt budskap genom att poppa vår nya UIAlertView på skärmen.
Om du bygger och debugger programmet nu ser du att knacka på knappen resulterar i att vårt meddelande visas!
OBS! Om ingenting händer när du trycker på knappen i simulatorn, se till att du faktiskt har sparat de ändringar du gjort i Storyboard-filen och att "Touch up inside" -åtgärden är ansluten till showMessage: metod.
Lägga till ytterligare knappar till en UIAlertView kan göras antingen när du initierar ditt objekt eller när som helst efter. För att lägga till knappar vid initialiseringstid i koden ovan, skulle du helt enkelt ändra showMessage: metod som så:
UIAlertView * message = [[UIAlertView alloc] initWithTitle: @ "Hello World!" meddelande: @ "Detta är ditt första UIAlertview-meddelande." delegera: noll cancelButtonTitle: @ "Button 1" otherButtonTitles: @ "Button 2", @ "Button 3", noll]; [meddelandevisning];
För att lägga till knappar efter att ha initierat din varning, skulle du använda följande rader av kod:
UIAlertView * message = [[UIAlertView alloc] initWithTitle: @ "Hello World!" meddelande: @ "Detta är ditt första UIAlertview-meddelande." delegera: noll cancelButtonTitle: @ "Button 1" otherButtonTitles: nil]; [meddelande addButtonWithTitle: @ "Button 2"]; [meddelande addButtonWithTitle: @ "Button 3"]; [meddelandevisning];
Båda dessa kodfragment är ekvivalenta men med användning av addButtonWithTitle: Metoden gör att det är enkelt att villkorligt lägga till knappar på dina varningar, kanske genom att förpacka dem om uttalanden.
Växla tillbaka till ViewController.h och ändra din klassdeklarationslinje för att läsa enligt följande:
@interface ViewController: UIViewController
Detta gör det möjligt för din klass att svara på UIAlertViewDelegate protokollmetoder. För att kunna svara på knapptryckningar i vår UIAlertView, vi kommer att använda - alertView: clickedButtonAtIndex: protokollmetod. Tillbaka in ViewController.m, lägg till detta i din klass:
- (void) alertView: (UIAlertView *) alertVisa clickedButtonAtIndex: (NSInteger) buttonIndex
Som du kan se från metodnamnet, accepterar den här metoden en pekare till UIAlertView objekt som vi skapade tidigare och det knappindex som valts av användaren. Du kan bli frestad att bara byta villkorligt på knappenIndex-variabeln för att bestämma vilken knapp som valdes av användaren, men vad skulle hända om du skickat villkor på ett villkorligt sätt? I det här fallet kan inte knappen med index 1 vara den du vill ha. Ett mycket bättre sätt är att testa mot titeln på knappen och agera därefter i enlighet med det här:
- (void) alertView: (UIAlertView *) alertVisa clickedButtonAtIndex: (NSInteger) buttonIndex NSString * title = [alertView buttonTitleAtIndex: buttonIndex]; om ([title isEqualToString: @ "Button 1"]) NSLog (@ "Button 1 valdes."); annars om ([title isEqualToString: @ "Button 2"]) NSLog (@ "Button 2 valdes."); annars om ([titel isEqualToString: @ "Button 3"]) NSLog (@ "Knapp 3 valdes.");
Det finns ytterligare en tweak som vi måste göra innan det kommer att fungera. Gå tillbaka till UIAlertView-initialiseringsutskottet och uppdatera delegera: parameter för att acceptera själv sökord istället för noll. Efter detta ska kodblocket se ut så här:
UIAlertView * message = [[UIAlertView alloc] initWithTitle: @ "Hello World!" meddelande: @ "Detta är ditt första UIAlertview-meddelande." delegera: self cancelButtonTitle: @ "Button 1" otherButtonTitles: @ "Button 2", @ "Button 3", noll]; [meddelandevisning];
Om du bygger och debugger programmet nu borde du kunna välja flera knappar och se ett uttalande skriv ut till konsolen när en knapp har valts (behöver hjälp med att hitta konsolen? Välj Visa> Felsökningsområde> Aktivera konsol från Xcode-menyn).
Det här är vad den slutgiltiga vyn ska se ut i simulatorn:
Detta avslutar vår inledande handledning om UIAlertView. Förutom vad vi täckte idag finns det många andra alternativ som tillhandahålls av UIAlertViewDelegate protokoll och, med frisläppandet av iOS 5, några ytterligare sätt att använda UIAlertView. Om du vill se en ytterligare handledning om dessa avancerade varningssynsunderlägg, låt mig veta i kommentarfältet nedan! Också gärna skicka in frågor eller kommentarer via antingen min personliga Twitter @ Markhammer eller den officiella Mobiletuts + Twitter konto @envatomobile.
Accentsconagua