iPhone: Tìm hiểu lập trình iPhone với ứng dụng HelloWorld

Ở phần này giả sử chúng ta đã cài đặt Xcode 4 (phiên bản hiện tại là 4.6.3) trên máy tính có cài hệ điều hành MAC OS

Ví dụ sau đây ta tạo một ứng dụng hiển thị một câu “Hello World !” khi người dùng Tap vào button Say trên màn hình.

Tạo project mới, có nhiều template cho các loại ứng dụng khác nhau, ở đây ta chọn template cơ bản nhất Empty Application

–       File main.m chứa phương thức main() là entry point của ứng dụng

–       File HelloWorld-Infor.plist: file cấu hình thông tin của ứng dụng

–       Các file AppDelegate.*: được tạo mặc định, khai báo cho lớp Application Delegate cho ứng dụng của bạn

–       Frameworks: các framework sẽ được include trong project

=> Các thông tin này thường được tạo mặc định bởi Xcode, nếu project không có gì đặc trưng (universal – ứng dụng cho cả iPhone lẫn iPad chẳng hạn) thì bạn thường không cần phải thay đổi những thông tin mặc định này.

Application Bootstrapping 

int main(int argc, char *argv[])

{

    @autoreleasepool {

        return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));

    }

}

AppDelegate

—– AppDelegate.h

#import <UIKit/UIKit.h>

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;

@end

—– AppDelegate.m

– (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

{

    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease];

    // Override point for customization after application launch.

    self.window.backgroundColor = [UIColor whiteColor];

    [self.window makeKeyAndVisible];

    return YES;

}

Phương thức này sẽ được gọi khi ứng dụng được Launch, và đối tượng window sẽ được hiển thị trên màn hình.

Tạo View Controller

Đến bước này ta cần tạo ra giao diện như yêu cầu ban đầu:

–       Một UIView để chứa UILabel (hiển thị câu chào), một UIButton để user tap.

–       Để quản lý View trên, ta cần một View Controller

Add New File, chọn UIViewController subclass, check thêm dấu chọn With XIB for user interface.

Xcode sẽ tạo ra 3 file mới như sau

Như đã thảo luận ở trên và phần trước, trong ứng dụng iPhone, đối tượng UIWindow là đối tượng hiển thị cao nhất, sau khi tạo thêm HelloViewController, để hiển thị thông tin từ View của nó, chúng ta cần phải add nó lên đối tượng UIWindow. Ta sẽ làm điều đó trong file AppDelegate.m

– (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

{

    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease];

    // Override point for customization after application launch.

    HelloViewController *helloVC = [[HelloViewController alloc] initWithNibName:@”HelloViewController” bundle:nil];

    NSArray *versionCompatibility = [[UIDevice currentDevice].systemVersion componentsSeparatedByString:@”.”];

    NSInteger version = [[versionCompatibility objectAtIndex:0] integerValue];

    if (version >= 6) {

        [self.window setRootViewController:helloVC];

    } else {

        [self.window addSubview:helloVC.view];

    }

     self.window.backgroundColor = [UIColor whiteColor];

    [self.window makeKeyAndVisible];

    return YES;

}

Lướt qua đoạn code trên:

HelloViewController *helloVC = [[HelloViewController alloc] initWithNibName:@”HelloViewController” bundle:nil];

Đây là đoạn khởi tạo đối tượng lớp HelloViewController.

 NSArray *versionCompatibility = [[UIDevice currentDevice].systemVersion componentsSeparatedByString:@”.”];

 NSInteger version = [[versionCompatibility objectAtIndex:0] integerValue];

 if (version >= 6) {

        [self.window setRootViewController:helloVC];

 } else {

        [self.window addSubview:helloVC.view];

 }

Với iOS 6 trở lên, chúng ta sẽ sử dụng hàm setRootViewController: còn lại chúng ta sẽ sử dụng hàm addSubview của lớp UIWindow để “thêm” phần “hiển thị” của HelloViewController lên UIWindow.

Mở file HelloViewController.xib bằng Interface Builder, và thiết kế các giao diện cần thiết.

–       UIButton với text là “Say!”

–       UILabel với text là “iPhone Exam”, sẽ đổi thành “Hello World !” khi người dùng Tap vào Button Say!

Hai đối tượng này được add trên view của HelloViewController (Thêm đối tượng UILabel và UIButton vào cửa sổ View)

Ở đây ta chỉ mới xây dựng “phần giao diện” của UILabel và UIButton, bước tiếp theo ta phải tạo các đối tượng này ở lớp HelloViewController và liên kết chúng lại với nhau để điều khiển.  Chúng ta có thể tạo 2 đối tượng UILabel và UIButton này ở trong lớp HelloViewController bằng cách khai báo chúng trong file HelloViewController.h sau đó thêm chỉ thị IBOutlet để thông báo là 2 đối tượng này sẽ liên kết với “phần giao diện” ở NIB file HelloViewController.xib. Tuy nhiên, với Xcode 4.2 trở lên, chúng ta có thể làm trực tiếp bằng cách giữ Control và drag từ file NIB sang file .h như sau

– Ta có thể chọn chế độ 2 cửa sổ bằng cách chọn Show the Assistant Editor để kéo (Drag) và nối các đối tượng trên Interface Builder với mã nguồn.

Chọn HelloViewController.xib ở cửa sổ bên trái, chọn HelloViewController.h ở cửa sổ bên phải

– Giữ phím Control và Drag từ đối tượng UIButton từ cửa sổ bên trái sang cửa sổ bên phải, vào vùng khai báo của HelloViewController.h

Sau đó nhập tên của đối tượng UIButton cho “phần giao diện” của button mà ta đã tạo ở file NIB

Thực hiện tương tự với đối tượng UILabel.

Riêng đối tượng UIButton, chúng ta cần thêm một sự kiện khi người dùng Tap vào. Click phải chuột lên đối tượng UIButton, một bảng Properties xuất hiện, chúng ta thực hiện nối sự kiện Touch Up Inside với mã nguồn, với cách kéo này chúng ta không cần phải giữ phím Control.

Sau đó đặt tên cho phương thức xử lý sự kiện này

Kết quả sau khi add như sau:

——– HelloViewController.h

#import <UIKit/UIKit.h>

 @interface HelloViewController : UIViewController{

    IBOutlet UIButton *_btnSay;

    IBOutlet UILabel *_lblTitle;

}

– (IBAction)btnSayTapped:(id)sender;

 @end

Ta tạm làm quen với 2 chỉ thị:

– Chỉ thị IBOutlet báo cho trình biên dịch biết đối tượng này được kết nối với “phần giao diện” ở file NIB

– Chỉ thị IBAction báo cho trình biên dịch biết đây là phương thức sự kiện cho phép các đối tượng ở file NIB kết nối

Chúng ta sẽ viết code cho đoạn xử lý Tap vào button Say! để hiển thị dòng “Hello World” trong file HelloViewController.m

– (IBAction)btnSayTapped:(id)sender {

    [_lblTitle setText:@”Hello world !”];

}

Chúng ta chọn Build và Run thử chương trình sẽ được kết quả như mong muốn ban đầu trên Simulator

Qua ví dụ này, chúng ta phần nào nắm được một số kiến thức cơ bản:

– Cách tạo một ứng dụng cơ bản trên XCode

– Cấu trúc cơ bản của một ứng dụng iPhone

– Cách tạo, khai báo, liên kết các đối tượng trong Interface Builder (IBOutlet, IBAction)

– Cách Run một dự án trên Xcode, làm  quen với Simulator.

  1. Để lại bình luận

Gửi phản hồi

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s

%d bloggers like this: