iOSアプリ:MultiComponentPickerの操作



このブログは、あるユニットから別のユニットへの変換を表示するiOSアプリの作成に関するものです。マルチコンポーネントピッカー、アラートなどの動作について説明します。

完全な洞察を得るために、読んでください 。これは、iOSアプリシリーズの2番目のブログです。





MultiComponent Pickerの動作に興味がある経験豊富な開発者であれば、適切なブログにアクセスできます。このブログでは、マルチコンポーネントピッカーを実装することで、変換アプリをより多くの機能で拡張する方法と、アラートを使用して例外処理を実行する方法について説明します。

の中に最後のブログ、私たちはそれを見てきました テキストフィールドに何かを入力すると、キーボードがポップアップします。変換する値をテキストフィールドに入力すると、キーボードが消えないことがわかります。



この問題を解決するには、ビュー全体をカバーするボタンを追加する必要があります。 ユーザーが背景のどこかに触れると、キーボードが消えます。

それでは、先に進んでそれを実行しましょう。ボタンをドラッグし、属性インスペクターからボタンのタイプをカスタムに設定し、テキストの色をクリアカラーに設定します。

属性インスペクター



[エディター]> [配置]> [最背面へ]を選択します

ビュー全体に収まるようにボタンのサイズを変更します。

このボタンは、キーボードを非表示にするためにクリックされる背景の非表示ボタンとして機能するようになりました。同じようにIBActionを記述し、アシスタントエディタモードを選択して、Controlキーを押しながらViewController.hにドラッグします。 [接続]を[アクション]に設定し、名前を[BackgroundButton]に設定して、[接続]をクリックします。

ビューコントローラのコードは次のようになります。

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

ViewController.mに切り替えて、次のコードを記述します。

マージソートソースコードc ++
-(IBAction)backgroundButton:(id)sender {[_ValueTextField resignFirstResponder] [_picker2 resignFirstResponder] [_ResultLabel resignFirstResponder]}

ここで、コードは他のすべてのオブジェクトに、タッチが検出されたときにファーストレスポンダーのステータスを生成するように指示します。次に、アプリを実行して確認します。背景に触れるとキーボードが消えることがわかります。入力が完了したらキーボードを使用できるようにするには、ピッカーのdidselectRow()メソッドでbackgroundButtonメソッドを呼び出します。したがって、メソッドコードは次のようになります。

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

これで、背景を追加したり、派手なボタンの画像を表示したりするなど、アプリの美化部分に取り組むことができます。ただし、私の場合は背景画像を設定します。
そのためには、まず適切な画像を見つけてください。次に、それをImages.xcassetsフォルダーに追加し、ユニバーサルで画像を1x画面から2x画面に変更します。

アプリを実行して、正常に動作するかどうかを確認します。

デバイスをiphone5sに変更した場合。

そして、アプリを実行します。

ここでは、すべてが期待どおりに正常に機能していることがわかります。ボタンに背景を追加して、ボタンのように見せたい場合はどうすればよいですか?これを行うには、最初に変換ボタンのIBOutletをViewController.hに追加します。

@property(strong、nonatomic)IBOutlet UIButton * convert

次に、viewDidLoad()メソッドに次のコードを追加します

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

アプリを実行して、気に入った方法かどうかを確認しましょう。

よし!結果ラベルの位置も変更したことに気付いたはずですが、変更の理由は後で説明します。

アプリが摂氏から華氏に、またはその逆にのみ変換されることはわかっています。では、変換する関数や単位をさらにいくつか追加してはどうでしょうか。これを行うには、ピッカーの最初のコンポーネントでユニットが選択されたときに、適切な選択を提供するコンポーネントをUIPickerViewにもう1つ追加する必要があります。

ピッカーを2つのコンポーネントに分割するには、2番目のコンポーネントのデータを保持する新しいNSArraydata2を追加する必要があります。また、2つのコンポーネントを表す2つの定数を定義します。ここでは、プログラミングを簡単にするために、左側のコンポーネントを0と宣言し、右側のコンポーネントを1と宣言しています。

ViewController.hファイルは次のようになります

Javaでセッションを作成する方法
#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 * data1 @property( strong、nonatomic)NSArray * data2 @property(strong、nonatomic)IBOutlet UILabel * ResultLabel @property(strong、nonatomic)IBOutlet UIButton * convert-(IBAction)Convert:(UIButton *)sender-(IBAction)backgroundButton:(id)sender @終わり

次に、ViewDidLoad()メソッドで配列data2を定義します。両方のデータソースが用意できたので、ピッカーの最初のコンポーネントからアイテムを選択すると、2番目のコンポーネントが対応する値に自動的に変更されるようにピッカーのコードを記述できる必要があります。 2番目のコンポーネントは、最初のコンポーネントの選択に依存します。
このために、キーと値を格納する辞書を定義する必要があります。キーにはピッカーの最初のコンポーネントに対応するデータが含まれ、値にはピッカーの2番目のコンポーネントに対応するデータが含まれます。

-(void)viewDidLoad {[super viewDidLoad] //ビューを読み込んだ後、通常はペン先から追加の設定を行います。 _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 ')]]}

ここで、現在のピッカーのデータソースとデリゲートメソッドを次のように変更して、両方のコンポーネントにデータを入力する必要があります。

-(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)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:data2companimated:YES] [_picker2 reloadComponent:data2comp] selectedValue = data11 selectedRow =行}}

ここで、didSelectRow()メソッドでは、最初のコンポーネントの選択された値を取得し、それをディクショナリのobjectForKey()メソッドに引数として渡し、対応するキーの値を取得します。 2番目の配列(data2)の値に対応する位置を見つけるには、配列のindexOfObject()メソッドを使用して、結果を整数値に格納します。
次に、この整数値をピッカーメソッドselectRow:row inComponent:component()メソッドに渡します。そして、reloadComponent()を使用してピッカーのコンポーネントをリロードします。
これを実行すると、最初のコンポーネントから1つのアイテムを選択すると、対応するアイテムがピッカーの2番目のコンポーネントで選択されます。

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園芸:YES] [_picker2 reloadComponent:data2comp] selectedValue = data11 selectedRow = row}}

次に、アプリを実行して、ピッカーが期待どおりに機能するかどうかを確認します。

出来上がり!できます!

それでは、変換ボタンのコーディングを続けましょう。以前のピッカーには、摂氏と華氏に一致する2つの値しかなく、結果が計算されました。しかし、今では摂氏、華氏、メートル、センチメートルの4つの値があります。そこで、選択した行変数に基づいて値を計算するswitchステートメントを使用しました。

-(IBAction)Convert:(UIButton *)sender {float val = [_ ValueTextField.text floatValue] NSLog(@ 'value%f'、val)switch(selectedRow){case 0://摂氏から華氏res =(val * 1.8)+ 32breakケース1://華氏から摂氏res =(val-32)/1.8breakケース2://メートルからセンチメートルres = val * 100ブレークケース3://センチメートルからメーターres = val * 0.01ブレークデフォルト:res = 0.0} NSString * final = [NSString stringWithFormat:@ '%。02f'、res] _ResultLabel.text = final}

アプリを実行すると、すべてが正常に機能していることがわかります。

これで、アプリで発生する可能性のある例外を確認できます。たとえば、テキストボックスに値はありません。または、摂氏からメートルまたはセンチメートルに変換しようとしていますが、実際には不可能です。このような状況は例外と呼ばれ、そのようなエラーを処理するコードを記述して回避する必要があります。

アプリケーションの実行時に発生する可能性のある最初の種類のエラーを解決しましょう。つまり、変換する値をテキストフィールドに書き込むことができません。このシナリオでは、値を入力して続行するようにユーザーに警告する必要があります。

これにはUIAlertViewを使用できます。 showAlertWithMessage(NSString *)messageという名前のメソッドを記述できます。このメソッドでは、alertViewを宣言し、最後にshow()メソッドを使用して表示できます。メソッドのコードは次のようになります。

-(void)showAlertWithMessage:(NSString *)message {UIAlertView * alertView = [[UIAlertView alloc] initWithTitle:@ 'Error' message:messageデリゲート:selfcancelButtonTitle:nil otherButtonTitles:@ 'Okay'、nil] alertView.tag = 100 _ResultLabel.text = @ '結果なし' [alertViewshow]}

ここで、ユーザーが変換ボタンをクリックしたときのこのメソッドは、変換として呼び出される必要があります。値を入力せずに変換しないでください。したがって、convertのメソッド定義では、テキストフィールドの長さがゼロ以上であるかどうかを確認する必要があります。その後、変換を実行する場合は、アラートを表示します。したがって、変換ボタンのコードは次のようになります。

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

次に、アプリを実行し、テキストフィールドに値を入力せずに変換ボタンをクリックしてみます。

発生する可能性のある2番目のタイプの例外は、最初のコンポーネントの値がUIPickerViewの2番目のコンポーネントの値と一致しない場合です。このために、2番目のコンポーネントの現在選択されているコンポーネントの行の値が、メソッドのdidSelectRow()デリゲートによって返される行の値の値と等しいかどうかを確認します。条件が一致しない場合、変換は不可能であり、値が一致する場合、変換を実行できます。

このロジックは次のように実装できます。

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

次に、アプリを実行し、最初のコンポーネントで選択を行った後、2番目のコンポーネントの値を変更して確認します。

結果を計算できないというエラーメッセージが表示されます。エラーメッセージが同じ結果ラベルに出力され、メッセージが長いことに気付くでしょう。そのため、ラベルは以前の方向から下に移動されました。

これで、変換アプリが完成しました。選択に応じてアプリに機能を追加し、創造性に応じてアプリをより美しくすることができます。

質問がありますか?コメントセクションでそれらに言及してください。折り返しご連絡いたします。

関連記事: