iPhone SDK eerste stappen met JSON-gegevens met behulp van de Twitter API

Web-toegankelijke API's bieden een schat aan middelen om de functionaliteit van uw iPhone-apps uit te breiden. Deze API's worden meestal in twee primaire gegevensindelingen gebruikt: XML en JSON. De iPhone SDK heeft ingebouwde ondersteuning voor XML-parsen en dit wordt behandeld in een afzonderlijke zelfstudie. In deze zelfstudie concentreren we ons op het toevoegen van JSON-ondersteuning aan uw iOS-apps door te laten zien hoe u een Twitter-leesclient-app kunt maken.

Invoering

Het JSON Framework is een extreem populair raamwerk. Het wordt gebruikt om een ​​groot deel van de veelgebruikte apps in de App Store van stroom te voorzien, waaronder de Facebook-app, de Google Maps-app en vrijwel elke Twitter-client die er is.

Waarom JSON?

Er zijn een paar redenen om JSON te kiezen via XML. De primaire reden waarom JSON de voorkeur heeft, is omdat JSON-bestanden over het algemeen kleiner zijn in bestandsgrootte dan hun XML-tegenhangers, en dit resulteert uiteraard in minder laadtijd. Een andere reden die het overwegen waard is, is dat Apple's Push Notification-systeem het beste werkt met JSON-payloads.

1. Aan de slag

Een Xcode-project maken

  1. Maak een nieuw Xcode-project naar keuze. Ik ga de op schermen gebaseerde sjabloon gebruiken.
  2. Download hier het JSON Framework.

Het Framework toevoegen

Het toevoegen van het framework is eenvoudig. U hoeft alleen maar de bestanden naar uw project te slepen. Er is een optie om de bibliotheek aan uw project te koppelen, maar die optie is nu verouderd en wordt niet ondersteund.

  1. Sleep de JSON-map van de DMG en plaats deze in uw Xcode-project. U kunt het toevoegen aan de groep "Andere bronnen" als u dat wilt.
  2. Selecteer de optie 'Items naar bestemmingsgroep kopiëren' wanneer daarom wordt gevraagd.
  3. Toevoegen:
     #import "JSON.h" 

    in de bronbestanden waar u het framework gaat gebruiken.

2. Gebruik van de JSON-bibliotheek

Een voorbeeld JSON-bericht

Het volgende is een voorbeeld van een JSON-bericht dat aangeeft hoe een persoonsobject eruit zou kunnen zien:

 "firstName": "John", "lastName": "Smith", "age": 25, "address": "streetAddress": "21 2nd Street", "city": "New York", "state" : "NY", "postalCode": "10021", "phoneNumber": ["type": "home", "number": "212 555-1234", "type": "fax", " nummer ":" 646 555-4567 "] 

Een JSON-reeks parseren

Om het bovenstaande te ontleden, laden we eerst het JSON-bericht in een NSString:

 NSString * jsonString = [[NSString-toewijzing] initWithContentsOfFile: [[NSBundle mainBundle] pathForResource: @ "data" ofType: @ "json"] codering: NSUTF8StringEncoding-fout: & fout]; 

Als we naar het voorbeeld JSON-bericht kijken, kunnen we zien dat de gegevens zijn ingekapseld met beide haakjes (bijv. [] ) en beugels (bijv. ). De haakjes zijn arrays met gegevens en de accolades zijn de woordenboeken van gegevens. Zoals u kunt zien, kunnen we arrays van woordenboeken nesten en woordenboekobjecten kunnen arrays bevatten voor meerdere waarden.

In het bovenstaande voorbeeld hebben we een woordenboek voor contact met sleutels zoals voornaam, achternaam enz. De adrescode verwijst naar een ander woordenboek dat zijn eigen sleutel / waarde-paren bevat. De telefoonNummercode in het woordenboek bevat een reeks woordenboeken.

Om een ​​array te ontleden gebruiken we:

 NSArray * results = [jsonString JSONValue]; 

Om een ​​woordenboek te ontleden, gebruiken we:

 NSDictionary * dictionary = [jsonString JSONValue]; NSArray * -toetsen = [dictionary allKeys]; // de sleutels voor uw woordenboek 

Kies degene die je nodig hebt op basis van je root-object. Als uw API bijvoorbeeld een lijst met contactpersonen retourneert, krijgt u een matrix van contactwoordenboeken terug. Op dezelfde manier krijg je, als je om een ​​twittertijdlijn vraagt, een aantal tweets terug, waarbij elke tweet een woordenboek is.

Een JSON-reeks maken

Het maken van een JSON-reeks is heel eenvoudig en duidelijk. U maakt een NSDictionary met de juiste sleutels en waarden of een NSArray met de lijst met objecten. Dit proces lijkt redelijk op hoe we de JSON in de vorige stap hebben geparseerd.

U zou een woordenboek met uw gegevens maken.

 NSDictionary * contactData = [NSDictionary woordenboekWithObjectsAndKeys: _titleField.text, @ "title", _summaryField.text, @ "summary", _urlField.text, @ "url", _phoneField.text, @ "phone", _bdayField.text, @ " verjaardag ", _addrField.text, @" adres ", nul]; 

Voeg uw nieuw gemaakte gegevenswoordenboek toe aan zijn klasse

 NSDictionary * finalData = [NSDictionary woordenboekWithObject: contactData forKey: @ "contact"]; 

Genereer vervolgens de JSON-weergave van uw klassenwoordenboek.

 NSString * newJSON = [finalData JSONRepresentation]; 

U kunt uw arrays en nest-woordenboeken of arrays dienovereenkomstig ook maken.

Opmerking: er is geen methode in het JSON-framework die zal valideren of een bericht geldig is voor JSON.

3. Alles samenvoegen

Laten we een eenvoudige iPhone-app maken met een lijst van de laatste 5 tweets die mobtuts bevatten.

We gaan de Twitter Search API gebruiken voor eenvoud omdat het geen authenticatie of autorisatie vereist.

Een Tweet

De URL voor ons verzoek is:

 http://search.twitter.com/search.json?q=mobtuts&result_type=recent

Hiermee krijgt u een woordenboekresultaat terug dat een reeks tweets bevat.

Laten we ons concentreren op alleen de URL van het profiel van de gebruiker, de tekst van de tweet en de twitternaam van de gebruiker om het leven een beetje gemakkelijker te maken..

Een enkele resulterende tweet ziet er zo uit:

 "profile_image_url": "http://a3.twimg.com/profile_images/949941117/zucker_normal.jpg", "created_at": "Do, 10 Jun 2010 03:54:22 +0000", "from_user": "mariacarol "," metadata ": " result_type ":" recent "," to_user_id ": null," text ":" RT @mobtuts: installatie van Android 2.2 Froyo op iPhone http://bit.ly/c8kBb6 ", "id": 15824617764, "from_user_id": 311442, "geo": null, "iso_language_code": "en", "bron": "Seesmic",  "profile_image_url": "http://a1.twimg.com /profile_images/655595496/retro9_normal.gif","created_at":"Thu, 10 jun 2010 03:52:28 +0000 "," from_user ":" cead22 "," metadata ": " result_type ":" recent " , "to_user_id": null, "text": "Quiero un # iPhone4 con #FroYo - Hoe Android 2.2 Froyo op iPhone te installeren http://bit.ly/c8kBb6 (@mobtuts)", "id": 15824510273, "from_user_id": 34036310, "geo": null, "iso_language_code": "en", "source": "Twitter voor BlackBerry \ u00ae", "profile_image_url": "http://a1.twimg.com/profile_images /769690946/mobiletuts_icon_normal.png","created_at":"Thu, 10 jun 2010 03:45:51 +0000 "," from_user ":" mobtuts ", "metadata": "result_type": "recent", "to_user_id": null, "text": "Abonneer u nu op de wekelijkse podcast van @mobtuts! Kies RSS http://bit.ly/9LMbGX of iTunes http://bit.ly/bq0QMC","id":15824135971,"from_user_id":104427899,"geo":null,"iso_language_code":"nl ", "source": "HootSuite", "profile_image_url": "http://a1.twimg.com/profile_images/63581538/tutsplus_normal.jpg", "created_at": "Do, 10 Jun 2010 03:25:00 + 0000 "," from_user ":" tutsplus "," metadata ": " result_type ":" recent "," to_user_id ": null," text ":" Abonneer u nu op de wekelijkse podcast van @mobtuts! Kies RSS http://bit.ly/9LMbGX of iTunes http://bit.ly/bq0QMC","id":15822900558,"from_user_id":2295627,"geo":null,"iso_language_code":"nl ", "source": "TweetDeck", "profile_image_url": "http://a1.twimg.com/profile_images/234225566/illustration_normal.jpg", "created_at": "Do, 10 Jun 2010 03:22:33 + 0000 "," from_user ":" GreatTwitTips "," metadata ": " result_type ":" recent "," to_user_id ": null," text ":" RT @mobtuts: RT @berryizm_feeds: 5 BlackBerry Theme Developer Tips van MMMOOO een BlackBerry-thema en app dev comp ... http://bit.ly/agf0ND","id":15822755393,"from_user_id":19637346,"geo":null,"iso_language_code":"en","source ": "Twitter-feed" 

We kunnen zien dat we op zoek zijn naar de toetsen "profile_image_url", "from_user" en "text" voor onze app.

The Parser

Laten we een eenvoudige JSON Parser maken en de aanvraag van de API maken.

Twitter_SearchAppDelegate.h

 #importeren  @class Twitter_SearchViewController; @interface Twitter_SearchAppDelegate: NSObject  UIWindow * -venster; NSMutableData * responseData; Twitter_SearchViewController * viewController;  @property (niet-atomair, behouden) IBOutlet UIWindow * -venster; @property (nonatomic, retain) IBOutlet Twitter_SearchViewController * viewController; @einde 

Nu voegen we het JSON-framework toe aan de importstatements.

Twitter_SearchAppDelegate.m

 #import "JSON.h" 

Van hieruit wijzigen we de didFinishLaunchingWithOptions-methode in de App Delegate en maken we een NSURLRequest naar Twitter met de URL om de tweets te pakken die we willen verwerken. We zullen ook de App Afgevaardigde instellen als de afgevaardigde van de NSURLRequest.

 - (BOOL) -toepassing: (UIApplication *) -toepassing didFinishLaunchingWithOptions: (NSDictionary *) launchOptions // Negeerpunt voor aanpassen na het starten van de toepassing. // Voeg de weergave van de weergavecontroller toe aan het venster en op het scherm. responseData = [[NSMutableData-gegevens] behouden]; tweets = [NSMutableArray-array]; NSURLRequest * request = [NSURLRequest requestWithURL: [NSURL URLWithString: @ "http://search.twitter.com/search.json?q=mobtuts&rpp=5"]]; [[NSURLConnection alloc] initWithRequest: delegate aanvragen: self]; terugkeer JA;  

Nu, aangezien onze App-afgevaardigde de afgevaardigde van de NSURLRequest is, moeten we die afgevaardigde-methoden implementeren. We zijn vooral geïnteresseerd in een melding wanneer de gegevens naar ons worden verzonden en wanneer het verzoek is voltooid en er geen gegevens meer zijn om te ontvangen.

 #pragma mark NSURLConnection Delegate methods - (void) connection: (NSURLConnection *) connection didRiveResponse: (NSURLResponse *) response [responseData setLength: 0];  - (ongeldige) verbinding: (NSURLConnection *) verbinding didReceiveData: (NSData *) data [responseData appendData: data];  - (ongeldig) verbinding: (NSURLConnection *) verbinding didFailWithError: (NSError *) fout label.text = [NSString stringWithFormat: @ "Connection failed:% @", [error description]];  

Dit is waar onze parser het meeste werk doet. Het ontleedt het JSON-bestand en maakt de reeks tweets voor ons. We krijgen de array en geven deze door aan de TableViewController om deze weer te geven.

 - (ongeldig) connectionDidFinishLoading: (NSURLConnection *) -verbinding [connection release]; NSString * responseString = [[NSString-toewijzing] initWithData: responseData-codering: NSUTF8StringEncoding]; [responseData-release]; NSDictionary * results = [responseString JSONValue]; NSArray * allTweets = [resultaten objectForKey: @ "resultaten"]; [viewController setTweets: allTweets]; [window addSubview: viewController.view]; [window makeKeyAndVisible];  

Een eenvoudige tafelweergave

Nu gebruiken we gewoon de array die we hebben gemaakt van de parser om de gegevens in onze TableView weer te geven.

Twitter_SearchViewController.h

 #importeren  @interface Twitter_SearchViewController: UITableViewController NSArray * tweets; // dit is de array die aan ons is doorgegeven via de App Delegate @property (nonatomic, retain) NSArray * tweets; @einde 

TweetsTableViewController.m

In de controller moeten we eerst de property samenstellen en vervolgens het aantal rijen instellen dat we zullen weergeven

 @synthetiseer tweets; - (NSInteger) tableView: (UITableView *) tableView numberOfRowsInSection: (NSInteger) sectie // Retourneer het aantal rijen in de sectie. terug [aantal tweets];  

Ten slotte geven we de tweets weer door naar hun specifieke sleutels te verwijzen vanuit het woordenboek. Als we eerder naar de JSON-tekenreeks keken, weten we dat we op zoek zijn naar de waarden die zijn gekoppeld aan de toetsen "from_user", "profile_image_url" en "text".

 // Pas het uiterlijk van tabelweergavecellen aan. - (UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath static NSString * CellIdentifier = @ "Cell"; UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier: CellIdentifier]; if (cell == nil) cell = [[[UITableViewCell alloc] initWithStyle: UITableViewCellStyleSubtitle heruseIdentifier: CellIdentifier] autorelease];  // Configureer de cel ... NSDictionary * aTweet = [tweets objectAtIndex: [rij indexPath]]; cell.textLabel.text = [aTweet objectForKey: @ "text"]; cell.textLabel.adjustsFontSizeToFitWidth = YES; cell.textLabel.font = [UIFont systemFontOfSize: 12]; cell.textLabel.numberOfLines = 4; cell.textLabel.lineBreakMode = UILineBreakModeWordWrap; cell.detailTextLabel.text = [aTweet objectForKey: @ "from_user"]; NSURL * url = [NSURL URLWithString: [aTweet objectForKey: @ "profile_image_url"]]; NSData * data = [NSData dataWithContentsOfURL: url]; cell.imageView.image = [UIImage imageWithData: data]; cell.selectionStyle = UITableViewCellSelectionStyleNone; terugkeer cel;  

aanvullende overwegingen

Als u van plan bent om Three20 of httpriot te gebruiken, hoeft u het JSON-framework niet toe te voegen. Dat project neemt het al op in hun code. Als u van plan bent om ASIHTTPRequest te gebruiken, is het JSON-framework niet inbegrepen en moet u het zelf toevoegen.