ĐIỀU HƯỚNG sử DỤNG NAVIGATION CONTROLLER

ĐIỀU HƯỚNG SỬ DỤNG NAVIGATION CONTROLLER Ở hướng dẫn cho bạn cách điều hướng hình tuỳ chỉnh theo nhu cầu ứng dụng bạn Hướng dẫn cụ thể Navigation Navigation ?… Navigation phong cách chuyển tiếp sử dụng phổ biến ứng dụng IOS, Giống vào lâu đài có lối phải qua nhiều cách cửa sau cánh cửa giới khác nhau!, muốn quay lại giới,hay tiếp phải qua cửa mội lối Như Navigation cách cửa giúp ta vào giới khác nhau, Ở IOS điều hướng NEXT or BACK để mở hình khác Để cụ thể hơn, Setting Iphone ta cài ứng dụng có danh sách ứng dụng, click vào mở chi tiết thông tin ứng dụng đó, back lại quay lại list ứng dụng navigation Bắt đầu cụ thể : Khởi tạo project đặt tên: Mình thiết kế ứng dụng với nội dung sau : Sau thiết kế trông : – ViewController 1: Danh sách ảnh thông tin ảnh đó! – ViewController 1: Khi click vào ảnh ảnh chuyển sang chế độ xem lớn hơn, hiển thị thông tin ảnh  Thiết kế giao diện: Vào Main.storyboard! Kéo vào thêm ViewController : – Đối với ViewController 1: Kéo vào TabelView, TableViewCell Thêm imageView ể hiển thị ảnh dạng list, label để hiển thị thông tin ảnh!, thay đổi màu cho ViewController => Sau chỉnh ta trông này: Link tải ảnh: http://www.mediafire.com/download/qbi32hamm5vgpmb/Archive.zip Sau tải ảnh , giải nén kéo vào dự án: Như có danh sách ảnh! Tiếp theo ta thay đổi số lượng Prototype Cells, thành để set ảnh vào setImage vào khung imageView!!! Chọn vào imageView set tên ảnh, ảnh tự động set vào! Sau set ảnh thay đổi text label ta sau: Đối với ViewController thứ 2: Kéo vào imageView để phóng to ảnh, label để thị thông tin ảnh Đổi text label thành: Thông tin ảnh! Như thiết kế xong giao diện! Tiếp theo Kết nối: – Kết nối delegate cho tableView: – Identifine cho cell, click vào cell: Thay đổi tên cell đặt cell1, cell2, cell3 – Kết nối UINavigation: Click vào ViewController chọn editor ->Embed in->Navigation hình sau: Như kết nối navigation cho ViewController – Kết nối hai hình với nhau: Giữ Crtl kéo từ hình thứ đến hình thứ 2, chọn push: Tạo identifine cho kết nối “prepare”: – Tạo thêm class để quản lý ViewController xem ảnh phóng to Kết nối class , click vào ViewController cần quản lý, ViewController phóng to ảnh, Kết nối class: – Ánh xạ property, đăng ký delegate cho TableView: Đối với ViewController.h danh sách ảnh: đăng ký delegateDataSource, delegateDelegate Ánh xạ tableView đặt tên imageTableView, tạo mảng urlImage để lưu danh sách tên ảnh, tạo mảng imageInforName để lưu danh sách thông tin ảnh @interface ViewController : UIViewController @property (strong, nonatomic) IBOutlet UITableView *imageTableView; @property (strong,nonatomic) NSArray *urlImage; @property (strong,nonatomic) NSArray *imageInforName; @end Đối với ImageViewController.h phóng to ảnh: Ánh xạ label, imageView, đặt tên code, tạo đối tượng chuỗi để nhận tên ảnh thông tin ảnh gửi sangkhi ta lựa chọn từ danh sách ảnh tavleView @property (strong, nonatomic) IBOutlet UIImageView *imageView; @property (strong, nonatomic) IBOutlet UILabel *labelInfor; @property(strong,nonatomic)NSString *urlImage; @property(strong,nonatomic)NSString *infor; Thực thi code: Đối ViewController.m : Thêm đoạn mã sau! - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib self.urlImage=@[@"dev1.jpg",@"dev2.png",@"ios.png"]; self.imageInforName=@[@"Devpro open your world",@"Devpro Việt Nam",@"IOSDeveloper"]; } Khởi tạo mảng , định nghĩa self.urlImage lấy danh sách tên ảnh, self.imageInforName danh sách Thông tin ảnh Khởi tạo phương thức bắt buộc tableView: Do danh sách có ảnh, nên ta khởi tạo Row Khởi tạo mảng indentifine gán danh sách identifine prototype Cells định danh Khởi tạo đối tượng cell Do ta làm việc với row nên ta lặp hàng Kiểm tra row truyền identifine row trả thông tin prototype Cells image, label=> Cuối trả cell -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ 10 11 12 return 3; } -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ NSArray *indentifine=@[@"cell1",@"cell2",@"cell3"]; UITableViewCell *cell=[[UITableViewCell alloc]init]; for (int i=0; i Như load image vào ImageView , load thông tin ảnh vào label, gửi liệu sang ImageViewController Thực thi ImageViewController.m: Trong ViewDidLoad: Thêm đoạn mã sau! - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view [self.imageView setImage:[UIImage imageNamed:self.urlImage]]; self.labelInfor.text=self.infor; } Như có tên ảnh(urlImage), thông tin ảnh(infor), gửi sang từ ViewController set ảnh vào imageView, set thông tin ảnh vào labelInfor Bây chạy nhận kết hình: Link full code: http://www.mediafire.com/download/82zosnuei3nnumz/Navigation.zip [...]... UINavigation: Click vào ViewController đầu tiên chọn editor ->Embed in- >Navigation như hình sau: Như thế chúng ta đã kết nối được navigation cho ViewController – Kết nối hai màn hình với nhau: Giữ Crtl kéo từ màn hình thứ nhất đến màn hình thứ 2, chọn push: Tạo identifine cho kết nối trên là “prepare”: – Tạo thêm class để quản lý ViewController khi xem ảnh phóng to Kết nối class , click vào ViewController... indexPathForSelectedRow]; ImageViewController *destViewController = segue.destinationViewController; destViewController.urlImage = self.urlImage[indexPath.row]; destViewController.infor=self.imageInforName[indexPath.row]; 6 } => Như thế chúng ta đã load image vào trong ImageView , load thông tin ảnh vào label, và gửi dữ liệu sang ImageViewController Thực thi ImageViewController.m: Trong ViewDidLoad:... cần quản lý, ở đây ViewController phóng to ảnh, Kết nối class: – Ánh xạ property, đăng ký delegate cho TableView: Đối với ViewController.h danh sách ảnh: đăng ký delegateDataSource, delegateDelegate Ánh xạ tableView đặt tên là imageTableView, tạo mảng urlImage để lưu danh sách tên ảnh, tạo mảng imageInforName để lưu danh sách thông tin ảnh 1 @interface ViewController : UIViewController... prepareForSegue cho phép gửi dữ liệu giữa các ViewController với nhau thông qua segue Phương pháp này mình đã phân tích trong bài tương tác tableView Lấy đối tượng indexpath để lấy được hàng (row) nào ,(section) phần nào segue.destinationViewController cho phép gửi dữ liệu qua segue 2 đoạn mã cuối cùng : giá trị được gửi sang lưu vào urlImage và infor của ImageViewController 1 -(void)prepareForSegue:(UIStoryboardSegue... *cell=[[UITableViewCell alloc]init]; for (int i=0; i