Share
Als Loren Brichter vor einigen Jahren in Tweetie 2 die Idee des "Ziehens zum Aktualisieren" vorstellte, dauerte es nicht lange, bis die Entwickler dieses geniale und intuitive Konzept übernahmen. Obwohl Twitter nun das Patent für das "Pull to Refresh" - Konzept besitzt, hat dies Apple nicht daran gehindert, das Internet einzuführen UIRefreshControl Klasse in iOS 6. Dieses neue UIControl Die Unterklasse macht es einfach, jedem Table-View-Controller in iOS 6 ein Steuerelement zum Ziehen zum Aktualisieren hinzuzufügen.
Die Klassenreferenz von UIRefreshControl ist kurz und zeigt, wie einfach es ist, mit dieser Erweiterung des UIKit-Frameworks zu beginnen. Das UIRefreshControl Klasse stammt direkt ab UIControl, was bedeutet, dass eine Instanz von UIRefreshControl unterscheidet sich nicht wesentlich von der Erstellung und Konfiguration anderer UIKit-Steuerelemente. Nach dem Instanziieren einer Instanz von UIRefreshControl Klasse, ordnen Sie es dem neuen zu refreshControl Eigenschaft eines Table View Controller-Objekts (UITableViewController oder eine Unterklasse davon). Der Table View Controller sorgt für die korrekte Positionierung und Anzeige der Aktualisierungssteuerung. Wie bei jedem anderen UIControl In dieser Unterklasse hängen Sie ein Ziel-Aktions-Paar an ein bestimmtes Ereignis an, UIControlEventValueChanged Im Falle von UIRefreshControl.
Dies wäre kein Mobiletuts + Tutorial ohne ein Beispiel, das zeigt, wie man das verwendet UIRefreshControl Klasse in einem Projekt. Im Rest dieses Lernprogramms werde ich Ihnen zeigen, wie Sie eine Tabellenansicht mit einer Liste von Tweets füllen, die aus der Twitter-Such-API gezogen wurden. Die Anforderung wird an die Such-API von Twitter gesendet, wenn der Benutzer die Tabellensicht dow: pull-to-refresh zieht.
Die Anwendung, die wir gerade erstellen, fragt die Twitter-Such-API nach Tweets ab iOS Entwicklung. Die Anforderung wird an die Such-API von Twitter gesendet, wenn der Benutzer die Tabellenansicht herunterzieht und die Aktualisierungssteuerung anzeigt. Wir werden die fantastische AFNetworking-Bibliothek verwenden, um unsere Anfrage an die Twitter-Such-API zu senden. AFNetworking hilft uns auch, Profilbilder asynchron herunterzuladen und anzuzeigen.
Erstellen Sie ein neues Projekt in Xcode, indem Sie das auswählen Leere Anwendung Vorlage aus der Liste der Vorlagen (Abbildung 1). Benennen Sie Ihre Bewerbung Pull-to-Refresh, Geben Sie eine Firmenkennung ein iPhone für die Gerätefamilie und überprüfen Sie Verwenden Sie die automatische Referenzzählung. Die übrigen Kontrollkästchen können für dieses Projekt deaktiviert bleiben (Abbildung 2). Teilen Sie Xcode mit, wo Sie das Projekt speichern möchten, und drücken Sie die Erstellen Taste.
Die Installation von AFNetworking mit Cocoapods ist ein Kinderspiel. In diesem Tutorial zeige ich Ihnen jedoch, wie Sie die AFNetworking-Bibliothek manuell zu einem Xcode-Projekt hinzufügen, um sicherzustellen, dass wir uns alle auf derselben Seite befinden. Es ist sowieso nicht so schwierig.
Laden Sie die neueste stabile Version der Bibliothek von der GitHub-Projektseite herunter, extrahieren Sie das Archiv und ziehen Sie den Ordner mit dem Namen AFNetworking zu Ihrem Xcode-Projekt. Stellen Sie sicher, dass das Kontrollkästchen markiert ist Elemente in den Ordner der Zielgruppe kopieren (falls erforderlich) wird geprüft und überprüft, ob die Bibliothek dem hinzugefügt wird Pull-to-Refresh Ziel (Abbildung 3).
Die AFNetworking-Bibliothek basiert auf zwei Frameworks, mit denen ein neues Xcode-Projekt standardmäßig nicht verknüpft ist, und zwar (1) mit den Systemkonfigurations- und (2) Mobile Core Services-Frameworks. Wählen Sie Ihr Projekt in der Projektnavigator, wählen Sie das Zum Aktualisieren ziehen Ziel aus der Liste der Ziele und öffnen Sie die Baue Phasen Tab oben. Erweitere die Binäres mit Bibliotheken verknüpfen Schublade und fügen Sie beide Frameworks hinzu, indem Sie auf das Pluszeichen klicken (Abbildung 4).
Fügen Sie der vorkompilierten Headerdatei des Projekts eine Importanweisung für beide Frameworks sowie AFNetworking hinzu (siehe nachstehender Ausschnitt). Dies erleichtert die Arbeit mit AFNetworking, da wir nicht zu jeder Klasse, die die Bibliothek verwenden soll, eine Importanweisung hinzufügen müssen.
// // Präfix-Header für alle Quelldateien des Ziels "Ziehen zum Aktualisieren" im Projekt "Ziehen zum Aktualisieren" // #Import#ifndef __IPHONE_3_0 #warning "Dieses Projekt verwendet Funktionen, die nur in iOS SDK 3.0 und höher verfügbar sind." #endif #ifdef __OBJC__ #import #einführen #einführen #einführen #import "AFNetworking.h" #endif
Das UIRefreshControl ist entworfen, um in Verbindung mit einem Table View Controller-Objekt zu arbeiten. Erstelle eine neue UITableViewController Unterklasse (Datei> Neu> Datei… ) durch die Wahl der Ziel-C-Klasse Vorlage aus der Liste der Vorlagen (Abbildung 5). Geben Sie der neuen Klasse einen Namen MTTweetsViewController und vergewissern Sie sich, dass es sich um ein UITableViewController Unterklasse. Sagen Sie Xcode, dass es keine Nib-Datei für die neue Controller-Klasse erstellen soll, indem Sie das Kontrollkästchen mit der Markierung deaktivieren Mit XIB für die Benutzeroberfläche (6). Geben Sie einen Speicherort für die neue Klasse an und klicken Sie auf Erstellen Taste.
Bevor wir das Refresh-Steuerelement zum Table View-Controller hinzufügen können, müssen wir eine Instanz des Neuen instanziieren MTTweetsViewController Klasse. Aktualisieren Sie die Anwendung: didFinishLaunchingWithOptions: Methode in MTAppDelegate.m Wie nachfolgend dargestellt. Die Implementierung sollte keine Überraschungen bereiten. Wir initialisieren eine Instanz von MTTweetsViewController Klasse und legen Sie es als Root-View-Controller des Anwendungsfensters fest. Vergessen Sie nicht, oben eine Import-Anweisung hinzuzufügen MTAppDelegate.m um die Header-Datei des zu importieren MTTweetsViewController Klasse.
- (BOOL) -Anwendung: (UIApplication *) -Anwendung didFinishLaunchingWithOptions: (NSDictionary *) launchOptions // Initialisieren Sie den Tweet View Controller MTTweetsViewController * vc = [[MTTweetsViewController alloc] initWithStyle: UITableViewStylePlain]; // Fenster initialisieren self.window = [[UIWindow-Zuordnung] initWithFrame: [[UIScreen-MainScreen] -Begrenzungen]]; // Fenster konfigurieren [self.window setBackgroundColor: [UIColor whiteColor]]; [self.window setRootViewController: vc]; // Schlüssel und Sichtbar machen [self.window makeKeyAndVisible]; JA zurückgeben;
#import "MTTweetsViewController.h"
Wenn Sie die Anwendung im iPhone Simulator ausführen, sollte eine leere Tabellenansicht angezeigt werden. Die Auffrischungssteuerung wird im hinzugefügt viewDidLoad Methode des Tweets-View-Controllers. Wie bereits erwähnt, ist das Hinzufügen einer Aktualisierungssteuerung sehr einfach. Schauen Sie sich die Implementierung des viewDidLoad Methode unten gezeigt. Wir initialisieren die Aktualisierungssteuerung und fügen ein Ziel und eine Aktion für die hinzu UIControlEventValueChanged Ereignis der Aktualisierungssteuerung. Schließlich wird die Auffrischungssteuerung dem zugewiesen refreshControl Eigenschaft des Table View-Controllers. Natürlich die refreshControl Eigenschaft ist auch neu für iOS 6.
- (void) viewDidLoad [super viewDidLoad]; // Initialize Refresh Control UIRefreshControl * refreshControl = [[UIRefreshControl Allocation] init]; // Refresh-Steuerelement konfigurieren [refreshControl addTarget: Selbstaktion: @selector (Refresh :) forControlEvents: UIControlEventValueChanged]; // View Controller konfigurieren [self setRefreshControl: refreshControl];
Bevor wir das Projekt erneut erstellen und ausführen, müssen wir das implementieren Aktualisierung: Aktion in der Implementierungsdatei des View-Controllers. Um zu überprüfen, ob alles ordnungsgemäß eingerichtet ist, protokollieren wir einfach eine Nachricht an der Konsole. Erstellen Sie das Projekt, und führen Sie es aus, um die Aktualisierungssteuerung in Aktion anzuzeigen.
- (void) refresh: (id) sender NSLog (@ "Refreshing");
Sie werden feststellen, dass die Aktualisierungssteuerung nicht verschwindet, nachdem sie vom Table View-Controller angezeigt wurde. Das müssen Sie selbst tun. Die Idee hinter der Auffrischungssteuerung ähnelt in gewisser Weise der Aktivitätsanzeige des UIKit (UIActivityIndicatorView), das heißt, Sie sind dafür verantwortlich, es zu zeigen und zu verbergen. Das Ausblenden der Aktualisierungssteuerung ist so einfach wie das Senden einer Nachricht von endRefreshing. Aktualisieren Sie die Aktualisierung: Aktion wie unten gezeigt und führen Sie die Anwendung erneut im iPhone Simulator aus.
- (void) refresh: (id) sender NSLog (@ "Refreshing"); // End Refreshing [(UIRefreshControl *) Sender endRefreshing];
Das Aktualisierungssteuerelement wird sofort nach dem Freigeben der Tabellenansicht ausgeblendet. Dies macht die Aktualisierungssteuerung natürlich völlig unbrauchbar. Wir werden eine Anfrage an die Twitter-Such-API senden und die Aktualisierungssteuerung ausblenden, wenn wir eine Antwort erhalten haben (oder wenn die Anfrage abgelaufen ist). AFNetworking macht dies sehr einfach.
Die Tweets, die wir von der Twitter-Such-API erhalten, werden in einem Array gespeichert. Fügen Sie eine private Eigenschaft namens hinzu Tweets zum MTTweetsViewController Klasse wie unten gezeigt.
#import "MTTweetsViewController.h" @interface MTTweetsViewController () @property (stark, nicht atomar) NSArray * Tweets; @Ende
Als nächstes aktualisieren Sie die numberOfSectionsInTableView:, tableView: numberOfRowsInSection:, und tableView: cellForRowAtIndexPath: Methoden wie unten gezeigt. Wenn Sie zuvor mit Tabellenansichten gearbeitet haben, sollte dies nicht zu schwer zu verstehen sein.
- (NSInteger) numberOfSectionsInTableView: (UITableView *) tableView return self.tweets? 1: 0;
- (NSInteger) tableView: (UITableView *) tableView numberOfRowsInSection: (NSInteger) Abschnitt return [self.tweets count]? [self.tweets count]: 0;
- (UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath statischer NSString * CellIdentifier = @ "Cell Identifier"; UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier: CellIdentifier]; if (! cell) cell = [[UITableViewCell-Zuordnung] initWithStyle: UITableViewCellStyleSubtitle reuseIdentifier: CellIdentifier]; // Tweet NSDictionary abrufen * tweet = [self.tweets objectAtIndex: [indexPath-Zeile]]; // Zelle konfigurieren [cell.textLabel setText: [Tweet objectForKey: @ "text"]]; [cell.detailTextLabel setText: [tweet objectForKey: @ "from_user"]]; // Profilbild asynchron herunterladen NSURL * url = [NSURL URLWithString: [Tweet objectForKey: @ "profile_image_url"]]; [cell.imageView setImageWithURL: url placeholderImage: [UIImage imageNamed: @ "Platzhalter"]]; zurück Zelle;
Im tableView: cellForRowAtIndexPath:, Wir erstellen eine neue Zelle (oder entreißen eine wiederverwendbare Zelle) und füllen sie mit dem Inhalt eines Tweets. Um sicherzustellen, dass die Tabellenansicht reibungslos durchläuft, laden wir das Profilbild des Benutzers asynchron herunter. Mit AFNetworking ist dies sehr einfach zu bewerkstelligen setImageWithURL: placeholderImage:. Dies bedeutet, dass die Bildansicht der Zelle mit dem bereitgestellten Platzhalterbild festgelegt wird, während das Profilbild des Benutzers im Hintergrund angefordert wird. Damit dies funktioniert, fügen Sie hinzu placeholder.png und [email protected] zu Ihrem Xcode-Projekt. Sie finden beide Dateien in den Quelldateien dieses Lernprogramms.
Wir senden unsere Anfrage an die Twitter Search API in der Aktualisierung: Aktion. Sehen Sie sich unten die aktualisierte Implementierung an. Ich werde nicht auf die Details eingehen wie AFJSONRequestOperation Klasse funktioniert in diesem Tutorial, aber ich möchte erklären, wie der Fluss der Anforderung funktioniert. Nach Angabe der Anforderungs-URL (NSURL) und Initialisieren der URL-Anfrage (NSURLAnfrage) erstellen wir eine JSON-Anforderungsoperation, indem wir (1) die URL-Anforderung, (2) einen Erfolgsblock und (3) einen Fehlerblock an übergeben JSONRequestOperationWithRequest: Erfolg: Fehler:. Der Erfolgsbaustein wird ausgeführt, wenn die Anforderung erfolgreich war, und gibt uns die Antwort der Anforderung als Instanz von NSDictionary. Wir extrahieren das angeforderte Array von Tweets und aktualisieren das Tweets Laden Sie die Tabellenansicht erneut, um die Tweets anzuzeigen, und blenden Sie die Aktualisierungssteuerung aus, indem Sie ihr eine Nachricht senden endRefreshing.
- (void) refresh: (id) sender // URL erstellen NSURL * url = [NSURL URLWithString: @ "http://search.twitter.com/search.json?q=ios%20development&rpp=100&include_entities=true&result_type=mixed/ "]; // URL-Anfrage initialisieren NSURLRequest * urlRequest = [[NSURLRequest Allocation] initWithURL: url]; // JSON-Anforderungsvorgang AFJSONRequestOperation * operation = [AFJSONRequestOperation JSONRequestOperationWithRequest: urlRequest-Erfolg: ^ (NSURLRequest * -Anforderung, NSHTTPURLResponse * -Antwort, ID JSON) NSArray * Ergebnisse = [(NSDray). if ([Anzahl der Ergebnisse]) self.tweets = Ergebnisse; // Reload Table View [self.tableView reloadData]; // End Refreshing [(UIRefreshControl *) Sender endRefreshing]; failure: ^ (NSURLRequest * -Anforderung, NSHTTPURLResponse * -Antwort, NSError * -Fehler, id JSON) // End Refreshing [(UIRefreshControl *) sender endRefreshing]; ]; // Operation starten [Operation starten];
Wenn die Anforderung fehlschlägt, blenden wir nur die Aktualisierungssteuerung aus. Natürlich wäre es besser, den Benutzer darüber zu informieren, dass die Anforderung fehlgeschlagen ist. Dies ist jedoch in unserem Beispiel der Fall. Wir senden die Anfrage, indem wir die JSON-Anfrage am Ende von starten Aktualisierung: Aktion.
Erstellen Sie das Projekt erneut, und führen Sie es erneut aus, um die Beispielanwendung in Aktion zu sehen. Wenn die Profilbilder nicht korrekt angezeigt werden, überprüfen Sie noch einmal, ob Sie die bereits erwähnten Platzhalterbilder zu Ihrem Projekt hinzugefügt haben.
Es gibt viele Bibliotheken, die versuchen, die ursprüngliche "Pull to Refresh" -Funktion zu simulieren, aber es ist schön zu sehen, dass Apple dieses ordentliche Konzept endlich angenommen und in das UIKit-Framework aufgenommen hat. Wie Sie vielleicht schon bemerkt haben, hat Apple in iOS 6 bereits die Version von Apple eingestellt UIRefreshControl Klasse, die in einigen eigenen Anwendungen verwendet werden soll, z. B. in der Anwendung Podcasts.
Accentsconagua