Aplikace pro iOS: Práce s výběrem více komponent



Tento blog je o vytváření aplikace pro iOS, která zobrazuje převod z jedné jednotky na druhou. Popisuje fungování nástroje Mutlicomponent Picker, výstrah atd.

Chcete-li získat důkladný vhled, přečtěte si prosím . Toto je druhý blog ze série aplikací pro iOS.





Pokud jste zkušený vývojář, který se zajímá o práci nástroje MultiComponent picker, pak jste přišli na správný blog. V tomto blogu budu hovořit o tom, jak rozšířit naši konverzní aplikaci o více funkcí implementací vícenásobného výběru, a také o tom, jak provádět výjimečné zpracování pomocí výstrah.

Vposlední blog,viděli jsme to když něco napíšeme do textového pole, objeví se klávesnice. Hodnota, která má být převedena, je zadána do textového pole a pak vidíme, že klávesnice nezmizí.



Abychom tento problém vyřešili, musíme přidat tlačítko, které pokrývá celý pohled. Když se uživatel dotkne kdekoli na pozadí, klávesnice by měla zmizet.

Pojďme do toho a udělejme to. Přetáhněte tlačítko, v inspektoru atributů nastavte typ tlačítka jako vlastní a barvu textu jako jasnou barvu.

Atributy inspektor



a vyberte Editor> Uspořádat> Odeslat dozadu

a změnit velikost tlačítka tak, aby se vešel na celý pohled.

Toto tlačítko nyní funguje jako neviditelné tlačítko na pozadí, na které klepne klávesnice, aby zmizelo. Pojďme psát IBAction pro stejné, vyberte režim editoru asistenta a ovládání + přetáhněte na ViewController.h. Nastavte připojení na akci a název na BackgroundButton a klikněte na připojit.

Kód řadiče pohledu teď vypadá takto.

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

Přepněte na ViewController.m a poté napište následující kód.

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

Zde kód říká všem ostatním objektům, aby při detekci dotyku poskytly stav první odpovědi. Nyní spusťte aplikaci a uvidíte. Když se dotknete pozadí, zjistíte, že klávesnice zmizí. Teď, když se klávesa dostane do psaní, zavolejte metodu backgroundButton v metodě didselectRow () nástroje pro výběr. Kód metody bude tedy následující.

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) řádek inComponent: (NSInteger) komponenta {selectedValue = _data [řádek] [vlastní pozadíButton: 0]}

Nyní můžete pracovat na zkrášlovací části aplikace, jako je přidání pozadí a možná dokonce poskytnutí efektního obrázku tlačítka. V mém případě však nastavím obrázek na pozadí.
Chcete-li to provést, najděte nejprve vhodný obrázek! Pak jej přidejte do složky Images.xcassets a změňte obrázek z 1x na 2x obrazovku univerzálně.

Spusťte aplikaci a zkontrolujte, zda funguje dobře.

Pokud změním zařízení na iphone 5s.

A spusťte aplikaci.

Zde vidíme, že vše funguje podle očekávání. A co kdybych chtěl přidat pozadí ke svému tlačítku a udělat vzhled jako tlačítko? K tomu bych nejprve přidal IBOutlet pro tlačítko převodu do ViewController.h

@property (silný, neaatomický) IBOutlet UIButton * převést

a pak přidejte následující kód v metodě viewDidLoad ()

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

Spusťme naši aplikaci a uvidíme, jestli se nám to líbí.

co je tlumočník v Javě

OK skvěle! Určitě jste si všimli, že jsem změnil také pozice výsledkového štítku, důvod změny je něco, co vysvětlím později.

Víme, že naše aplikace převádí pouze z Celsia na Fahrenheita a naopak. A co tak přidat několik dalších funkcí nebo jednotek k převodu? Abychom to mohli udělat, musíme do UIPickerView přidat ještě jednu komponentu, která dává vhodný výběr, když je v první komponentě výběru vybrána jednotka.

Abychom mohli výběr rozdělit na dvě komponenty, musíme přidat nový NSArray data2, který bude obsahovat data pro druhou komponentu. Definujte také dvě konstanty, které budou představovat naše dvě komponenty. Zde je pro jednoduchost programování deklarována levá komponenta 0 a pravá komponenta 1.

Váš soubor ViewController.h vypadá

#import # definovat data1comp 0 # definovat data2comp 1 @ rozhraní ViewController: UIViewController @property (silný, neaatomický) IBOutlet UITextField * ValueTextField @property (silný, neaatomický) IBOutlet UIPickerView * picker2 @property (silný, * anatomický) NSArty silný, nonatomic) NSArray * data2 @property (silný, nonatomic) IBOutlet UILabel * ResultLabel @property (silný, nonatomic) IBOutlet UIButton * convert - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @konec

Nyní definujte pole data2 v metodě ViewDidLoad (). Nyní, když máme oba zdroje dat, musíme být schopni napsat kód pro výběr takovým způsobem, že když vybereme položku z první komponenty výběru, druhá součást by se měla automaticky změnit na odpovídající hodnotu. Druhá složka je závislá na výběru první.
K tomu musíme definovat slovník, který bude ukládat klíče a hodnoty. Klíče obsahují data odpovídající první složce výběru a hodnoty obsahují data odpovídající druhé složce výběru.

- (void) viewDidLoad {[super viewDidLoad] // Po načtení zobrazení proveďte jakékoli další nastavení, obvykle 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 ')]]}}

Nyní musíme změnit zdroj dat a delegovat metody aktuálního výběru na následující, abychom měli data vyplněná v obou komponentách.

- (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) řádek proComponent: (NSInteger) komponenta {if (komponenta == data1comp) {návrat [self.data1 objectAtIndex: řádek]} návrat [self.data2 objectAtIndex: row]} - (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) řádek 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: data2comp] selectedValue = řádek}}

Tady v naší metodě didSelectRow () získáváme vybranou hodnotu první komponenty, poté ji předáme jako argument metodě objectForKey () ve slovníku a získáme odpovídající hodnotu pro klíč. Abychom našli odpovídající pozici pro hodnotu v druhém poli, tj. Data2, použijeme metodu indexOfObject () pole a uložíme výsledek do celočíselné hodnoty.
Tuto celočíselnou hodnotu pak předáme metodě picker selectRow: row inComponent: component (). A znovu načtěte komponentu pro výběr pomocí reloadComponent ().
Jakmile to uděláme, protože vybereme jednu položku z první komponenty, bude odpovídající položka vybrána ve druhé komponentě nástroje pro výběr.

Kód pro didSelectRow ()

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) řádek inComponent: (NSInteger) komponenta {[vlastní pozadíButton: 0] if (komponenta == data1comp) {NSString * data11 = [_ data1 objectAtIndex: řádek] NSArray * a = [slovník objectForKey: data11] secondrow = [self.data2 indexOfObject: a] [_picker2 selectRow: secondrow inComponent: data2comp animated: YES] [_picker2 reloadComponent: data2comp] selectedValue = data11 selectedRow = řádek}}

Nyní spusťte aplikaci a zjistěte, zda výběr funguje podle očekávání.

Voila! funguje to!

Pokračujme tedy v kódování našeho tlačítka pro převod. Předchozí výběr měl pouze dvě hodnoty, které se shodovaly, tj. Celsia a Fahrenheita, a poté byl vypočítán výsledek. Ale teď máme čtyři hodnoty Celsia, Fahrenheita, Metr a Centimetr. Takže jsem použil příkaz switch, který vypočítá hodnotu na základě vybrané proměnné řádku.

- (IBAction) Convert: (UIButton *) sender {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) switch (selectedRow) {case 0: // Celsius to Fahrenheit res = (val * 1.8) + 32break případ 1: // Fahrenheit na Celsius res = (val-32) / 1,8 break případ 2: // Metr na centimetr res = val * 100 případ zlomu 3: // Centimetr na metr res = val * 0,01 zlom výchozí: res = 0.0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

pokud aplikaci spustíte, vidíme, že vše funguje dobře.

Nyní můžeme zkontrolovat výjimky, ke kterým může dojít v naší aplikaci. Například v textovém poli není žádná hodnota. Nebo se snažíme převést z Celsia na Metr nebo Centimetr, což ve skutečnosti není možné. Tyto typy situací se nazývají jako výjimky a musíme se jim vyhnout tím, že napíšeme kód, abychom takové chyby zvládli.

Pojďme vyřešit první druh chyby, ke které může dojít při spuštění naší aplikace. To znamená, že nám chybí, abychom do textového pole napsali naši hodnotu, která má být převedena. V tomto scénáři musíme upozornit naše uživatele, aby zadali hodnotu a poté pokračovali.

K tomu můžeme použít UIAlertView. Můžeme napsat metodu s názvem showAlertWithMessage (NSString *) message. V této metodě můžeme deklarovat alertView a nakonec jej zobrazit pomocí metody show (). Kód metody bude následující.

- (void) showAlertWithMessage: (NSString *) message {UIAlertView * alertView = [[UIAlertView alloc] initWithTitle: @ 'Error' message: message delegate: self cancelButtonTitle: nil otherButtonTitles: @ 'Dobře', nil] alertView.tag = 100 _ResultLabel.text=@'No Result '[alertView show]}

Tuto metodu, když uživatel klikne na tlačítko převést, je nyní třeba volat jako převod. Převod by neměl být proveden bez zadání hodnoty. Takže v definici metody pro převod musíme zkontrolovat, zda je délka textového pole větší nebo rovna nule nebo ne. Pokud je to pak provést převod, jinak zobrazit výstrahu. Kód tlačítka převodu by tedy vypadal takto:

- (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 } }

Nyní spusťte aplikaci a zkuste kliknout na tlačítko převést bez zadávání hodnot do textového pole.

Druhý typ výjimky, ke které může dojít, je, pokud hodnota v první komponentě neodpovídá hodnotě v druhé komponentě UIPickerView. Za tímto účelem zkontrolujeme, zda se aktuální hodnota řádku vybrané komponenty druhé komponenty rovná hodnotě hodnoty řádku vrácené delegátem didSelectRow () metody. Pokud podmínka neodpovídá, není převod možný a pokud se hodnoty shodují, lze provést převod.

Tuto logiku můžeme implementovat následovně,

- (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' } }

Nyní spusťte aplikaci a podívejte se změnou hodnoty ve druhé komponentě poté, co provedete výběr v první komponentě.

Můžete vidět chybovou zprávu, že výsledek nelze vypočítat. Všimnete si, že chybová zpráva byla vytištěna na stejném štítku výsledku a že je dlouhá. Proto byl štítek přesunut dolů z dřívější orientace.

Naše aplikace pro převod je tedy kompletní. Do aplikace můžete přidat další funkce podle svého výběru a vylepšit ji podle vaší kreativity.

Máte na nás dotaz? Uveďte je v sekci komentáře a my se vám ozveme.

Související příspěvky:

převést datum řetězce na datum