Share
Acest tutorial vă va învăța cum să utilizați iOS 6 SDK și Social Framework pentru a încărca conținut dinamic de pe Twitter. Pentru a face acest lucru, vă voi învăța cum să creați un profil Twitter care generează o aplicație. Citește mai departe!
Deschideți Xcode și selectați "Creați un nou proiect Xcode". Selectați "Empty Application" și faceți clic pe "Next". Introduceți un nume pentru proiectul dvs. (denumit "Profil Twitter"), asigurați-vă că selectați iPhone pentru dispozitiv, apoi selectați toate casetele de selectare, cu excepția casetei de selectare Utilizare date de bază. Apoi faceți clic pe "Next" și alegeți un loc pentru a salva proiectul înainte de a da clic pe "create".
Vrem doar să folosim această aplicație în modul portret, așa că mergeți la secțiunea Orientările interfeței suportate și deselectați orientările peisajului.
Va trebui să adăugăm trei cadre în proiectul nostru: Cadrul Social pentru a face cererea, Cadrul de conturi să utilizeze contul de utilizator al utilizatorului și Cadrul QuartzCore pentru a personaliza interfața noastră puțin.
Accesați fila "Construiți fazele" și extindeți opțiunea "Link Binary With Libraries". Faceți clic pe butonul "+" pentru a adăuga un nou Cadru. Introduceți "Social" în caseta de căutare și selectați Social.framework care apare în listă. Faceți clic pe "Adăugați" pentru a include acest cadru în faza de conectare a proiectului dvs. Faceți același lucru pentru cadrele Conturi și QuartzCore introducând "Conturi" și "QuartzCore" în caseta de căutare.
Accesați "Fișier"> "Nou"> "Fișier ..." sau apăsați ⌘N pentru a crea un fișier nou. Accesați secțiunea "Utilizare interfață", selectați "Storyboard" și faceți clic pe "Next". Asigurați-vă că familia de dispozitive este setată pe iPhone și faceți din nou clic pe "Next". MainStoryboard și faceți clic pe "Creați".
Acum trebuie să conectăm Storyboard la proiectul nostru. Selectați numele proiectului din meniul Navigator al Xcode și selectați țintă actuală (în cazul nostru "Profil Twitter"). Apoi, selectați fila "Summery" și accesați secțiunea "Info despre iPhone / iPad de implementare". Odată ajuns acolo, selectați Storyboard numit "MainStoryboard" pentru Storyboard.
Ultimul lucru pe care trebuie să-l facem pentru a face munca noastră în scenă este schimbarea aplicație: didFinishLaunchWithOptions: , deschideți astfel AppDelegate.m și modificați metoda după cum urmează:
- (BOOL): aplicație (UIApplication *) didFinishLaunchingWithOptions: (NSDictionary *) launchOptions return YES;
Deschideți Storyboard și trageți un controler de navigare de la Biblioteca de obiecte pe pânză. Selectați controlerul de vizualizare de tabelă conectat la Controlorul de navigare și ștergeți-l. Acum glisați un controler de vizualizare de la Biblioteca de obiecte pe pânză. Trageți CTRL de la controlerul de navigare la controlerul de vizualizare și selectați "controler de vizualizare rădăcină" din meniul pop-up. Selectați controlerul de navigare, deschideți Inspectorul de fișiere și apoi deselectați opțiunea "Utilizați oprirea automată", deoarece nu vom folosi această nouă funcție pentru aplicația noastră. În sfârșit, faceți dublu clic pe bara de navigare a controlerului de vizualizare pe care tocmai l-am creat și introduceți numele de utilizator ca titlu.
Acum, selectați un câmp text din Biblioteca de obiecte și adăugați-l la controlerul de vizualizare. Selectați câmpul Text și deschideți Inspectorul atributelor. Introduceți "Nume de utilizator" ca substituent și asigurați-vă că selectați opțiunea "Ștergeți când începe editarea". Apoi, apuca un buton din Biblioteca de obiecte, adaugă-l la controlerul de vizualizare și schimbă titlul în "Show Info".
În sfârșit, asigurați-vă că aranjați câmpul Text și butonul după cum urmează:
De asemenea, avem nevoie de un ecran pentru a afișa profilul Twitter, așa că trageți un nou Controler de vizualizare din Biblioteca Obiectelor în panza. CTRL trageți de la butonul "Afișați informații" la controlerul de vizualizare și selectați "push" din meniul pop-up. Apoi, faceți dublu clic pe bara de navigare a celui de-al doilea controler de vizualizare și introduceți "Profil" ca titlu.
Vom avea nevoie de o mulțime de etichete și de anumite imagini pe acest ecran pentru a afișa informațiile despre profil. Mai întâi, adăugați o vizualizare a imaginii la controlerul de vizualizare a profilului și asigurați-vă că o aliniați spre partea de sus. Apoi, deschideți Inspectorul de mărime și dați-i o dimensiune de 320 x 160 pixeli. De asemenea, modificați autorezonarea după cum urmează:
Adăugați o altă imagine pe partea superioară a celei anterioare. Mergeți la Inspectorul de mărime și modificați mărimea, coordonatele și configurarea automată după cum urmează:
Acum vom adăuga etichete pentru a afișa numele și numele de utilizator. Glisați o etichetă în partea de sus a celei mai mari imagini pentru banner. Deschideți Inspectorul de mărime și modificați mărimea, coordonatele și configurarea automată după cum urmează:
Apoi deschideți Inspectorul de atribute și introduceți "Nume" pentru textul etichetei. Modificați culoarea în alb, faceți fontul Bold și setați alinierea la centru. În sfârșit, vom adăuga o umbră la această etichetă. Setați dispunerea verticală a umbrei la 1, astfel că umbra va apărea sub text. Faceți clic pe Culoarea umbrei și faceți culoarea neagră cu 75% opacitate.
Această etichetă a fost pentru numele, dar avem nevoie și de o etichetă pentru numele de utilizator, deci selectați eticheta pe care tocmai am creat-o și apăsați ⌘C ⌘V pentru ao copia și lipi. Modificați textul la "@username" și schimbați coordonatele X și Y la 20 și 120. De asemenea, dorim să facem acest font un pic mai mic, deschideți astfel Inspectorul atributelor și modificați dimensiunea fontului la 14.
De asemenea, avem nevoie de șase etichete suplimentare pentru a arăta cantitatea de tweets, adepți și persoane care urmează. Din fericire pentru noi, trebuie doar să adăugăm două și să copiem și să lipim celelalte patru. Adăugați o nouă etichetă la controlerul de vizualizare, lățimea de 74 de pixeli, modificați coordonatele X și Y la 20 și 168. Introduceți "0" ca text pentru această etichetă. Apoi, adăugați o nouă etichetă, de asemenea, o lățime de 74 de pixeli, dar de această dată schimbați coordonatele X și Y la 20 și 190. Deschideți Inspectorul atributelor și dați etichetei o culoare gri deschis. De asemenea, modificați textul la "Tweets".
Selectați ambele etichete pe care tocmai le-am creat și ALT le trageți în centru. Astfel vom crea o copie a celor două etichete. ALT trageți din nou, dar de data aceasta aliniați etichetele spre dreapta. Acum am creat aceste șase etichete destul de repede. Schimbați textul etichetei centrale la "Urmăriți" și textul etichetei corecte la "Următorii".
Ultimul lucru pe care va trebui să-l adăugăm la interfața noastră este un Text View pentru a afișa ultimul mesaj tweet al unui utilizator, astfel că trageți o vizualizare de text din Biblioteca de obiecte în partea inferioară a controlerului de vizualizare. Deschideți Inspectorul de mărime și modificați mărimea, coordonatele și configurarea automată după cum urmează:
Cu aceste opțiuni, aplicația noastră va arăta bine pe un iPhone 5, dar și pe un iPhone mai vechi 4. Puteți previzualiza Storyboard într-o setare de ecran de 3.5 "prin apăsarea acestui buton din dreapta jos:
Acum, deschideți Inspectorul de atribute și eliminați textul Vizualizării textului. De asemenea, asigurați-vă că deselectați opțiunea Editable.
Interfața ar trebui să pară acum:
Acum că am terminat interfața noastră, cred că este un moment bun pentru a testa aplicația noastră. Faceți clic pe Construiți și executați sau apăsați ⌘R pentru a testa aplicația. Aplicația ar trebui să prezinte un simplu controler de navigare cu un câmp de text și un buton. Dacă atingeți butonul, ar trebui să vedeți pagina profilului pe care tocmai l-am creat. Numele și numele de utilizator nu sunt ușor de citit, dar vom avea grijă de asta mai târziu.
Accesați "Fișier"> "Nou"> "Fișier ..." pentru a crea un fișier nou. Selectați "Class-Objective-C" și faceți clic pe "Next". Introduceți "UsernameViewController" pentru clasă și asigurați-vă că este o subclasă de UIViewController și că ambele casete de selectare nu sunt selectate. Dați clic din nou pe "Următorul" și apoi faceți clic pe "Creați".
Deschideți UserViewController.h și modificați codul după cum urmează:
#import@interface Nume utilizatorViewController: UIViewController IBOutlet UITextField * usernameTextfield; @Sfârșit
Aici vom crea doar o priză simplă pentru câmpul nostru de text, pe care îl vom folosi pentru a transmite numele de utilizator introdus pe pagina de profil.
Apoi deschideți Storyboard din nou și selectați numele de utilizator View Controler. Deschideți Inspectorul de Identitate și schimbați Clasa la UserViewController pe care tocmai l-am creat. După aceea, deschideți Inspectorul de conectări și conectați priza de nume de utilizator cu câmpul de text.
Acum deschideți UserViewController.m și adăugați următoarea linie sub #import "UsernameViewController.h":
#import "ProfileViewController.h"
Aici vom importa deja ProfileViewController, pe care o vom crea mai târziu în acest tutorial. Apoi, adăugați următoarea metodă în secțiunea didReceiveMemoryWarning metodă:
- (void) prepareForSegue: (UIStoryboardSegue *) expeditor segue: (id) expeditor ProfileViewController * profileViewController = [segue destinationViewController]; [profileViewController setUsername: usernameTextfield.text];
Aici trecem numele de utilizator la ProfileViewController, pe care îl vom crea într-un minut.
Pentru a face aceste puncte de vânzare, trebuie mai întâi să creați niște fișiere noi, așa că mergeți la "File"> "New"> "File ...". Selectați "Class-Objective-C" și faceți clic pe "Next". Introduceți "ProfileViewController" pentru clasă și asigurați-vă că este o subclasă a UIViewController și că ambele casete de selectare nu sunt selectate. Dați clic din nou pe "Următorul" și apoi faceți clic pe "Creați".
Deschideți ProfileViewController.h și modificați codul după cum urmează:
#import#import #import #import @ interfață ProfilViewController: UIViewController IBOutlet UIImageView * profileImageView; IBOutlet UIImageView * bannerImageView; IBOutlet UILabel * nameLabel; IBOutlet UILabel * usernameLabel; IBOutlet UILabel * tweetsLabel; IBOutlet UILabel * followingLabel; IBOutlet UILabel * followersLabel; IBOutlet UITextView * lastTweetTextView; NSString * username; @property (nonatomic, reține) NSString * numele de utilizator; @Sfârșit
Aici introducem mai întâi cadrele pe care le-am adăugat mai devreme în proiectul nostru. După aceasta, vom crea câteva puncte de acces pentru elementele care vor afișa imaginea de profil și, în sfârșit, vom crea un șir care va conține numele de utilizator introdus. Am setat acest șir în prepareForSegue: expeditor: metoda pe care am creat-o in pasul anterior.
Deschideți Storyboard și selectați profilul View Controller. Deschideți Inspectorul de identitate și modificați clasa în ProfileViewController. După aceea, deschideți Inspectorul de conectări și conectați prizele cu elementele de interfață corespunzătoare. Asigurați-vă că vă conectați legăturile tweetsLabel, followingLabel și followersLabel cu etichetele de deasupra etichetelor cu textul corespunzător. Deci, nu conectați priza tweetsLabel cu eticheta care spune "Tweets", dar cu eticheta de mai sus pe care o.
În cele din urmă, deschideți ProfileViewController.m și adăugați următoarea linie sub @implementation:
@synthesize nume de utilizator;
Fișierul ProfileViewController.m ar trebui să fie încă deschis, așa că mergeți la viewDidLoad și modificați-l astfel:
- (vid) viewDidLoad [super viewDidLoad]; [profilImageView.layer setBorderWidth: 4.0f]; [profileImageView.layer setBorderColor: [[UICoror alb Culoare] CGColor]]; [profilImageView.layer setShadowRadiu: 3.0]; [profilImageView.layer setShadowOpacitate: 0.5]; [profilImageView.layer setShadowOffset: CGSizeMake (1.0, 0.0)]; [profilImageView.layer setShadowColor: [[UICcolor negruColor] CGColor]];
Aici folosim QuartzCore Framework pentru a oferi profileImageView o margine și o anumită umbră.
Adăugați următoarea metodă în secțiunea didReceiveMemoryWarning metodă:
- (void) getInfo // Solicitarea accesului la conturile Twitter ACAccountStore * accountStore = [[ACAccountStore alloc] init]; ACAccountType * accountType = [contStore accountTypeWithAccountTypeIdentifier: ACAccountTypeIdentifierTwitter]; [contStore requestAccessToAccountsWithType: opțiune tip cont: nulă finalizare: ^ (BOOL acordat, eroare NSError *) if (acordat) NSArray * accounts = [accountStore accountsWithAccountType: accountType]; // Verificați dacă utilizatorii au setat cel puțin un cont Twitter dacă (accounts.count> 0) ACAccount * twitterAccount = [conturi objectAtIndex: 0]; // Crearea unei solicitări pentru a obține informații despre un utilizator pe Twitter SLRequest * twitterInfoRequest = [Cerere SLRequestForServiceType: Cerere SLServiceTypeTwitterMethod: SLRequestMethodGET URL: [NSURL URLWithString: @ "https://api.twitter.com/1.1/users/show. json "]: [NSDictionary dicționarWithObject: nume de utilizator pentruKey: @" screen_name "]]; [twitterInfoRequest setAccount: twitterAccount]; // Efectuarea cererii [twitterInfoRequest performRequestWithHandler: ^ (NSData * responseData, NSHTTPURLResponse * urlResponse, eroare NSError *) dispatch_async (dispatch_get_main_queue (), ^ // Verificați dacă am atins limita reate dacă [[urlResponse statusCode] == 429 ) NSLog (@ "Limita ratei atinsa"); retur; // Verificati daca a existat o eroare daca (eroare) NSLog (@ "Eroare:% @", error.localizedDescription); există date de răspuns dacă (răspunsData) NSError * error = nil; NSArray * TWData = [NSJSONSerialization JSONObjectWithData: răspuns Opțiuni date: NSJSONReadingMutableLeaves error: & error]; : @ următorii = [[(NSDictionary *) TWData obiectForKey: @ "followers_count"] integerValue]; int următor = [[ (NSDictionary *) TWData obiectForKey: @ "friends_count"] integerValue]; int tweets = [[(NSDictionary *) TWData obje ctForKey: @ "statuses_count"] integerValue]; NSString * profileImageStringURL = [(NSDictionary *) obiect TWDataForKey: @ "profile_image_url_https"]; NSString * bannerImageStringURL = [(NSDictionary *) obiect TWDataForKey: @ "profile_banner_url"]; // Actualizați interfața cu datele încărcate numeLabel.text = nume; usernameLabel.text = [NSString șirWithFormat: @ "@% @", screen_name]; tweetsLabel.text = [NSString șirWithFormat: @ "% i", tweets]; followingLabel.text = [NSString stringWithFormat: @ "% i", următor); followersLabel.text = [NSString șirWithFormat: @ "% i", adepți]; NSString * lastTweet = [[(NSDictionary *) TWData obiectForKey: @ "status"] objectForKey: @ "text"]; lastTweetTextView.text = ultimulTweet; // Obțineți imaginea profilului în profilul de rezoluție originalImageStringURL = [profilImageStringURL stringByReplacingOccurrencesOfString: @ "_ normal" cuString: @ ""]; [auto getProfileImageForURLString: profileImageStringURL]; // Obțineți imaginea bannerului, dacă utilizatorul are unul dacă (bannerImageStringURL) NSString * bannerURLString = [NSString stringWithFormat: @ "% @ / mobile_retina", bannerImageStringURL]; [auto getBannerImageForURLString: bannerURLString]; altceva bannerImageView.backgroundColor = [UICcolor underPageBackgroundColor]; ); ]; altceva NSLog (@ "Nu este permis accesul"); ];
Este o mulțime de cod, dar o voi explica pas cu pas.
ACAccountStore * contStore = [[ACAccountStore alocare] init]; ACAccountType * accountType = [contStore accountTypeWithAccountTypeIdentifier: ACAccountTypeIdentifierTwitter];
Aici inițializăm un obiect ACAccountStore care ne va permite să accesăm conturile utilizatorului. După aceea, vom crea o instanță ACAccountType, apelați accountTypeWithAccountTypeIdentifier metodă pe instanța ACAccountStore pe care tocmai am creat-o și apoi setați tipul de cont pe Twitter. Puteți utiliza aceeași metodă dacă doriți să utilizați Facebook, dar va trebui să setați identificatorul de tip cont ACAccountTypeIdentifierFacebook.
[accountStore requestAccessToAccountsWithType: accountType options: completare nulă: ^ (BOOL acordat, eroare NSError *) if (acordat) ];
Aici, pur și simplu, îi cerem utilizatorului să dea accesul la aplicația noastră pe contul /.
NSArray * conturi = [conturiStore conturiWithAccountType: accountType]; dacă (conts.count> 0) ACAccount * twitterAccount = [conturi objectAtIndex: 0];
Aici vom crea o serie de conturi Twitter ale utilizatorului. Verificăm dacă utilizatorul are conturi Twitter. Dacă da, vom crea o instanță ACAccount a primului cont Twitter în acea matrice. Pentru a păstra simplu, vom folosi primul cont în acest tutorial, dar într-o aplicație reală ar trebui să oferiți utilizatorului posibilitatea de a-și selecta contul de Twitter preferat în cazul în care au mai mult de 1.
SLRequest * twitterInfoRequest = [SLRequest requestForServiceType: solicitarea SLServiceTypeTwitterMethod: SLRequestMethodGET URL: [NSURL URLWithString: @ "https://api.twitter.com/1.1/users/show.json"] parametrii: [NSDictionary dictionaryWithObject: username forKey: @ " Nume pe ecran"]]; [twitterInfoRequest setAccount: twitterAccount];
Aici creăm cererea noastră, care va apela API-ul Twitter. Am setat tipul de serviciu pe Twitter și metoda de solicitare pentru GET. Nu vrem să obținem informații despre un utilizator pe Twitter. De asemenea, puteți utiliza metodele de solicitare POST și DELETE. Cu POST, poți să actualizezi o imagine de profil sau să trimiți un tweet. Cu DELETE, puteți șterge lucrurile din contul dvs. Adresa URL din acest tutorial va fi: https://api.twitter.com/1.1/users/show.json. Această adresă URL se va asigura că cererea returnează o varietate de informații despre utilizatorul specificat într-un format JSON. Ca parametru, adăugăm numele de utilizator introdus pentru numele cheie screen_name, astfel încât să obținem informațiile despre acel utilizator. După aceea, am setat contul pentru solicitare la instanța ACAccount.
[[urlResponse statusCode] == 429) NSLog (@ "Limita ratei a fost atinsă"); return (return); dacă (eroare) NSLog (@ "Eroare:% @", error.localizedDescription); return;); ];
Aici, de fapt, facem cererea și ne asigurăm că se încarcă asincron, astfel încât interfața noastră va continua să fie receptivă în timpul încărcării. Facem asta cu GCD, Grand Central Dispatch. Nu voi intra în detalii, dar puteți găsi mai multe informații aici. Când cererea este finalizată, verificăm mai întâi dacă aplicația noastră nu a atins limita ratei. După aceasta, verificăm dacă a apărut o eroare.
dacă (răspunsData) NSError * error = nil; NSArray * TWData = [NSJSONSerializare JSONObjectWithData: răspuns Opțiuni de date: NSJSONReadingMutableLeaves error: & error];
Aici verificăm dacă cererea a returnat date de răspuns. Dacă da, vom crea un matrice din fișierul JSON returnat.
NSString * screen_name = [(NSDictionary *) TWData objectForKey: @ "screen_name"]; NSString * nume = [(NSDictionary *) obiect TWDataForKey: @ "nume"]; următorii int = [[(NSDictionary *) TWData objectForKey: @ "followers_count"] integerValue]; int următor = [[(NSDictionary *) TWData objectForKey: @ "friends_count"] integerValue]; int tweets = [[(NSDictionary *) obiect TWDataForKey: @ "statuses_count"] integerValue]; NSString * profileImageStringURL = [(NSDictionary *) obiect TWDataForKey: @ "profile_image_url_https"]; NSString * bannerImageStringURL = [(NSDictionary *) obiect TWDataForKey: @ "profile_banner_url"];
Aici filtram datele preferate, primim numele utilizatorului, numele_screatorului (numele de utilizator), numărul de tweets, urmașii și persoanele care urmează. De asemenea, primim URL-urile pentru imaginea de profil și banner.
nameLabel.text = nume; usernameLabel.text = [NSString șirWithFormat: @ "@% @", screen_name]; tweetsLabel.text = [NSString șirWithFormat: @ "% i", tweets]; followingLabel.text = [NSString stringWithFormat: @ "% i", următor); followersLabel.text = [NSString șirWithFormat: @ "% i", adepți]; NSString * lastTweet = [[(NSDictionary *) TWData obiectForKey: @ "status"] objectForKey: @ "text"]; lastTweetTextView.text = ultimulTweet;
Aici, actualizăm proprietățile textului etichetelor și textului cu datele pe care tocmai le-am primit și le-am filtrat.
profileImageStringURL = [șirul profilImageStringURLByReplacingOccurrencesOfString: @ "_ normal" cuString: @ ""]; [auto getProfileImageForURLString: profileImageStringURL];
Deoarece Twitter folosește url pentru imaginea profilului de dimensiuni normale, care este de numai 48 cu 48 de pixeli, elimină șirul "_normal", pentru a putea obține imaginea de profil originală. După aceea, sunăm getProfileImageForURLString: pentru a descărca imaginea de profil. Vom crea această metodă în câteva minute.
dacă (bannerImageStringURL) NSString * bannerURLString = [NSString stringWithFormat: @ "% @ / mobile_retina", bannerImageStringURL]; [auto getBannerImageForURLString: bannerURLString]; altceva bannerImageView.backgroundColor = [UICcolor underPageBackgroundColor];
Aici verificăm dacă utilizatorul are un banner de profil. Dacă da, actualizăm adresa URL astfel încât să obținem versiunea mobilă a retinei pe banner, care are dimensiunea de 640x320 pixeli. După aceea, sunăm getBannerImageForURLString: pentru a descărca bannerul. Dacă utilizatorul nu are un banner de profil, dăm bannerImageView o culoare de fundal.
Acum adăugați următoarele metode sub obtine informatii metodă de descărcare a profilului și a imaginii bannerului:
- (void) getProfileImageForURLString: (NSString *) urlString; NSURL * url = [NSURL URLWithString: urlString]; NSData * date = [NSData dataWithContentsOfURL: url]; profileImageView.image = [UIImage imageWithData: date]; - (void) getBannerImageForURLString: (NSString *) urlString; NSURL * url = [NSURL URLWithString: urlString]; NSData * date = [NSData dataWithContentsOfURL: url]; bannerImageView.image = [UIImage imageWithData: date];
Ultimul lucru pe care trebuie să-l facem pentru a termina aplicația noastră este de a apela obtine informatii metodă în viewDidLoad metodă, așa că du-te la viewDidLoad și adăugați următoarea linie în partea de jos a acelei metode:
[self getInfo];
Acum, când am terminat aplicația noastră, faceți clic pe Build and Run sau apăsați ⌘R pentru a testa aplicația. Dacă introduceți un nume de utilizator de la cineva pe Twitter, ar trebui să vedeți un profil mini cu informații despre acel utilizator.
Vă mulțumim că ați citit acest tutorial despre a face o solicitare Twitter cu noul cadru social. Dacă doriți să aflați mai multe despre API-ul Twitter, vă sugerăm să vă uitați la documentația oficială. Sper că ți-a plăcut acest tutorial și dacă ai întrebări sau comentați acest tutorial, lăsați-le în secțiunea de comentarii de mai jos!
Accentsconagua