Εφαρμογή iOS: Εργασία με το MultiComponent Picker

Αυτό το ιστολόγιο αφορά τη δημιουργία μιας εφαρμογής ios που εμφανίζει μετατροπή από τη μία μονάδα στην άλλη. Περιγράφει τη λειτουργία ενός Mutlicomponent Picker, Alerts κ.λπ.



Για να αποκτήσετε μια πλήρη εικόνα, διαβάστε . Αυτό είναι το δεύτερο ιστολόγιο της σειράς εφαρμογών ios.



Εάν είστε έμπειρος προγραμματιστής που είναι περίεργος για τη λειτουργία του MultiComponent picker, τότε έχετε έρθει στο σωστό ιστολόγιο. Σε αυτό το ιστολόγιο, θα μιλήσω για το πώς να επεκτείνουμε την εφαρμογή μετατροπών με περισσότερη λειτουργικότητα εφαρμόζοντας ένα εργαλείο επιλογής πολλών στοιχείων και επίσης πώς να εκτελέσουμε εξαιρετικό χειρισμό χρησιμοποιώντας ειδοποιήσεις.

Στοτελευταίο ιστολόγιο,το έχουμε δει όταν πληκτρολογούμε κάτι στο πεδίο κειμένου, εμφανίζεται το πληκτρολόγιο. Η τιμή που πρόκειται να μετατραπεί πληκτρολογείται στο πεδίο κειμένου και στη συνέχεια βλέπουμε ότι το πληκτρολόγιο δεν εξαφανίζεται.



Για να λύσουμε αυτό το πρόβλημα πρέπει να προσθέσουμε ένα κουμπί που καλύπτει ολόκληρη την προβολή. Όταν ο χρήστης αγγίζει οπουδήποτε στο παρασκήνιο, το πληκτρολόγιο θα εξαφανιστεί.

Τώρα, ας προχωρήσουμε και ας το κάνουμε. Σύρετε ένα κουμπί, ορίστε τον τύπο του κουμπιού ως προσαρμοσμένο και το χρώμα κειμένου ως καθαρό χρώμα από τον επιθεωρητή χαρακτηριστικών.

Επιθεωρητής χαρακτηριστικών



και επιλέξτε Editor> Arrange> Send to Back

και αλλάξτε το μέγεθος του κουμπιού έτσι ώστε να ταιριάζει σε ολόκληρη την προβολή.

Αυτό το κουμπί λειτουργεί τώρα ως αόρατο κουμπί στο οποίο γίνεται κλικ για να εξαφανιστεί το πληκτρολόγιο. Ας γράψουμε το IBAction για το ίδιο, επιλέξτε τη λειτουργία βοηθού επεξεργαστή και ελέγξτε + σύρετε στο ViewController.h. Ορίστε το Connection to Action και το όνομα στο BackgroundButton και κάντε κλικ στο connect.

Ο κωδικός ελεγκτή προβολής μοιάζει τώρα.

#import @interface ViewController: UIViewController @property (strong, nonatomic) IBOutlet UITextField * ValueTextField @property (ισχυρή, μη ατομική) IBOutlet UIPickerView * picker2 @property (ισχυρή, μη-ατομική) NSArray * data @propertyic - (IBAction) Μετατροπή: (UIButton *) αποστολέας - (IBAction) φόντο Κουμπί: (id) αποστολέας @end

Μεταβείτε στο ViewController.m και, στη συνέχεια, γράψτε τον ακόλουθο κώδικα.

- (IBAction) backgroundButton: (id) αποστολέας {[_ValueTextField allowFirstResponder] [_picker2 استعέλευσηFirstResponder] [_ResultLabel استعέρειFirstResponder]}

Εδώ ο κώδικας λέει σε όλα τα άλλα αντικείμενα να αποδώσουν την κατάσταση της πρώτης απόκρισης όταν ανιχνεύεται μια αφή. Τώρα, εκτελέστε την εφαρμογή και δείτε. Θα μπορείτε να διαπιστώσετε ότι το πληκτρολόγιο σβήνει όταν αγγίζετε το φόντο. Τώρα για να πάει το πληκτρολόγιο όταν τελειώσετε με την πληκτρολόγηση, καλέστε τη μέθοδο BackgroundButton στη μέθοδο didselectRow () του εργαλείου επιλογής. Έτσι ο κωδικός της μεθόδου θα έχει ως εξής.

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) row inComponent: (NSInteger) στοιχείο {selectValue = _data [row] [self backgroundButton: 0]}

Τώρα, μπορείτε να εργαστείτε στο τμήμα ομορφιάς της εφαρμογής, όπως να προσθέσετε ένα φόντο και ίσως ακόμη και να δώσετε μια φανταστική εικόνα κουμπιού. Ωστόσο, στο δικό μου, θα ορίσω μια εικόνα φόντου.
Για να το κάνετε αυτό, βρείτε μια κατάλληλη εικόνα πρώτα! Στη συνέχεια, προσθέστε το στο φάκελο Images.xcassets και αλλάξτε την εικόνα από οθόνη 1x σε 2x σε καθολικό.

Εκτελέστε την εφαρμογή και δείτε αν λειτουργεί καλά.

Εάν αλλάξω τη συσκευή σε iPhone 5s.

διαφορά μεταξύ εργαλείων και επεκτάσεων

Και εκτελέστε την εφαρμογή.

Εδώ μπορούμε να δούμε ότι όλα λειτουργούν καλά όπως αναμενόταν. Τώρα τι γίνεται αν ήθελα να προσθέσω ένα φόντο στο κουμπί μου και να κάνω την εμφάνιση περισσότερο σαν κουμπί; Για να το κάνω αυτό, θα προσθέσω πρώτα ένα IBOutlet για το κουμπί μετατροπής στο ViewController.h

@property (ισχυρή, μη ατομική) IBOutlet UIButton * μετατροπή

και στη συνέχεια προσθέστε τον ακόλουθο κώδικα στη μέθοδο viewDidLoad ()

self.convert.backgroundColor = [UIColor colorWithRed: 0,4 green: 0,8 blue: 1.0 alpha: 1.0] [_convert setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]

Ας τρέξουμε την εφαρμογή μας και να δούμε, αν είναι όπως μας αρέσει.

Εντάξει μια χαρά! Πρέπει να έχετε παρατηρήσει ότι έχω αλλάξει και τις θέσεις της ετικέτας αποτελεσμάτων, ο λόγος για την αλλαγή είναι κάτι που θα εξηγήσω αργότερα.

Γνωρίζουμε ότι η εφαρμογή μας μετατρέπεται από Κελσίου σε Φαρενάιτ και αντίστροφα μόνο. Λοιπόν, πώς να προσθέσετε λίγες περισσότερες λειτουργίες ή μονάδες για μετατροπή; Για να γίνει αυτό, πρέπει να προσθέσουμε ένα ακόμη στοιχείο στο UIPickerView που δίνει την κατάλληλη επιλογή, όταν επιλέγεται μια μονάδα στο πρώτο στοιχείο του εργαλείου επιλογής.

Για να κάνουμε ένα εργαλείο επιλογής χωρισμένο σε δύο στοιχεία, πρέπει να προσθέσουμε ένα νέο NSArray data2, το οποίο θα διατηρεί τα δεδομένα για το δεύτερο στοιχείο. Επίσης, ορίστε δύο σταθερές που θα αντιπροσωπεύουν τα δύο συστατικά μας. Εδώ, το αριστερό στοιχείο δηλώνεται 0 και το δεξί στοιχείο δηλώνεται 1 για την απλότητα του προγραμματισμού.

Το αρχείο ViewController.h μοιάζει

#import # define data1comp 0 # define data2comp 1 @interface ViewController: UIViewController @property (strong, nonatomic) IBOutlet UITextField * ValueTextField @property (ισχυρή, μη ατομική) IBOutlet UIPickerView * picker2 @property (strong, nonpromic) (مضبوط, nonpromic) ισχυρή, μη ατομική) NSArray * data2 @property (strong, nonatomic) IBOutlet UILabel * ResultLabel @property (strong, nonatomic) IBOutlet UIButton * convert - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) αποστολέας @τέλος

Τώρα ορίστε τα δεδομένα πίνακα 2 στη μέθοδο ViewDidLoad (). Τώρα που έχουμε και τις δύο πηγές δεδομένων, πρέπει να είμαστε σε θέση να γράψουμε κώδικα για το εργαλείο επιλογής με τέτοιο τρόπο ώστε όταν επιλέγουμε ένα στοιχείο από το πρώτο στοιχείο του εργαλείου επιλογής, το δεύτερο στοιχείο θα πρέπει αυτόματα να αλλάξει στην αντίστοιχη τιμή. Το δεύτερο συστατικό εξαρτάται από την επιλογή του πρώτου.
Για αυτό, πρέπει να ορίσουμε ένα λεξικό που θα αποθηκεύει τα κλειδιά και τις τιμές. Τα κλειδιά περιέχουν τα δεδομένα που αντιστοιχούν στο πρώτο συστατικό του επιλογέα και οι τιμές περιέχουν τα δεδομένα που αντιστοιχούν στο δεύτερο συστατικό του επιλογέα.

- (void) viewDidLoad {[super viewDidLoad] // Κάντε οποιαδήποτε επιπλέον εγκατάσταση μετά τη φόρτωση της προβολής, συνήθως από ένα nib. _data1 = [NSArray arrayWithObjects: @ 'Celsius', @ 'Fahrenheit', @ 'Meter', @ 'Centimeter', nil] data2 = [NSArray arrayWithObjects: @ 'Centimeter', @ 'Meter', @ 'Fahrenheit', @ Λεξικό 'Celsius', nil] = [λεξικό NSDictionaryWithObjectsAndKeys: @ '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) συστατικό στοιχείο {if (component == data1comata) [self.data2 count]} - (NSString *) pickerView: (UIPickerView *) pickerView titleForRow: (NSInteger) row forComponent: (NSInteger) component {if (component == data1comp) {return [self.data1 objectAtIndex: σειρά]} return [self.data2 objectAtIndex: row]} - (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) row inComponent: (NSInteger) komponen {[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 = σειρά}}

Εδώ στη μέθοδο didSelectRow (), λαμβάνουμε την επιλεγμένη τιμή του πρώτου στοιχείου και μετά την μεταφέρουμε ως όρισμα στη μέθοδο objectForKey () του λεξικού και λαμβάνουμε την αντίστοιχη τιμή για το κλειδί. Για να βρούμε την αντίστοιχη θέση για την τιμή στο δεύτερο πίνακα, δηλαδή δεδομένα2, χρησιμοποιούμε τη μέθοδο indexOfObject () του πίνακα και αποθηκεύουμε το αποτέλεσμα σε ακέραια τιμή.
Στη συνέχεια μεταβιβάζουμε αυτήν την ακέραια τιμή στη μέθοδο επιλογής selectRow: row inComponent: component (). Και φορτώστε ξανά το στοιχείο του εργαλείου επιλογής χρησιμοποιώντας το reloadComponent ().
Μόλις το κάνουμε αυτό, καθώς επιλέγουμε ένα στοιχείο από το πρώτο στοιχείο, το αντίστοιχο στοιχείο θα επιλεγεί στο δεύτερο στοιχείο του εργαλείου επιλογής.

Ο κωδικός για το didSelectRow ()

- (void) pickerView: (UIPickerView *) pickerView didSelectRow: (NSInteger) row inComponent: (NSInteger) component {[self backgroundButton: 0] if (component == data1comp) {NSString * data11 = [_ data1 objectAtIndex: row] NSA a = [λεξικό αντικείμενοForKey: data11] secondrow = [self.data2 indexOfObject: a] [_picker2 selectRow: secondrow inComponent: data2comp animated: YES] [_picker2 reloadComponent: data2comp] selectValue = data11 επιλεγμένοRow = row}}

Τώρα εκτελέστε την εφαρμογή και δείτε, εάν το εργαλείο επιλογής λειτουργεί όπως αναμένεται.

php parse string to array

Βόιλα! δουλεύει!

Ας συνεχίσουμε λοιπόν να κωδικοποιούμε το κουμπί μετατροπής. Ο προηγούμενος επιλογέας είχε μόνο δύο τιμές για να ταιριάξει, δηλαδή Κελσίου και Φαρενάιτ και στη συνέχεια το αποτέλεσμα υπολογίστηκε. Αλλά τώρα έχουμε τέσσερις τιμές Κελσίου, Φαρενάιτ, Μετρητή και εκατοστό. Έχω χρησιμοποιήσει μια δήλωση διακόπτη, η οποία υπολογίζει την τιμή με βάση την επιλεγμένη μεταβλητή σειράς.

- (IBAction) Μετατροπή: (UIButton *) αποστολέας {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) switch (selectRow) {case 0: // Celsius to Fahrenheit res = (val * 1.8) + 32break case 1: // Fahrenheit to Celsius res = (val-32) /1.8 break case 2: // Meter to Centimeter res = val * 100 break case 3: // Centimeter to Meter res = val * 0.01 break προεπιλογή: res = 0.0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

εάν εκτελέσετε την εφαρμογή, μπορούμε να δούμε ότι όλα λειτουργούν καλά.

Τώρα, μπορούμε να ελέγξουμε εξαιρέσεις που μπορούν να προκύψουν στην εφαρμογή μας. Για παράδειγμα, δεν υπάρχει τιμή στο πλαίσιο κειμένου. Ή προσπαθούμε να μετατρέψουμε από Κελσίου σε Μετρητή ή εκατοστόμετρο, κάτι που στην πραγματικότητα δεν είναι δυνατό. Αυτοί οι τύποι καταστάσεων ονομάζονται εξαιρέσεις και πρέπει να το αποφύγουμε γράφοντας κώδικα για να χειριστούμε τέτοια σφάλματα.

Ας λύσουμε το πρώτο είδος σφάλματος που μπορεί να προκύψει κατά την εκτέλεση της εφαρμογής μας. Δηλαδή, χάνουμε να γράψουμε την αξία μας για μετατροπή στο πεδίο κειμένου. Για αυτό το σενάριο, πρέπει να ειδοποιήσουμε τους χρήστες μας να εισάγουν την τιμή και στη συνέχεια να προχωρήσουν.

Μπορούμε να χρησιμοποιήσουμε το UIAlertView για αυτό. Μπορούμε να γράψουμε μια μέθοδο με το όνομα showAlertWithMessage (NSString *). Σε αυτήν τη μέθοδο, μπορούμε να δηλώσουμε μια ειδοποίησηView και στη συνέχεια να την εμφανίσουμε χρησιμοποιώντας τη μέθοδο show (). Ο κωδικός για τη μέθοδο θα έχει ως εξής.

- (void) showAlertWithMessage: (NSString *) μήνυμα {UIAlertView * alertView = [[UIAlertView allow] initWithTitle: @ 'Error' message: message delegate: self cancelButtonTitle: nil otherButtonTitles: @ 'Okay', nil] alertView.tag = 100 _ResultLabel.text=@'No Result '[alertView show]}

Τώρα αυτή η μέθοδος όταν ο χρήστης κάνει κλικ στο κουμπί μετατροπής πρέπει να ονομάζεται μετατροπή. Η μετατροπή δεν πρέπει να γίνει χωρίς να εισαγάγετε την τιμή. Έτσι, στον ορισμό της μεθόδου για μετατροπή, πρέπει να ελέγξουμε εάν το μήκος του πεδίου κειμένου είναι μεγαλύτερο ή ίσο με μηδέν ή όχι. Εάν είναι τότε κάντε τη μετατροπή, αλλιώς εμφανίστε την ειδοποίηση. Επομένως, ο κωδικός του κουμπιού μετατροπής θα ήταν όπως:

- (IBAction) Μετατροπή: (UIButton *) αποστολέας {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 } }

Τώρα εκτελέστε την εφαρμογή και προσπαθήστε να κάνετε κλικ στο κουμπί μετατροπής χωρίς να εισαγάγετε τιμές στο πεδίο κειμένου.

Ο δεύτερος τύπος εξαίρεσης που θα μπορούσε να προκύψει είναι εάν η τιμή στο πρώτο στοιχείο δεν ταιριάζει με την τιμή στο δεύτερο στοιχείο του UIPickerView. Γι 'αυτό, ελέγχουμε εάν η τρέχουσα επιλεγμένη τιμή γραμμής στοιχείου του δεύτερου στοιχείου είναι ίση με την τιμή της γραμμής που επιστρέφεται από τον αντιπρόσωπο didSelectRow () της μεθόδου. Εάν η συνθήκη δεν ταιριάζει, τότε η μετατροπή δεν είναι δυνατή και αν οι τιμές ταιριάζουν τότε η μετατροπή μπορεί να γίνει.

Μπορούμε να εφαρμόσουμε αυτήν τη λογική ως εξής,

- (IBAction) Μετατροπή: (UIButton *) αποστολέας {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' } }

Τώρα εκτελέστε την εφαρμογή και δείτε αλλάζοντας την τιμή στο δεύτερο στοιχείο αφού κάνετε την επιλογή στο πρώτο στοιχείο.

Μπορείτε να δείτε το μήνυμα σφάλματος, ότι το αποτέλεσμα δεν μπορεί να υπολογιστεί. Θα παρατηρήσετε ότι το μήνυμα σφάλματος εκτυπώθηκε στην ίδια ετικέτα αποτελεσμάτων και ότι το μήνυμα είναι μεγάλο. Γι 'αυτό και η ετικέτα μετακινήθηκε προς τα κάτω από τον προηγούμενο προσανατολισμό.

Έτσι, η εφαρμογή μετατροπής μας είναι πλήρης. Μπορείτε να προσθέσετε περισσότερες λειτουργίες στην εφαρμογή σύμφωνα με την επιλογή σας και να την κάνετε πιο όμορφη ανάλογα με τη δημιουργικότητά σας.

Έχετε μια ερώτηση για εμάς; Αναφέρετέ τα στην ενότητα σχολίων και θα επικοινωνήσουμε μαζί σας.

Σχετικές αναρτήσεις: