Aplikacija za iOS: delo z večkomponentnim izbirnikom



Ta spletni dnevnik govori o ustvarjanju aplikacije ios, ki prikazuje pretvorbo iz ene enote v drugo. Opisuje delovanje Mutlicomponent Pickerja, opozoril itd.

Za popoln vpogled preberite . To je drugi blog iz serije aplikacij ios.





Če ste izkušen razvijalec, ki vas zanima delovanje večkomponentnega nabiralnika, ste prišli na pravi spletni dnevnik. V tem blogu bom govoril o tem, kako razširiti našo aplikacijo za pretvorbo z več funkcionalnostmi z uporabo večkomponentnega izbirnika in tudi, kako izvesti izjemno obdelavo z uporabo opozoril.

Vzadnji blog,to smo že videli ko vtipkamo nekaj v besedilno polje, se pojavi tipkovnica. Vrednost, ki jo je treba pretvoriti, vtipkamo v besedilno polje in nato vidimo, da tipkovnica ne izgine.



Da bi rešili to težavo, moramo dodati gumb, ki pokriva celoten pogled. Ko se uporabnik dotakne kamor koli v ozadju, naj tipkovnica izgine.

Zdaj pa pojdiva naprej. Povlecite gumb, nastavite vrsto gumba kot meri in barvo besedila kot pregledno barvo iz preglednika atributov.

Inšpektor lastnosti



in izberite Urejevalnik> Uredi> Pošlji nazaj

in spremenite velikost gumba tako, da ustreza celotnemu pogledu.

Ta gumb zdaj deluje kot nevidni gumb v ozadju, na katerega kliknete, da tipkovnica izgine. Zapišimo IBAction za isto, izberite način urejanja pomočnika in nadzor + povlecite na ViewController.h. Nastavite Connection na Action in poimenujte BackgroundButton in kliknite connect.

kako spremeniti pot jave -

Koda krmilnika pogleda je zdaj videti tako.

#import @interface ViewController: UIViewController @property (strong, nonatomic) IBOutlet UITextField * ValueTextField @property (strong, nonatomic) IBOutlet UIPickerView * picker2 @property (strong, nonatomic) NSArray * data @propertyIL strongbel, strong - (IBAction) Pretvori: (UIButton *) pošiljatelj - (IBAction) backgroundButton: (id) sender @end

Preklopite na ViewController.m in nato napišite naslednjo kodo.

- (IBAction) backgroundButton: (id) pošiljatelj {[_ValueTextField resignFirstResponder] [_picker2 resignFirstResponder] [_ResultLabel resignFirstResponder]}

Tu koda vsem ostalim predmetom sporoči, naj ob odkritju dodelijo status prvega odzivnika. Zdaj zaženite aplikacijo in poglejte. Ko se dotaknete ozadja, boste ugotovili, da tipkovnica izgine. Zdaj, ko se tipkovnica konča, ko končate s tipkanjem, pokličite metodo backgroundButton v metodi didselectRow () izbirnika. Koda metode bo naslednja.

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) vrstica inComponent: (NSInteger) komponenta {selectedValue = _data [row] [self backgroundButton: 0]}

Zdaj lahko delate na delu za polepšanje aplikacije, kot je dodajanje ozadja in morda celo dajanje modne slike gumba. Vendar pa bom v svojem nastavil sliko za ozadje.
Če želite to narediti, najprej poiščite ustrezno sliko! Nato ga dodajte v mapo Images.xcassets in sliko spremenite iz 1x na 2x zaslon v univerzalni obliki.

Zaženite aplikacijo in preverite, ali deluje dobro.

Če zamenjam napravo na iphone 5s.

In zaženite aplikacijo.

Tu lahko vidimo, da vse deluje v skladu s pričakovanji. Kaj pa, če bi svojemu gumbu želel dodati ozadje in narediti videz bolj podoben gumbu? Da bi to naredil, bi najprej dodal IBOutlet za gumb za pretvorbo v ViewController.h

@property (močno, neatomsko) IBOutlet UIButton * pretvori

in nato v metodo viewDidLoad () dodajte naslednjo kodo

self.convert.backgroundColor = [UIColor colorWithRed: 0,4 zelena: 0,8 modra: 1,0 alfa: 1,0] [_convert setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]

Zaženimo aplikacijo in preverimo, ali je tako, kot nam je všeč.

OK super! Verjetno ste opazili, da sem spremenil tudi položaje oznake z rezultati, razlog za spremembo je nekaj, kar bom razložil kasneje.

