Aplikácia pre iOS: Práca s výberom viacerých komponentov



Tento blog je o vytváraní aplikácie pre iOS, ktorá zobrazuje prevod z jednej jednotky na druhú. Opisuje prácu nástroja Mutlicomponent Picker, výstrah atď.

Ak chcete získať podrobný prehľad, prečítajte si . Toto je druhý blog zo série aplikácií pre iOS.





Ak ste skúsený vývojár a ste zvedaví na prácu s výberom MultiComponent, potom ste prišli na správny blog. V tomto blogu budem hovoriť o tom, ako rozšíriť našu konverznú aplikáciu o ďalšie funkcie implementáciou výberu viacerých komponentov, a tiež o tom, ako vykonávať výnimočné zaobchádzanie pomocou upozornení.

Vposledný blog,to sme videli keď niečo napíšeme do textového poľa, objaví sa klávesnica. Hodnota, ktorá sa má previesť, sa napíše do textového poľa a potom vidíme, že klávesnica nezmizne.



Aby sme tento problém vyriešili, musíme pridať tlačidlo, ktoré zakrýva celé zobrazenie. Keď sa používateľ dotkne kdekoľvek na pozadí, klávesnica by mala zmiznúť.

Teraz poďme do toho. Presuňte tlačidlo, v inšpektore atribútov nastavte typ tlačidla ako vlastný a farbu textu ako jasnú farbu.

Atribúty inšpektor



a vyberte Editor> Usporiadať> Poslať dozadu

a zmeniť veľkosť tlačidla takým spôsobom, aby sa zmestil do celého zobrazenia.

Toto tlačidlo teraz slúži ako neviditeľné tlačidlo na pozadí, na ktoré sa klikne, aby zmizla klávesnica. Poďme napísať IBAction pre rovnaké, vyberte režim editora asistenta a stlačte a podržte Control + ťahať na ViewController.h Nastavte pripojenie na akciu a názov na BackgroundButton a kliknite na pripojenie.

Kód radiča zobrazenia teraz vyzerá takto.

#import @interface ViewController: UIViewController @property (strong, nonatomic) IBOutlet UITextField * ValueTextField @property (strong, nonatomic) IBOutlet UIPickerView * picker2 @property (strong, nonatomic) NSArray * data @property (strong, nonatomic) IB - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @end

Prepnite na ViewController.m a potom napíšte nasledujúci kód.

- (IBAction) backgroundButton: (id) sender {[_ValueTextField resignFirstResponder] [_picker2 resignFirstResponder] [_ResultLabel resignFirstResponder]}

Tu kód povie všetkým ostatným objektom, aby po zistení dotyku dosiahli stav prvej odpovede. Teraz spustite aplikáciu a uvidíte. Keď sa dotknete pozadia, zistíte, že klávesnica zmizne. Teraz, keď má klávesnica po zadaní skončiť, zavolajte metódu backgroundButton v metóde didselectRow () výberu. Kód metódy bude teda nasledovný.

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) riadok inComponent: (NSInteger) komponent {selectedValue = _data [riadok] [vlastné pozadieButton: 0]}

Teraz môžete pracovať na skrášľovacej časti aplikácie, napríklad pridať pozadie a možno dokonca dať efektný obrázok tlačidla. V tom mojom však budem nastavovať obrázok na pozadí.
Ak to chcete urobiť, najskôr vyhľadajte vhodný obrázok! Potom ho pridajte do priečinka Images.xcassets a zmeňte univerzálne obrázok z 1x na 2x obrazovku.

Spustite aplikáciu a skontrolujte, či funguje dobre.

Ak zmením zariadenie na iphone 5s.

A spustiť aplikáciu.

Tu vidíme, že všetko funguje podľa očakávaní. Čo keby som chcel pridať pozadie k môjmu tlačidlu a urobiť jeho vzhľad viac ako tlačidlo? Aby som to urobil, najskôr by som pridal IBOutlet pre tlačidlo prevodu do ViewController.h

@ vlastnosť (silná, neatomatická) IBOutlet UIButton * prevádzať

a potom pridajte nasledujúci kód v metóde viewDidLoad ()

self.convert.backgroundColor = [UIColor colorWithRed: 0,4 zelená: 0,8 modrá: 1,0 alfa: 1,0] [_convert setTitleColor: [UIColor whiteColor] pre štát: UIControlStateNormal]

Spustime našu aplikáciu a uvidíme, či sa nám to páči.

čo je awt v jave

OK skvele! Určite ste si všimli, že som zmenil aj pozície výsledného štítku, dôvod zmeny je niečo, čo vysvetlím neskôr.

Vieme, že naša aplikácia konvertuje iba z Celzia na Fahrenheita a naopak. Čo tak pridať niekoľko ďalších funkcií alebo jednotiek na prevod? Aby sme to dosiahli, musíme do UIPickerView pridať jednu ďalšiu zložku, ktorá poskytuje vhodný výber, keď je v prvej zložke výberu vybratá jednotka.

Aby sme mohli výber rozdeliť na dve zložky, musíme pridať nové dáta NSArray2, ktoré budú obsahovať údaje pre druhú zložku. Definujte tiež dve konštanty, ktoré budú predstavovať naše dve zložky. Tu je ľavá zložka deklarovaná ako 0 a pravá zložka ako deklarovaná pre jednoduchosť programovania.

Váš súbor ViewController.h vyzerá takto

#import # define data1comp 0 # define data2comp 1 @interface ViewController: UIViewController @property (strong, nonatomic) IBOutlet UITextField * ValueTextField @property (strong, nonatomic) IBOutlet UIPickerView * picker2 @property (strong, nonatomic) NSArray silný, neaatomický) NSArray * data2 @property (silný, anatomický) IBOutlet UILabel * ResultLabel @property (silný, anatomický) IBOutlet UIButton * prevádzať - (IBAction) Konvertovať: (UIButton *) odosielateľ - (IBAction) backgroundButton: (id) odosielateľ @koniec

Teraz definujte pole data2 v metóde ViewDidLoad (). Teraz, keď máme oba zdroje údajov, musíme byť schopní napísať kód pre výber takým spôsobom, že keď vyberieme položku z prvej zložky výberu, druhá zložka by sa mala automaticky zmeniť na zodpovedajúcu hodnotu. Druhá zložka závisí od výberu prvej.
Za týmto účelom musíme definovať slovník, ktorý bude ukladať kľúče a hodnoty. Kľúče obsahujú údaje zodpovedajúce prvej zložke výberu a hodnoty obsahujú údaje zodpovedajúce druhej zložke výberu.

- (void) viewDidLoad {[super viewDidLoad] // Po načítaní zobrazenia urobte akékoľvek ďalšie nastavenie, zvyčajne z hrotu. _data1 = [NSArray arrayWithObjects: @ 'Celsius', @ 'Fahrenheit', @ 'Meter', @ 'Centimeter', nil] data2 = [NSArray arrayWithObjects: @ 'Centimeter', @ 'Meter', @ 'Fahrenheit', @ 'Celsius', nil] dictionary = [NSDictionary dictionaryWithObjectsAndKeys: @ 'Celcius', @ 'Farenheit', @ 'Farenheit', @ 'Celcius', @ 'Meter', @ 'Centimeter', @ 'Centimeter', @ 'Meter ', nil] self.view.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageNamed: (@' bg2.png ')]]}}

Teraz musíme zmeniť zdroj údajov a delegovať metódy aktuálneho výberu na nasledujúce, aby sme mali údaje vyplnené v oboch komponentoch.

- (NSInteger) numberOfComponentsInPickerView: (UIPickerView *) pickerView {return 2} - (NSInteger) pickerView: (UIPickerView *) pickerView numberOfRowsInComponent: (NSInteger) component {if (component == data1comp) {return [self.data1 count]} return [self.data2 count]} - (NSString *) pickerView: (UIPickerView *) pickerView titleForRow: (NSInteger) riadok preComponent: (NSInteger) komponent {if (component == data1comp) {return [self.data1 objectAtIndex: row]} return [self.data2 objectAtIndex: row]} - (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) riadok inComponent: (NSInteger) komponent {[self backgroundButton: 0] if (komponent == data1comp) {NSString * data11 = [_ data1 objectAtIndex: row] NSArray * a = [dictionary objectForKey: data11] secondrow = [self.data2 indexOfObject: a] [_picker2 selectRow: secondrow inComponent: data2comp animated: YES] [_picker2 reloadComponent: data2comp] selectedValue = riadok}}

Tu v našej metóde didSelectRow () dostávame vybranú hodnotu prvého komponentu, potom ju odovzdáme ako argument metóde objectForKey () v slovníku a získame zodpovedajúcu hodnotu pre kľúč. Aby sme našli zodpovedajúcu pozíciu pre hodnotu v druhom poli, tj. Data2, použijeme metódu indexOfObject () poľa a uložíme výsledok do celočíselnej hodnoty.
Túto celočíselnú hodnotu potom odovzdáme metóde picker selectRow: row inComponent: component (). A znovu načítajte komponent nástroja na výber pomocou reloadComponent ().
Keď to urobíme, keď vyberieme jednu položku z prvej zložky, zodpovedajúca položka sa vyberie v druhej zložke výberu.

Kód pre didSelectRow ()

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) riadok inComponent: (NSInteger) komponent {[self backgroundButton: 0] if (komponent == data1comp) {NSString * data11 = [_ data1 objectAtIndex: riadok] NSArray * a = [slovník objectForKey: data11] secondrow = [self.data2 indexOfObject: a] [_picker2 selectRow: secondrow inComponent: data2comp animovaný: ÁNO] [_picker2 reloadComponent: data2comp] selectedValue = data11 selectedRow = riadok}}

Teraz spustite aplikáciu a uvidíte, či výber funguje podľa očakávaní.

Voila! funguje to!

Pokračujme teda v kódovaní nášho tlačidla prevodu. Predchádzajúci výber mal iba dve zodpovedajúce hodnoty, tj. Celzia a Fahrenheita, a potom sa vypočítal výsledok. Teraz však máme štyri hodnoty Celzia, Fahrenheita, meter a centimeter. Použil som teda príkaz switch, ktorý vypočítava hodnotu na základe vybranej premennej riadku.

- (IBAction) Convert: (UIButton *) sender {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) switch (selectedRow) {case 0: // Celsius to Fahrenheit res = (val * 1.8) + 32 zlomový prípad 1: // Fahrenheit do Celzia res = (val-32) / 1,8 1,8 zlomový prípad 2: // Meter na Centimeter res = val * 100 zlomový prípad 3: // Centimeter na Meter res = val * 0,01 zlom predvolené: res = 0.0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

ak spustíte aplikáciu, môžeme vidieť, že všetko funguje dobre.

Teraz môžeme skontrolovať výnimky, ktoré sa môžu vyskytnúť v našej aplikácii. Napríklad v textovom poli nie je žiadna hodnota. Alebo sa snažíme prevádzať z Celzia na Meter alebo Centimeter, čo v skutočnosti nie je možné. Tieto typy situácií sa nazývajú výnimky a musíme sa im vyhnúť napísaním kódu, ktorý by tieto chyby zvládol.

Vyriešime prvý druh chyby, ktorá sa môže vyskytnúť pri spustení našej aplikácie. To znamená, že nám chýba, aby sme do textového poľa napísali našu hodnotu, ktorá má byť prevedená. V tomto scenári musíme našich používateľov upozorniť na zadanie hodnoty a potom pokračovať.

Na to môžeme použiť UIAlertView. Môžeme napísať metódu s názvom showAlertWithMessage (NSString *) message. V tejto metóde môžeme vyhlásiť alertView a potom ho nakoniec zobraziť pomocou metódy show (). Kód metódy bude nasledovný.

- (void) showAlertWithMessage: (NSString *) message {UIAlertView * alertView = [[UIAlertView alloc] initWithTitle: @ 'Chybná' správa: delegát správy: self cancelButtonTitle: nil otherButtonTitles: @ 'Dobre', nil] alertView.tag = 100 _ResultLabel.text=@'No Result '[alertView show]}

Táto metóda, keď používateľ klikne na tlačidlo prevodu, sa teraz musí nazývať ako prevod. Prepočet by sa nemal robiť bez zadania hodnoty. Takže v definícii metódy pre prevod musíme skontrolovať, či je dĺžka textového poľa väčšia alebo rovná nule alebo nie. Ak je to potom vykonať konverziu, inak zobraziť výstrahu. Preto by kód tlačidla prevodu mal byť nasledovný:

- (IBAction) Convert: (UIButton *) sender {if ([_ ValueTextField.text length]<= 0) { [self showAlertWithMessage:@' Please enter the value'] } else { float res=0.0 float val=[_ValueTextField.text floatValue] NSLog(@'value %f',val) switch(selectedRow) { case 0:// Celsius to Fahrenheit res=(val*1.8)+32break case 1: // Fahrenheit to Celsius res=(val-32)/1.8break case 2: // meter to centimeter res= val*100 break case 3://centimeter to meter res=val*0.01 break default: res=0.0 } NSString *final= [NSString stringWithFormat:@'%.02f',res] _ResultLabel.text = final } }

Teraz spustite aplikáciu a skúste kliknúť na tlačidlo previesť bez zadávania hodnôt do textového poľa.

Druhý typ výnimky, ktorá by sa mohla vyskytnúť, je, ak sa hodnota v prvej zložke nezhoduje s hodnotou v druhej zložke UIPickerView. Za týmto účelom skontrolujeme, či sa aktuálna vybratá hodnota riadku druhého komponentu rovná hodnote riadkovej hodnoty vrátenej delegátom metódy didSelectRow (). Ak sa podmienka nezhoduje, prevod nie je možný a ak sa hodnoty zhodujú, je možné vykonať prevod.

Túto logiku môžeme implementovať nasledovne,

- (IBAction) Convert: (UIButton *) sender {if ([_ ValueTextField.text length]<= 0) { [self showAlertWithMessage:@' Please enter the value'] } else { _ResultLabel.textColor= [UIColor blackColor] float res=0.0 NSInteger n =[_picker2 selectedRowInComponent:data2comp] if(n==secondrow) { float val=[_ValueTextField.text floatValue] NSLog(@'value %f',val) switch(selectedRow) { case 0:// Celsius to Fahrenheit res=(val*1.8)+32break case 1: // Fahrenheit to Celsius res=(val-32)/1.8break case 2: // meter to centimeter res= val*100 break case 3://centimeter to meter res=val*0.01 break default: res=0.0 } NSString *final= [NSString stringWithFormat:@'%.02f',res] _ResultLabel.text = final } else { // code for displaying error. _ResultLabel.textColor= [UIColor redColor] _ResultLabel.text = @'Result cannot be calculated' } }

Teraz spustite aplikáciu a uvidíte, že zmeníte hodnotu v druhom komponente po vykonaní výberu v prvom komponente.

Uvidíte chybové hlásenie, že výsledok nie je možné vypočítať. Všimnete si, že chybové hlásenie bolo vytlačené na rovnakom štítku výsledku a správa je dlhá. Preto bol štítok presunutý nadol z predchádzajúcej orientácie.

Naša konverzná aplikácia je teda hotová. Aplikácii môžete pridať ďalšie funkcie podľa svojho výberu a podľa svojej kreativity ju skrášliť.

Máte na nás otázku? Uveďte ich v sekcii komentárov a my sa vám ozveme.

Súvisiace príspevky:

prevod binárneho formátu na desatinné číslo v jave