{"id":6748,"date":"2011-05-03T14:23:30","date_gmt":"2011-05-03T12:23:30","guid":{"rendered":"http:\/\/www.devapp.it\/wordpress\/?p=6748"},"modified":"2011-05-04T20:54:29","modified_gmt":"2011-05-04T18:54:29","slug":"t093-utilizziamo-lo-shake-per-ottenere-delle-frasi-casuali","status":"publish","type":"post","link":"https:\/\/www.devapp.it\/wordpress\/t093-utilizziamo-lo-shake-per-ottenere-delle-frasi-casuali\/","title":{"rendered":"T#093 – Utilizziamo lo shake per ottenere delle frasi casuali"},"content":{"rendered":"

\"\"<\/a> Ciao a tutti, ho pensato di scrivere questo tutorial semplice semplice per venire incontro a tutti gli utenti che ne hanno fatto richiesta sul nostro forum. In particolare creeremo un’applicazione per iPhone che scuotendo il device, oppure cliccando su un apposito pulsante, mostrer\u00e0 a video una frase random prelevandola da un file plist. Per rendere il tutto pi\u00f9 semplice ho scelto di utilizzare Interface Builder per la realizzazione dell’interfaccia e di utilizzare gli strumenti messi a disposizione dal nuovo XCode4 per dichiarare le IBaction e IBOutlet. Il risultato finale \u00e8 quello che vedete qui a lato, la foto di sfondo \u00e8 del grande Escher<\/a> (click sull’immagine per ingrandire)<\/p>\n

Creiamo e prepariamo il nostro nuovo progetto XCode<\/h4>\n

Iniziamo quindi con il creare un nuovo progetto di tipo “view-based appliation” e chiamiamolo “Oracolo di DevAPP”<\/p>\n

\"\"<\/a><\/p>\n

Creazione del nuovo progetto<\/p>\n<\/div>\n

Occupiamoci quindi del file che conterr\u00e0 le frasi. Come ho avuto modo di dire pi\u00f9 volte in ogni programma ben fatto \u00e8 necessario separare il codice dai dati. Questo per certi aspetti complica un p\u00f2 la prima stesura del programma, infatti molti utenti alle prime armi tendono a fare un p\u00f2 di commistione tra dati e codice, per esempio un approccio errato a questo problema potrebbe essere:<\/p>\n

\r\n\/\/r \u00e8 un numero random\r\nif (r == 0) {\r\n    NSLog(@\"ecco la prima frase random\");\r\n}\r\nelse if (r == 1) {\r\n    NSLog(\"ecco la seconda frase random\");\r\n}\r\n\/\/etc etc...\r\n<\/pre>\n
Perch\u00e9 sia sbagliato \u00e8 presto detto: supponiamo che la community inizi a suggerirmi delle frasi da aggiungere all’oracolo…se avessi utilizzato questo approccio sarei costretto a rivedere il programma ogni volta, trovando il punto dove ad r viene assegnato il numero random, aggiungere un ulteriore blocco “else if”…insomma un sacco di roba che probabilmente potrebbe farmi generare qualche errore.<\/p>\n
Utilizziamo piuttosto un approccio differente, aggiungiamo al nostro programma un file plist e chiamiamolo “elencofrasi.plist”<\/p>\n
\"\"<\/a><\/p>\n
Aggiungi un nuovo file plist<\/p>\n<\/div>\n
Visualizzate ora il file pslit come “source code” facendo un click con il tasto destro sul nome del file, e sostituite il contenuto del file con questo:<\/p>\n
\r\n\r\n\r\n\r\n\r\nRicordati di fare il release degli oggetti allocati<\/string>\r\nRicordati del metodo dealloc<\/string>\r\nRicordati di impostare il datasource per le UITableView<\/string>\r\nRicordati di impostare il delegate per le UITableView<\/string>\r\nRicordati che esiste un solo sito per lo sviluppo iOS: devapp.it<\/string>\r\nRicordati che rispondere sul forum \u00e8 una cortesia, non un obbligo<\/string>\r\nRicordati che le richieste HTTP devono essere fatte su un thread separato<\/string>\r\nRicordati che se copi il contenuto dei nostri tutorial avrai sette anni di disgrazie<\/string>\r\nRicordati di condividere le tue conoscenze<\/string>\r\nRicordati di rigranziare chi ha scritto questo tutorial :) :) <\/string>\r\n<\/array>\r\n<\/plist>\r\n<\/pre>\n
La logica del programma<\/h4>\n
La logica del programma \u00e8 abbastanza semplice, vogliamo che all’apertura vengano caricate le frasi leggendole da un file plist e successivamente, scuotendo il device oppure cliccando su un pulsante, venga visualizzata una frase random.<\/p>\n
Dichiariamo quindi nel file Oracolo_di_DevAPPViewController un NSArray e un intero<\/p>\n
\r\n\tNSArray *elencoFrasi;\r\n\tint fraseCorrente;\r\n<\/pre>\n
Non utilizzer\u00f2 @property perch\u00e9 non servono in questo momento.
\nInizializzo queste variabili all’interno del metodo viewDidLoad<\/em>, in altri casi potrebbe essere necessario inizializzarle in altri momenti, ma in questo esempio va bene questo metodo.<\/p>\n
\r\n- (void)viewDidLoad\r\n{\r\n    [super viewDidLoad];\r\n\tNSString *filePath = [[NSBundle mainBundle] pathForResource:@\"elencoFrasi\" ofType:@\"plist\"];\r\n\telencoFrasi = [[NSArray alloc] initWithContentsOfFile:filePath];\r\n\tsrand (time(NULL));\r\n\tfraseCorrente = -1;\r\n}\r\n<\/pre>\n
Le prime due istruzioni servono ad inizializzare la variabile “elencoFrasi” con il contenuto del file plist, attenzione ho scritto “alloc” quindi ricordiamo di farne il release nel metodo dealloc del viewcontroller.<\/p>\n
L’istruzione:<\/p>\n
\r\nsrand (time(NULL));\r\n<\/pre>\n
permette invece di impostare il seme per il generatore di numeri pseudo-random.<\/p>\n
Questo argomento necessiterebbe di un intero libro, ma per il momento ci basta sapere che la funzione rand()<\/em> che utilizzeremo tra breve non genera dei numeri realmente casuali, ma dei numeri definiti pseudo-random, la successione di questi numeri \u00e8 stabilita da un parametro numerico, detto “seme” e la funzione srand()<\/em> \u00e8 la funzione che serve per impostare questo seme, gli passiamo come parametro il numero di secondi intercorsi dalla mezzanotte del 1 gennaio 1970 (l’origine dello standard unix time<\/a> ) in questo modo siamo ragionevolmente<\/em> sicuri che ad ogni esecuzione del nostro programma il seme verr\u00e0 inizializzato ad un valore diverso.<\/p>\n
Riconoscere lo shake del device<\/h4>\n
Per riconoscere l’avvenuto shake del device possiamo, per evitare di analizzare i dati dell’accelerometro, inserire questo codice all’interno del viewcontroller:<\/p>\n
\r\n-(BOOL)canBecomeFirstResponder {\r\n    return YES;\r\n}\r\n\r\n-(void)viewDidAppear:(BOOL)animated {\r\n    [super viewDidAppear:animated];\r\n    [self becomeFirstResponder];\r\n}\r\n\r\n- (void)viewWillDisappear:(BOOL)animated {\r\n    [self resignFirstResponder];\r\n    [super viewWillDisappear:animated];\r\n}\r\n\r\n- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event\r\n{\r\n    if (motion == UIEventSubtypeMotionShake)\r\n    {\r\n\t\t[self showNextAdvice:nil];\r\n    }\r\n}\r\n<\/pre>\n
Spiegare in dettaglio cosa facciano questi metodi ci porterebbe un p\u00f2 fuori tema, diciamo brevemente che ci assicuriamo che il nostro viewController sia, quando visibile, il FirstResponder<\/em> al quale inviare il messaggio dell’avvenuto shake. Nell’ultimo metodo richiamo espressamente il metodo “showNextAdvice:nil” per visualizzare una nuova frase.
\nAttenzione:<\/strong> il metodo “showNextAdvice” ancora non \u00e8 stato dichiarato, continuate a leggere prima di compilare.<\/p>\n
L’interfaccia grafica<\/h4>\n
Salviamo il tutto e iniziamo ad occuparci dell’interfaccia.
\nSelzioniamo il file “Oracolo_di_DevAPPViewController.xib” e XCode4 visualizzer\u00e0 tutti i controlli necessari per disegnare la nostra interfaccia.<\/p>\n
Io ho aggiunto:<\/p>\n
    \n
  1. Una UIImageView per lo sfondo<\/li>\n
  2. Una UIImageView per ospitare il logo di devAPP<\/li>\n
  3. Una UITextView per ospitare la frase<\/li>\n
  4. Un UIButton per richiedere una nuova frase<\/li>\n<\/ol>\n
    La UITextView \u00e8 stata impostata con uno sfondo trasparente, cos\u00ec da poter visualizzare lo sfondo.
    \nAbbiamo bisogno quindi di un IBOutlet che colleghi la UITextView che abbiamo inserito e una IBAction che colleghi l’UIButton ad un metodo della nostra classe. Utilizziamo quindi le nuove features di XCode 4, visualizziamo l’assistant editor cliccando sul pulsante dedicato:<\/p>\n

    \n    \"\"<\/a>
    \n<\/center><\/p>\n
    L’assistant editor visualizzer\u00e0 il file .h corrispondente all’interfaccia visualizzata, quindi possiamo trascinare (sempre con il tasto dx) dall’interfaccia sul codice sorgente per far apparire il men\u00f9 che ci permette di creare automaticamente gli IBAction e IBOutlet di cui abbiamo bisogno:<\/p>\n

    \n    \"\"<\/a>
    \n<\/center><\/p>\n

    \n    \"\"<\/a>
    \n<\/center><\/p>\n
    Una piccola nota:<\/strong> l’idea di creare un metodo il cui unico compito \u00e8 quello di visualizzare una nuova frase non \u00e8 casuale ma ci permetter\u00e0 di riciclare il codice scritto all’interno di questo metodo in pi\u00f9 parti del programma, in questo esempio lo stesso metodo verr\u00e0 richiamato sia dal “touch up inside” del pulsante sia con lo shake del device. In alcuni casi ho visto scrivere tutta la logica del programma all’interno del metodo richiamato dall’accelerometro, non \u00e8 un approccio corretto, perch\u00e9 in quel caso se vogliamo eseguire la stessa azione scatenata per\u00f2 da un evento diverso siamo costretti a fare copia-incolla del codice.<\/p>\n
    Il metodo showNextAdvice <\/h4>\n
    Adesso il passo finale, inseriamo il contenuto del metodo showNexAdvice.<\/p>\n
    Il mio codice \u00e8 questo:<\/p>\n
    \r\n- (IBAction)showNextAdvice:(id)sender {\r\n\tint r;\r\n\tint maxIndex = [elencoFrasi count] - 1;\r\n\tif (fraseCorrente == -1) {\r\n\t\tr = rand() % maxIndex;\r\n\t}\r\n\telse {\r\n\t\tr = rand() % (maxIndex - 1);\r\n\t\tif (r == fraseCorrente) {\r\n\t\t\tr = maxIndex;\r\n\t\t}\r\n\t\t\r\n\t}\t\r\n\tfraseCorrente = r;\r\n\t[textArea setText:[elencoFrasi objectAtIndex:r]];\r\n}\r\n<\/pre>\n
    Pu\u00f2 sembrare farraginoso, ma vi assicuro che c’\u00e8 un perch\u00e9.
    \nPer iniziare dichiaro due variabili, r<\/em> e maxIndex<\/em>, la prima conterr\u00e0 il numero random generato, la seconda invece ci servir\u00e0 per evitare di generare numeri pi\u00f9 grandi dell’ultima posizione dell’array, infatti \u00e8 inizializzata a:<\/p>\n
    \r\n[elencoFrasi count] - 1;\r\n<\/pre>\n
    Eseguo poi un test per verificare se “frasecorrente == -1”, questa condizione pu\u00f2 essere verificata solo all’avvio del programma, perch\u00e9 poi ad ogni frase scelta la variabile frasecorrente non potr\u00e0 mai essere -1.
    \nQuindi visto che \u00e8 stiamo per visualizzare la nostra prima frase scegliamo tranquillamente un numero random tra 0 ed il massimo indice possibile e visualizziamo la frase nella textview.
    \nE se il test precedente restituisce falso? Allora vuol dire che abbiamo gi\u00e0 estratto qualche numero random, e mi sono preso la briga di evitare che un numero possa essere estratto due volte di seguito.
    \nQualcuno potrebbe dire “basta verificare che sia diverso dal precedente, se non lo \u00e8 ne rigeneri un altro”…purtroppo non \u00e8 una risposta corretta perch\u00e9 in linea di principio questo tipo di approccio potrebbe portare ad un loop infinito, adottiamo quindi una soluzione pi\u00f9 adatta. Se l’array \u00e8 composto da n<\/em> frasi, dobbiamo garantire alle n-1<\/em> frasi restanti la stessa probabilit\u00e0 di uscita, quindi dobbiamo estrarre un numero non pi\u00f9 da 0 a n-1<\/em> ma da 0 a n-2<\/em> (non confondiamoci con gli indici per carit\u00e0!) cos\u00ec facendo, per\u00f2, avremmo rimesso nel mucchio anche il precedente estratto ed escluso quello in posizione n-1, basta quindi fare un controllo, se ho estratto lo stesso numero di prima allora restituisco quello in posizione n-1. <\/p>\n
    Se non fossero bastate le mie parole a confondervi le idee eccovi un’immagine che vi chiarir\u00e0 maggiormente le idee:<\/p>\n
    \"\"<\/a><\/p>\n
    La scelta certa di due random differenti.<\/p>\n<\/div>\n
    A questo punto il programma \u00e8 terminato, non mi resta che augurarvi buon coding.
    \nAlla prossima<\/p>\n
    \"\"<\/a> Se avete problemi con il tutorial,\u00a0questo \u00e8 il nostro file di progetto (per XCode 4).<\/a><\/p>\n

    \n    \"\"<\/a>
    \n<\/center><\/p>\n

    \n    \"\"<\/a>
    \n<\/center><\/p>\n","protected":false},"excerpt":{"rendered":"
    Ciao a tutti, ho pensato di scrivere questo tutorial semplice semplice per venire incontro a tutti gli…<\/p>\n","protected":false},"author":53,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[736,735,241,413,734,242],"class_list":["post-6748","post","type-post","status-publish","format-standard","hentry","category-tutorial-pratici","tag-esempi-codice-programmazione-iphone","tag-frasi-a-random-iphone-app","tag-ignazio-calo","tag-programmare-iphone","tag-shake-iphone","tag-tutorial-xcode"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/posts\/6748","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/users\/53"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/comments?post=6748"}],"version-history":[{"count":46,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/posts\/6748\/revisions"}],"predecessor-version":[{"id":6788,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/posts\/6748\/revisions\/6788"}],"wp:attachment":[{"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/media?parent=6748"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/categories?post=6748"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devapp.it\/wordpress\/wp-json\/wp\/v2\/tags?post=6748"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}