Ứng dụng iOS: Làm việc với Bộ chọn nhiều thành phần



Blog này nói về việc tạo một ứng dụng ios hiển thị chuyển đổi từ đơn vị này sang đơn vị khác. Nó mô tả hoạt động của Bộ chọn Mutlicomponent, Cảnh báo, v.v.

Để có được một cái nhìn sâu sắc, vui lòng đọc . Đây là blog thứ hai của loạt ứng dụng ios.





Nếu bạn là một nhà phát triển có kinh nghiệm, người tò mò về hoạt động của bộ chọn MultiComponent thì bạn đã đến đúng blog. Trong blog này, tôi sẽ nói về cách mở rộng ứng dụng chuyển đổi của chúng tôi với nhiều chức năng hơn bằng cách triển khai bộ chọn đa thành phần và cũng như cách thực hiện xử lý đặc biệt bằng cách sử dụng cảnh báo.

bên trongblog cuối cùng,chúng tôi đã thấy rằng khi chúng ta nhập nội dung nào đó trên trường văn bản, bàn phím sẽ bật lên. Giá trị cần chuyển đổi được nhập vào trường văn bản và sau đó chúng ta thấy bàn phím không biến mất.



Để giải quyết vấn đề này, chúng ta phải thêm một nút bao phủ toàn bộ khung nhìn. Khi người dùng chạm vào bất kỳ đâu trên nền, bàn phím sẽ biến mất.

hướng dẫn amazon ec2 cho người mới bắt đầu

Bây giờ, chúng ta hãy tiếp tục và làm điều đó. Kéo nút, đặt loại nút làm tùy chỉnh và màu văn bản là màu rõ ràng từ trình kiểm tra thuộc tính.

Trình kiểm tra thuộc tính



và chọn Trình chỉnh sửa> Sắp xếp> Gửi về Quay lại

và thay đổi kích thước nút sao cho phù hợp với toàn bộ chế độ xem.

Nút này hiện hoạt động như một nút ẩn trong nền được nhấp vào để bàn phím biến mất. Hãy viết IBAction cho tương tự, chọn chế độ trợ lý biên tập và điều khiển + kéo đến ViewController.h. Đặt Kết nối thành Hành động và đặt tên thành BackgroundButton và nhấp vào kết nối.

Mã bộ điều khiển chế độ xem trông như thế này bây giờ.

#import @interface ViewController: UIViewController @property (mạnh mẽ, không giải phẫu) IBOutlet UITextField * ValueTextField @property (mạnh mẽ, không giải phẫu) IBOutlet UIPickerView * picker2 @property (mạnh mẽ, không giải phẫu) NSArray * dữ liệu IBO @ không có kết quả - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @end

Chuyển sang ViewController.m và sau đó viết mã sau.

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

Ở đây, mã cho tất cả các đối tượng khác biết để mang lại trạng thái phản hồi đầu tiên khi phát hiện có chạm. Bây giờ, hãy chạy ứng dụng và xem. Bạn sẽ có thể thấy rằng bàn phím biến mất khi bạn chạm vào nền. Bây giờ để bàn phím hoạt động khi bạn nhập xong, hãy gọi phương thức backgroundButton trong phương thức didselectRow () của bộ chọn. Vì vậy, mã phương thức sẽ như sau.

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

Bây giờ, bạn có thể làm việc trên phần làm đẹp của ứng dụng, chẳng hạn như thêm nền và thậm chí có thể tạo một hình ảnh nút lạ mắt. Tuy nhiên, đối với của tôi, tôi sẽ thiết lập một hình ảnh nền.
Để làm điều đó, trước tiên hãy tìm một hình ảnh thích hợp! Sau đó, thêm nó vào thư mục Images.xcassets và thay đổi hình ảnh từ màn hình 1x thành 2x.

Chạy ứng dụng và xem nó có hoạt động tốt không.

Nếu tôi đổi máy thành iphone 5s.

Và chạy ứng dụng.

Ở đây chúng ta có thể thấy rằng mọi thứ hoạt động tốt như mong đợi. Bây giờ, điều gì sẽ xảy ra nếu tôi muốn thêm nền cho nút của mình và làm cho giao diện giống một nút hơn? Để làm điều đó, trước tiên tôi sẽ thêm một IBOutlet cho nút chuyển đổi vào ViewController.h

@property (mạnh mẽ, không giải phẫu) IBOutlet UIButton * chuyển đổi

và sau đó thêm mã sau vào phương thức viewDidLoad ()

self.convert.backgroundColor = [UIColor colorWithRed: 0,4 xanh lục: 0,8 xanh lam: 1,0 alpha: 1,0] [_convert setTitleColor: [UIColor whiteColor] cho Trạng thái: UIControlStateNormal]

Hãy để chúng tôi chạy ứng dụng của chúng tôi và xem, nếu đó là cách chúng tôi thích.

Tuyệt! Bạn phải nhận thấy rằng tôi cũng đã thay đổi vị trí của nhãn kết quả, lý do của sự thay đổi là điều tôi sẽ giải thích sau.

Chúng tôi biết rằng ứng dụng của chúng tôi chỉ chuyển đổi từ độ C sang độ F và ngược lại. Vì vậy, làm thế nào về việc thêm một vài chức năng hoặc đơn vị để chuyển đổi? Để làm như vậy, chúng ta cần thêm một thành phần nữa vào UIPickerView để đưa ra lựa chọn thích hợp, khi một đơn vị được chọn trong thành phần đầu tiên của bộ chọn.

Để tạo một bộ chọn được chia thành hai thành phần, chúng ta cần thêm một NSArray data2 mới, dữ liệu này sẽ giữ dữ liệu cho thành phần thứ hai. Ngoài ra, hãy xác định hai hằng số sẽ đại diện cho hai thành phần của chúng ta. Ở đây, thành phần bên trái được khai báo là 0 và thành phần bên phải được khai báo là 1 để đơn giản hóa việc lập trình.

Tệp ViewController.h của bạn trông giống như

#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) data1 NSAproray * mạnh, không giải phẫu) NSArray * data2 @property (mạnh, không giải phẫu) IBOutlet UILabel * ResultLabel @property (mạnh, không giải phẫu) IBOutlet UIButton * convert - (IBAction) Convert: (UIButton *) sender - (IBAction) backgroundButton: (id) sender @kết thúc

Bây giờ hãy xác định mảng data2 trong phương thức ViewDidLoad (). Bây giờ chúng ta có cả hai nguồn dữ liệu, chúng ta phải có thể viết mã cho bộ chọn theo cách mà khi chúng ta chọn một mục từ thành phần đầu tiên của bộ chọn, thành phần thứ hai sẽ tự động được thay đổi thành giá trị tương ứng. Thành phần thứ hai phụ thuộc vào việc lựa chọn thành phần đầu tiên.
Đối với điều này, chúng ta cần xác định một từ điển sẽ lưu trữ các khóa và giá trị. Các phím chứa dữ liệu tương ứng với thành phần đầu tiên của bộ chọn và các giá trị chứa dữ liệu tương ứng với thành phần thứ hai của bộ chọn.

- (void) viewDidLoad {[super viewDidLoad] // Thực hiện bất kỳ thiết lập bổ sung nào sau khi tải chế độ xem, thường từ nib. _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 ')]]}

Bây giờ, chúng ta phải thay đổi nguồn dữ liệu và phương thức ủy quyền của bộ chọn hiện tại thành như sau, để chúng ta có dữ liệu được điền vào cả hai thành phần.

- (NSInteger) numberOfComponentsInPickerView: (UIPickerView *) pickerView {return 2} - (NSInteger) pickerView: (UIPickerView *) pickerView numberOfRowsInComponent: (NSInteger) component {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 Animation: YES] [_picker2 reloadComponent: data2comp] selectV selectVRow = row}}

Ở đây trong phương thức didSelectRow () của chúng tôi, chúng tôi đang nhận giá trị đã chọn của thành phần đầu tiên, sau đó chúng tôi chuyển nó làm đối số cho phương thức objectForKey () của từ điển và nhận giá trị tương ứng cho khóa. Để tìm vị trí tương ứng cho giá trị trong mảng thứ hai, tức là data2, chúng ta sử dụng phương thức indexOfObject () của mảng và lưu trữ kết quả dưới dạng giá trị nguyên.
Sau đó, chúng tôi chuyển giá trị số nguyên này cho phương thức bộ chọn selectRow: row inComponent: phương thức component (). Và tải lại thành phần của bộ chọn bằng cách sử dụng reloadComponent ().
Khi chúng ta đã hoàn thành việc này, khi chúng ta chọn một mục từ thành phần đầu tiên, mục tương ứng sẽ được chọn trong thành phần thứ hai của bộ chọn.

Mã cho 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 animation: YES] [_picker2 reloadComponent: data2comp] selectValue = data11 selectRow = row}}

Bây giờ hãy chạy ứng dụng và xem liệu bộ chọn có hoạt động như mong đợi hay không.

Thì đấy! nó hoạt động!

Vì vậy, hãy để chúng tôi tiếp tục mã nút chuyển đổi của chúng tôi. Bộ chọn trước đó chỉ có hai giá trị để khớp, tức là độ C và độ F, sau đó kết quả được tính toán. Nhưng bây giờ chúng ta có bốn giá trị C, Fahrenheit, Mét và Centimet. Vì vậy, tôi đã sử dụng một câu lệnh switch, tính toán giá trị dựa trên biến hàng đã chọn.

- (IBAction) Chuyển đổi: (UIButton *) người gửi {float val = [_ ValueTextField.text floatValue] NSLog (@ 'value% f', val) switch (selectRow) {case 0: // Celsius sang Fahrenheit res = (val * 1.8) + 32 trường hợp vỡ 1: // Fahrenheit sang độ C res = (val-32) / 1.8 trường hợp vỡ 2: // Mét thành Centimet res = val * 100 trường hợp ngắt 3: // Centimet sang Mét res = val * 0,01 break default: res = 0.0} NSString * final = [NSString stringWithFormat: @ '%. 02f', res] _ResultLabel.text = final}

nếu bạn chạy ứng dụng, chúng tôi có thể thấy rằng mọi thứ hoạt động tốt.

Bây giờ, chúng tôi có thể kiểm tra các ngoại lệ có thể xảy ra trong ứng dụng của mình. Ví dụ, không có giá trị nào trong hộp văn bản. Hoặc chúng ta đang cố chuyển đổi từ độ C sang Mét hoặc Cm mà thực tế là không được. Những loại tình huống này được gọi là ngoại lệ và chúng ta phải tránh nó bằng cách viết mã để xử lý các lỗi như vậy.

Hãy để chúng tôi giải quyết loại lỗi đầu tiên có thể xảy ra khi chúng tôi chạy ứng dụng của mình. Đó là, chúng tôi bỏ lỡ việc ghi giá trị của chúng tôi để được chuyển đổi trong trường văn bản. Đối với trường hợp này, chúng tôi phải thông báo cho người dùng nhập giá trị và sau đó tiếp tục.

Chúng tôi có thể sử dụng UIAlertView cho việc này. Chúng ta có thể viết một phương thức có tên là thông báo showAlertWithMessage (NSString *). Trong phương thức này, chúng ta có thể khai báo một alertView và sau đó hiển thị nó bằng phương thức show (). Mã cho phương thức sẽ như sau.

- (void) showAlertWithMessage: (NSString *) thông báo {UIAlertView * alertView = [[UIAlertView layout] initWithTitle: @ 'Error' message: message ủy quyền: tự hủyButtonTitle: nil otherButtonTitles: @ 'Okay', nil] alertView.tag = 100 _ResultLabel.text=@'Không có kết quả '[alertView hiển thị]}

Bây giờ phương pháp này khi người dùng nhấp vào nút chuyển đổi phải được gọi là chuyển đổi. Không nên thực hiện chuyển đổi mà không nhập giá trị. Vì vậy, trong định nghĩa phương thức cho convert, chúng ta phải kiểm tra xem độ dài của trường văn bản có lớn hơn hoặc bằng 0 hay không. Nếu đúng thì thực hiện chuyển đổi, nếu không thì hiển thị cảnh báo. Do đó, mã nút chuyển đổi sẽ như sau:

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

Bây giờ hãy chạy ứng dụng và cố gắng nhấp vào nút chuyển đổi mà không cần nhập giá trị vào trường văn bản.

c ++ fibonacci đệ quy

Loại ngoại lệ thứ hai có thể xảy ra là nếu giá trị trong thành phần đầu tiên không khớp với giá trị trong thành phần thứ hai của UIPickerView. Đối với điều này, chúng tôi kiểm tra xem giá trị hàng thành phần được chọn hiện tại của thành phần thứ hai có bằng giá trị giá trị hàng được trả về bởi đại biểu didSelectRow () của phương thức hay không. Nếu điều kiện không khớp, thì chuyển đổi không thể thực hiện được và nếu các giá trị khớp thì có thể thực hiện chuyển đổi.

Chúng ta có thể triển khai logic này như sau,

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

Bây giờ hãy chạy ứng dụng và xem bằng cách thay đổi giá trị trong thành phần thứ hai sau khi bạn thực hiện lựa chọn trong thành phần đầu tiên.

Bạn có thể thấy thông báo lỗi, rằng kết quả không thể tính được. Bạn sẽ nhận thấy rằng thông báo lỗi được in trong cùng một nhãn kết quả và thông báo đó dài. Vì vậy, đây là lý do tại sao nhãn được chuyển xuống từ hướng trước đó.

Như vậy, ứng dụng chuyển đổi của chúng ta đã hoàn tất. Bạn có thể thêm nhiều chức năng hơn cho ứng dụng theo lựa chọn của mình và làm cho ứng dụng đẹp hơn theo sự sáng tạo của bạn.

Có một câu hỏi cho chúng tôi? Đề cập đến họ trong phần bình luận và chúng tôi sẽ liên hệ lại với bạn.

Bài viết liên quan: