hướng dẫn phân trang trong ios xử dụng file xib

Các ứng dụng thực tế chúng ta gặp rất nhiều phong cánh chuyển tiếp nhiều view khác nhau. Ở hướng dẫn này mình sẽ giới thiệu các bạn phân trang và chuyển tiếp giữa các trang. Như một cuốn truyện được phân ra các trang và chúng ta lướt đến từng trang để đọc!!!.

->mục tiêu bài này mình sẽ giúp các bạn :

– Phân trang định hướng theo chiều nào.

– Chuyển tiếp giữa các trang.

– Các điểm di chuyển theo trang.

Screen Shot 2016-05-19 at 16.26.38 Screen Shot 2016-05-19 at 16.26.43

 

Bắt đầu nào tạo project mới và đặt tên là XibPageViewController.

Tạo 2 file

ChildViewController.xib.Để tạo các viewcontroller con.

pageViewController.xib. Để tạo viewcontroller chính để load các viewcontroller con lên.

Screen Shot 2016-05-19 at 16.33.10

 

 

 

 

Screen Shot 2016-05-19 at 16.34.38

Tạo 2 file class để quản lý 2 viewcontroller trên !!!…

Screen Shot 2016-05-19 at 16.38.03Screen Shot 2016-05-19 at 16.38.08

 

ChildViewController: Quản lý ChildViewController.xib.

pageViewController. Quản lý pageViewController.xib.

sau khi tạo nó sẽ trông thế này.

Screen Shot 2016-05-19 at 16.47.40

Xoá đi file mặc định ViewController.

Thiết kế giao diện.

chọn file ChildViewController.xib.

kết nối class quản lý.

Screen Shot 2016-05-19 at 16.50.16

 

kết nối view.

Screen Shot 2016-05-19 at 16.52.07

 

thay đổi màu background và thêm một label vào .

label để phân biệt xem đó là file xib nào khi ta load .

Screen Shot 2016-05-19 at 16.53.17

 

ánh xạ label sang class quản lý và đặt tên:

@property (weak, nonatomic) IBOutlet UILabel *Screenindex;

Làm việc tương đương với giao diện file pageViewController.xib.

nhưng ta chỉ thay đổi color background. trông như thế này .

Screen Shot 2016-05-19 at 16.55.22

 

Mã nguồn code:

vào ChildViewController.h:

@property (weak, nonatomic) IBOutlet UILabel *Screenindex;
@property(assign,nonatomic) NSInteger index;

Thêm index để hiển thị lên label đánh dấu xem đang xem file xib nào.

ChildViewController.m:

settex lên label:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.Screenindex.text=[[NSString alloc]initWithFormat:@"Screen %ld",(long)self.index];
    
}

Để chuyển tiếp được trang trong ios 5 trở đi có hỗ trợ class  UIPageViewController cho phép chuyển tiếp các trang hiệu ứng chuyển ,đánh dấu trang…

vào file  pageViewController.h

để sử dụng UIPageViewController đăng đý dataSource.

và khởi tạo pageViewcontroller.

@interface pageViewController : UIViewController<UIPageViewControllerDataSource>
@property(nonatomic,strong) UIPageViewController *pageController;

UIPageViewController cung cấp 2 phương thức để xem trang trước đó và xem trang ngay sau đó.

xem trang trước đó.

-(UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController{
    

}

xem trang ngay sau nó.

-(UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerAfterViewController:(UIViewController *)viewController{
   
}

Ta tạo ra một hàm mới ,Dùng đăng ký file xib nào sẽ được gọi. set giá trị cho index của nó.

-(ChildViewController *)viewControllerAtIndex:(NSUInteger)index{
    // đăng ký viewcontroller!
    ChildViewController *childViewcontroller=[[ChildViewController alloc]initWithNibName:@"ChildViewController"bundle:nil];
    childViewcontroller.index=index;
    return childViewcontroller;
}

trả về file viewcontroller .xib đó.!!!

Kiểm tra màn hình ngay trước màn hình đang xem có tồn tại không và trả về màn hình ngay trước đó.

-(UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController{
    NSUInteger index=[(ChildViewController *)viewController index];
    if (index==0) {
        return nil;
    }
    index--;
    return [self viewControllerAtIndex:index];
}

Kiểm tra màn hình ngay sau màn hình đang xem có tồn tại không và trả về màn hình ngay sau đó.

-(UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerAfterViewController:(UIViewController *)viewController{
    NSUInteger index=[(ChildViewController *)viewController index];
    index++;
    if (index==5) {
        return nil;
    }
    return [self viewControllerAtIndex:index];
}

Khi lướt 2 hàm trên mới được gọi.

-đăng ký số ô chấm sẽ được hiển thị và bắt đầu từ ô chấm nào!!!.

-(NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController{
    return 5;
}
// vi tri o bat dau!!!
-(NSInteger)presentationIndexForPageViewController:(UIPageViewController *)pageViewController{
    return 0;
}

Tạo một mảng để lưu lại các màn hình sẽ hiển thị!!!

NSMutableArray *viewControllers;//

Các bạn thêm đoạn mã sau vào Viewdidload mình sẽ giải thích từng dùng lệnh:

- (void)viewDidLoad {
    [super viewDidLoad];
    viewControllers = [[NSMutableArray alloc]init];
    // Xác định Kiểu chuyển hướng và xác định hướng chuyển đổi!
    // Kiểu cuộn trang
    self.pageController = [[UIPageViewController alloc]
                           initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll
                           navigationOrientation:UIPageViewControllerNavigationOrientationHorizontal options:nil];
    // đăng ký dataSource !!!
    self.pageController.dataSource = self;
    // xet full Screen
    [[self.pageController view] setFrame:[[self view] bounds]];
    // tao trang thu 0 va tren index cho no
    ChildViewController *initialViewController = [self viewControllerAtIndex:0];
    //
    [viewControllers addObject:initialViewController];
    [self.pageController setViewControllers:viewControllers direction:UIPageViewControllerNavigationDirectionForward animated:NO completion:nil];
    
    [self addChildViewController:self.pageController];
    
    [[self view] addSubview:[self.pageController view]];
}

 

Đầu tiên là đăng ký Kiểu chuyển trang, đăng ký hướng sẽ chuyển đổi.

Đăng ký dataSource cho pageViewController.

đăng ký fullScreen cho  pageViewController.
tạo file Viewcontroller.xib thứ 0 để load lên đầu tiên. đưaviewcontroller.xib vào mảng để lưu lại…!!!

gán màn hình vựa tạo ra vào  self.pageController cho phép chuyển theo kiểu UIPageViewControllerNavigationDirectionForward .

sau đó từ view hiện tại thêm vào self.pageController đã được đăng ký…

cuối cùng cho phép dán lên viêw hiện tại.

ok Để load file pageViewController.xib

ta thêm đoạn mã sau!!! ở đây tôi đã hướng dẫn các bạn load file xib!!!

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    self.window=[[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
    UIViewController *controller=[[pageViewController alloc]initWithNibName:@"pageViewController" bundle:nil];
    self.window.rootViewController=controller;
    [self.window makeKeyWindow];
    return YES;
}

 

Chúng ta biên dịch và chạy thử sẽ được kết quả như hình.

Screen Shot 2016-05-19 at 16.26.43 Screen Shot 2016-05-19 at 16.26.38

 

 

full code

http://www.mediafire.com/download/nyg21azcfkm3112/XibPageViewController.zip

 

Có gì trong phần tiếp theo!!!

Mình sẽ giúp các bạn đọc Json!!!

  • Nếu các bạn muốn biết thêm các kỹ thuật khác về ios, các bạn có thể tham khảo thêm các khóa học ios tại đây.

Add a Comment

Your email address will not be published. Required fields are marked *