Vemo, da se naša aplikacija pretvori iz Celzija v Fahrenheit in obratno. Torej, kako bi bilo dodati še nekaj funkcij ali enot za pretvorbo? Če želite to narediti, moramo v UIPickerView dodati še eno komponento, ki daje ustrezno izbiro, ko je enota izbrana v prvi komponenti izbirnika.

Če želimo izbirnik razdeliti na dve komponenti, moramo dodati nov NSArray data2, ki bo vseboval podatke za drugo komponento. Določite tudi dve konstanti, ki bosta predstavljali naši dve komponenti. Tu je leva komponenta razglašena za 0, desna komponenta pa zaradi enostavnosti programiranja.

Vaša datoteka ViewController.h je videti tako

#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 * dataproperty) močan, neatomski) NSArray * data2 @property (strong, nonatomic) IBOutlet UILabel * ResultLabel @property (strong, nonatomic) IBOutlet UIButton * convert - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @end

Zdaj definirajte matriko data2 v metodi ViewDidLoad (). Zdaj, ko imamo oba vira podatkov, moramo biti sposobni napisati kodo za nabiralnik tako, da se mora, ko izberemo element iz prve komponente izbirnika, druga komponenta samodejno spremeniti v ustrezno vrednost. Druga komponenta je odvisna od izbire prve.
Za to moramo določiti slovar, v katerem bodo shranjeni ključi in vrednosti. Ključi vsebujejo podatke, ki ustrezajo prvi komponenti izbirnika, vrednosti pa podatke, ki ustrezajo drugi komponenti izbirnika.

- (void) viewDidLoad {[super viewDidLoad] // Po nalaganju pogleda izvedite kakršno koli dodatno nastavitev, običajno iz konice. _data1 = [NSArray arrayWithObjects: @ 'Celsius', @ 'Fahrenheit', @ 'Meter', @ 'Centimeter', nil] data2 = [NSArray arrayWithObjects: @ 'Centimeter', @ 'Meter', @ 'Fahrenheit', @ 'Celzija', nič] slovar = [NSDictionary dictionaryWithObjectsAndKeys: @ 'Celcius', @ 'Farenheit', @ 'Farenheit', @ 'Celcius', @ 'Meter', @ 'Centimeter', @ 'Centimeter', @ 'Meter ', nič] self.view.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageNamed: (@' bg2.png ']]]}

Zdaj moramo spremeniti vir podatkov in prenesti metode trenutnega izbirnika na naslednje, tako da imamo podatke v obeh komponentah.

- (NSInteger) numberOfComponentsInPickerView: (UIPickerView *) pickerView {return 2} - (NSInteger) pickerView: (UIPickerView *) pickerView numberOfRowsInComponent: (NSInteger) komponenta {if (komponenta == data1compta.vota [self.data2 count]} - (NSString *) pickerView: (UIPickerView *) pickerView titleForRow: (NSInteger) vrstica zaComponent: (NSInteger) komponenta {if (komponenta == data1comp) {return [self.data1 objectAtIndex: row]} vrni [self.data2 objectAtIndex: vrstica]} - (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) vrstica inComponent: (NSInteger) komponenta {[self backgroundButton: 0] if (komponenta == 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: data2comp11 selectedV = vrstica}}

Tukaj v naši metodi didSelectRow () dobimo izbrano vrednost prve komponente, nato jo posredujemo kot argument metodi objectForKey () slovarja in dobimo ustrezno vrednost za ključ. Za iskanje ustreznega položaja vrednosti v drugi matriki, tj. Data2, uporabimo metodo indexOfObject () matrike in rezultat shranimo v celoštevilčno vrednost.
Nato to celoštevilčno vrednost posredujemo metodi izbirnika selectRow: row inComponent: component (). In znova naložite komponento izbirnika s pomočjo reloadComponent ().
Ko to storimo, ko izberemo en element iz prve komponente, bo ustrezen element izbran v drugi komponenti izbirnika.

Koda za didSelectRow ()

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) vrstica inComponent: (NSInteger) komponenta {[self backgroundButton: 0] if (komponenta == data1comp) {NSString * data11 = [_ data1 objectAtIndex: row] NSAr a = [object objectForKey: data11] secondrow = [self.data2 indexOfObject: a] [_picker2 selectRow: secondrow inComponent: data2comp animirano: DA] [_picker2 reloadComponent: data2comp] selectedValue = data11 selectedRow = row}}

Zdaj zaženite aplikacijo in preverite, ali izbirnik deluje po pričakovanjih.

Voila! deluje!

Torej nadaljujmo s kodiranjem gumba za pretvorbo. Prejšnji izbirnik je imel le dve vrednosti, ki sta se ujemali, tj. Celzija in Fahrenheita, nato pa je bil izračunan rezultat. Zdaj pa imamo štiri vrednosti Celzija, Fahrenheita, Metra in Centimetra. Zato sem uporabil stavek switch, ki izračuna vrednost na podlagi izbrane spremenljivke vrstice.

- (IBAction) Pretvori: (UIButton *) pošiljatelj {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) stikalo (selectedRow) {case 0: // Celzija v Fahrenheit res = (val * 1.8) + 32break primer 1: // Fahrenheit do Celzija res = (val-32) /1.8break primer 2: // Meter do Centimeter res = val * 100 break primer 3: // Centimeter do Meter res = val * 0,01 break privzeto: res = 0.0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

če zaženete aplikacijo, lahko vidimo, da vse deluje v redu.

Zdaj lahko preverimo izjeme, ki se lahko pojavijo v naši aplikaciji. V besedilnem polju na primer ni vrednosti. Ali pa poskušamo pretvoriti iz Celzija v meter ali centimeter, kar dejansko ni mogoče. Tovrstne situacije se imenujejo izjeme, zato se jim moramo izogniti s pisanjem kode za obravnavo takšnih napak.

Odpravimo prvo vrsto napake, ki se lahko pojavi, ko zaženemo aplikacijo. To pomeni, da pogrešamo, da bi v besedilno polje zapisali svojo vrednost, ki jo želimo pretvoriti. V tem primeru moramo uporabnike opozoriti, da vnesejo vrednost in nato nadaljujejo.

Za to lahko uporabimo UIAlertView. Napišemo lahko metodo z imenom showAlertWithMessage (NSString *). Pri tej metodi lahko razglasimo alarmView in ga nato dokončno prikažemo z uporabo metode show (). Koda metode bo naslednja.

- (void) showAlertWithMessage: (NSString *) message {UIAlertView * alertView = [[UIAlertView alloc] initWithTitle: @ 'Error' message: delegat sporočila: self cancelButtonTitle: nil otherButtonTitles: @ 'Okay', niltag = V _ResultLabel.text=@'Ni rezultat '[alertView show]}

Zdaj je treba to metodo, ko uporabnik klikne gumb za pretvorbo, poklicati kot pretvorbo. Pretvorbe ne smete opraviti brez vnosa vrednosti. Torej v definiciji metode za pretvorbo moramo preveriti, ali je dolžina besedilnega polja večja ali enaka nič ali ne. Če je potem izvedite pretvorbo, sicer prikažite opozorilo. Zato bi bila koda gumba za pretvorbo takšna:

- (IBAction) Pretvori: (UIButton *) pošiljatelj {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 } }

Zdaj zaženite aplikacijo in poskusite klikniti gumb za pretvorbo, ne da bi v besedilno polje vnesli vrednosti.

Druga vrsta izjeme, do katere bi lahko prišlo, je, če se vrednost v prvi komponenti ne ujema z vrednostjo v drugi komponenti UIPickerView. Za to preverimo, ali je trenutna vrednost vrstice izbrane komponente druge komponente enaka vrednosti vrednosti vrstice, ki jo vrne delegat metode didSelectRow (). Če se pogoj ne ujema, pretvorba ni mogoča in če se vrednosti ujemajo, je pretvorbo mogoče izvesti.

pojdi na primer c ++

To logiko lahko izvajamo na naslednji način,

- (IBAction) Pretvori: (UIButton *) pošiljatelj {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' } }

Zdaj zaženite aplikacijo in si oglejte tako, da spremenite vrednost v drugi komponenti, potem ko izberete prvo komponento.

Vidite lahko sporočilo o napaki, da rezultata ni mogoče izračunati. Opazili boste, da je bilo sporočilo o napaki natisnjeno na isti nalepki z rezultatom in da je sporočilo dolgo. Zato je bila etiketa premaknjena s prejšnje usmeritve.

Torej, naša aplikacija za pretvorbo je popolna. Aplikaciji lahko dodate več funkcionalnosti po svoji izbiri in jo polepšate glede na svojo ustvarjalnost.

Imate vprašanje za nas? Omenite jih v oddelku za komentarje in javili se vam bomo.

Sorodne objave: