Aplicativo iOS: trabalhando com o seletor de vários componentes



Este blog é sobre como criar um aplicativo ios que exibe a conversão de uma unidade para outra. Descreve o funcionamento de um selecionador de componentes múltiplos, alertas etc.

o que é o tipo de casting em java

Para obter uma visão completa, leia . Este é o segundo blog da série de aplicativos para iOS.





Se você é um desenvolvedor experiente e está curioso sobre o funcionamento do seletor MultiComponent, então você veio ao blog certo. Neste blog, falarei sobre como estender nosso aplicativo de conversão com mais funcionalidade, implementando um seletor de multicomponentes, e também como realizar um tratamento excepcional usando alertas.

Noúltimo blog,nós vimos isso quando digitamos algo no campo de texto, o teclado aparece. O valor a ser convertido é digitado no campo de texto e então vemos que o teclado não desaparece.



Para resolver este problema, temos que adicionar um botão que cubra toda a visualização. Quando o usuário toca em qualquer lugar no fundo, o teclado deve desaparecer.

Agora, vamos em frente e fazer isso. Arraste um botão, defina o tipo do botão como personalizado e a cor do texto como cor clara no inspetor de atributos.

Inspetor de atributos



e selecione Editor> Organizar> Enviar para trás

e redimensione o botão de forma que se ajuste a toda a visualização.

Este botão agora atua como um botão invisível de fundo que é clicado para o teclado desaparecer. Vamos escrever IBAction para o mesmo, selecionar o modo do editor assistente e controlar e arrastar para o ViewController.h. Defina a Conexão para a ação e o nome como BackgroundButton e clique em conectar.

O código do controlador de visualização se parece com isso agora.

#import @interface ViewController: UIViewController @property (forte, não atômico) IBOutlet UITextField * ValueTextField @property (forte, não atômico) IBOutlet UIPickerView * picker2 @property (forte, não atômico) NSArray * dados @letty (forte, não atômico) IBOutlet IBOutlet - (IBAction) Converter: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @end

Alterne para ViewController.m e escreva o código a seguir.

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

Aqui, o código diz a todos os outros objetos para produzir o status de primeiro a responder quando um toque é detectado. Agora, execute o aplicativo e veja. Você poderá descobrir que o teclado desaparece ao tocar no fundo. Agora, para o teclado sair quando você terminar de digitar, chame o método backgroundButton no método didselectRow () do seletor. Portanto, o código do método será o seguinte.

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

Agora, você pode trabalhar na parte de embelezamento do aplicativo, como adicionar um plano de fundo e talvez até mesmo dar uma imagem de botão sofisticada. Porém, no meu, estarei definindo uma imagem de fundo.
Para fazer isso, encontre uma imagem apropriada primeiro duh! Em seguida, adicione-o à pasta Images.xcassets e altere a imagem da tela 1x para 2x no universal.

Execute o aplicativo e veja se funciona bem.

Se eu mudar o dispositivo para iphone 5s.

E execute o aplicativo.

Aqui podemos ver que tudo funciona bem como esperado. Agora, e se eu quisesse adicionar um plano de fundo ao meu botão e torná-lo mais parecido com um botão? Para fazer isso, primeiro eu adicionaria um IBOutlet para o botão de conversão ao ViewController.h

@property (strong, nonatomic) IBOutlet UIButton * convert

e, em seguida, adicione o seguinte código no método viewDidLoad ()

self.convert.backgroundColor = [UIColor colorWithRed: 0.4 green: 0.8 blue: 1.0 alpha: 1.0] [_convert setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]

Vamos rodar nosso aplicativo e ver se é do jeito que gostamos.

OK ótimo! Você deve ter notado que também mudei as posições do rótulo do resultado, o motivo da mudança é algo que explicarei mais tarde.

Sabemos que nosso aplicativo converte de Celsius para Fahrenheit e vice-versa apenas. Então, que tal adicionar mais algumas funções ou unidades para converter? Para isso, precisamos adicionar mais um componente ao UIPickerView que forneça a seleção apropriada, quando uma unidade é selecionada no primeiro componente do seletor.

Para fazer um seletor dividido em dois componentes, precisamos adicionar um novo NSArray data2, que conterá os dados para o segundo componente. Além disso, defina duas constantes que representarão nossos dois componentes. Aqui, o componente esquerdo é declarado 0 e o componente direito é declarado 1 para simplicidade de programação.

Seu arquivo ViewController.h parece

#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) @property (strong, nonatomic) NSArray1 strong, nonatomic) NSArray * data2 @property (strong, nonatomic) IBOutlet UILabel * ResultLabel @property (forte, não atômico) IBOutlet UIButton * convert - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @fim

Agora defina o array data2 no método ViewDidLoad (). Agora que temos as duas fontes de dados, devemos ser capazes de escrever código para o selecionador de forma que, quando selecionarmos um item do primeiro componente do selecionador, o segundo componente seja alterado automaticamente para o valor correspondente. O segundo componente depende da seleção do primeiro.
Para isso, precisamos definir um dicionário que armazenará as chaves e valores. As chaves contêm os dados correspondentes ao primeiro componente do selecionador e os valores contêm os dados correspondentes ao segundo componente do selecionador.

- (void) viewDidLoad {[super viewDidLoad] // Faça qualquer configuração adicional após carregar a visualização, normalmente de uma ponta. _data1 = [NSArray arrayWithObjects: @ 'Celsius', @ 'Fahrenheit', @ 'Medidor', @ 'Centímetro', nil] data2 = [NSArray arrayWithObjects: @ 'Centímetro', @ 'Medidor', @ 'Fahrenheit', @ 'Celsius', nil] dictionary = [NSDictionary dictionaryWithObjectsAndKeys: @ 'Celcius', @ 'Farenheit', @ 'Farenheit', @ 'Celcius', @ 'Meter', @ 'Centimeter', @ 'Centimeter', @ 'Meter ', nil] self.view.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageNamed: (@' bg2.png ')]]}

Agora, devemos alterar a fonte de dados e os métodos de delegação do selecionador atual para o seguinte, de modo que tenhamos os dados preenchidos em ambos os componentes.

- (NSInteger) numberOfComponentsInPickerView: (UIPickerView *) pickerView {return 2} - (NSInteger) pickerView: (UIPickerView *) pickerView numberOfRowsInComponent: (NSInteger) componente {if (component == data1comp) {return [self.data1 count] [self.data2 count]} - (NSString *) pickerView: (UIPickerView *) pickerView titleForRow: (NSInteger) row forComponent: (NSInteger) component {if (component == data1comp) {return [self.data1 objectAtIndex: row]} return [self.data2 objectAtIndex: row]} - (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) row inComponent: (NSInteger) component {[self backgroundButton: 0] if (component == 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] selectedVal = linha}}

Aqui em nosso método didSelectRow (), estamos obtendo o valor selecionado do primeiro componente, então o passamos como argumento para o método objectForKey () do dicionário e obtemos o valor correspondente para a chave. Para encontrar a posição correspondente para o valor na segunda matriz, ou seja, data2, usamos o método indexOfObject () da matriz e armazenamos o resultado em um valor inteiro.
Em seguida, passamos esse valor inteiro para o método seletor selectRow: row inComponent: component () method. E recarregue o componente do seletor usando reloadComponent ().
Feito isso, ao selecionarmos um item do primeiro componente, o item correspondente será selecionado no segundo componente do seletor.

O código para didSelectRow ()

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) row inComponent: (NSInteger) component {[self backgroundButton: 0] if (component == 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 = data11 selectedRow = row}}

Agora execute o aplicativo e veja se o seletor funciona conforme o esperado.

Voila! funciona!

Portanto, vamos continuar a codificar nosso botão de conversão. O seletor anterior tinha apenas dois valores para corresponder, ou seja, Celsius e Fahrenheit e, em seguida, o resultado foi calculado. Mas agora temos quatro valores Celsius, Fahrenheit, Metro e Centímetro. Portanto, usei uma instrução switch, que calcula o valor com base na variável de linha selecionada.

- (IBAction) Converter: (UIButton *) sender {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) switch (selectedRow) {case 0: // Celsius para Fahrenheit res = (val * 1.8) + 32 break case 1: // Fahrenheit para Celsius res = (val-32) /1.8break case 2: // Metro para centímetro res = val * 100 break case 3: // Centímetro para Metro res = val * 0.01 break padrão: res = 0,0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

se você executar o aplicativo, podemos ver que tudo funciona bem.

Agora, podemos verificar se há exceções que podem ocorrer em nosso aplicativo. Por exemplo, não há valor na caixa de texto. Ou estamos tentando converter de Celsius para Metro ou Centímetro, o que na verdade não é possível. Esses tipos de situação são chamados de exceções e devemos evitá-los escrevendo um código para lidar com esses erros.

Vamos resolver o primeiro tipo de erro que pode ocorrer quando executamos nosso aplicativo. Ou seja, deixamos de escrever nosso valor a ser convertido no campo de texto. Para este cenário, devemos alertar nossos usuários para inserir o valor e então prosseguir.

Podemos usar o UIAlertView para isso. Podemos escrever um método chamado showAlertWithMessage (NSString *) message. Nesse método, podemos declarar um alertView e, finalmente, exibi-lo usando o método show (). O código do método será o seguinte.

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

Agora, esse método, quando o usuário clica no botão converter, deve ser chamado de conversão. A conversão não deve ser feita sem inserir o valor. Portanto, na definição do método para converter, devemos verificar se o comprimento do campo de texto é maior ou igual a zero ou não. Se for, faça a conversão, caso contrário, exiba o alerta. Portanto, o código do botão de conversão seria assim:

- (IBAction) Converter: (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 } }

Agora execute o aplicativo e tente clicar no botão converter sem inserir valores no campo de texto.

O segundo tipo de exceção que pode ocorrer é se o valor no primeiro componente não corresponder ao valor no segundo componente do UIPickerView. Para isso, verificamos se o valor da linha do componente selecionado atual do segundo componente é igual ao valor do valor da linha retornado pelo delegado didSelectRow () do método. Se a condição não corresponder, a conversão não será possível e se os valores corresponderem, a conversão pode ser realizada.

Podemos implementar essa lógica da seguinte maneira,

- (IBAction) Converter: (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' } }

Agora execute o aplicativo e veja alterando o valor no segundo componente depois de fazer a seleção no primeiro componente.

Você pode ver a mensagem de erro, que o resultado não pode ser calculado. Você notará que a mensagem de erro foi impressa no mesmo rótulo de resultado e que a mensagem é longa. Portanto, é por isso que o rótulo foi movido para baixo da orientação anterior.

o que é herança múltipla em java

Então, nosso aplicativo de conversão está completo. Você pode adicionar mais funcionalidades ao aplicativo de acordo com sua escolha e torná-lo mais bonito de acordo com sua criatividade.

Tem alguma questão para nós? Mencione-os na seção de comentários e entraremos em contato com você.

Postagens relacionadas: