Tạo ứng dụng iOS đầu tiên của bạn.

Bài viết này sẽ hướng dẫn bạn cách tạo Ứng dụng truy cập iOS của riêng bạn. Đây là một ứng dụng thực sự đơn giản, đếm được rất nhiều lần bạn nhấn nút nhấn và khi bạn đặt lại, nó bắt đầu đếm lại từ số không. Đây là một bản xem trước đơn giản về những gì bạn sẽ tạo ra.

Trước khi chúng tôi tiếp tục, tôi muốn cho bạn biết rằng hướng dẫn này sẽ kiểm tra một số khái niệm như là khởi đầu. Không có gì quá điên rồ ở đây, nhưng là một khởi đầu tuyệt vời.

Cài đặt

  1. Trước tiên, bạn cần chắc chắn rằng bạn đã tải xuống Xcode. Hãy chắc chắn rằng bạn cũng có XCode mới nhất. Kiểm tra với App Store và đảm bảo không có cập nhật cần thiết.
  2. Tôi đang sử dụng Xcode 8.3.2 với Swift 3 tại thời điểm hướng dẫn này kết thúc. Nếu tại thời điểm bạn thấy bài viết này có gì đó thay đổi hoặc không hoạt động, vui lòng cho tôi biết để tôi có thể thay đổi bài viết cho phù hợp.
  3. Tạo dự án đầu tiên của bạn. Chạy Xcode và bạn sẽ ở màn hình chào mừng.
  4. Nhấp vào Tạo Dự án Xcode mới.
  5. Nhấp vào Ứng dụng Chế độ xem Đơn vì đây là một ứng dụng rất đơn giản và chúng tôi đang sử dụng Chế độ xem. Có các tùy chọn khác như Trò chơi - bạn cũng có thể tạo trò chơi, Ứng dụng iMessage - Tạo ứng dụng cho iMessage, đây có thể là bàn phím và trò chơi trên bàn phím và Ứng dụng dựa trên Trang - tương tự như iBooks có rất nhiều vuốt và ít loại tương tác của quan điểm.
  6. Sau đó nhấp vào Tiếp theo và đặt tên cho ứng dụng trong Tên sản phẩm. Chọn tên nhóm và tổ chức, định danh tổ chức. Hãy chắc chắn rằng Ngôn ngữ là nhanh chóng. Đối với thiết bị, bạn có thể chọn những gì bạn thích. Tôi sẽ sử dụng Universal - có thể được sử dụng cho cả iPad và iPhone. Nhưng bạn chỉ có thể sử dụng iPad cho iPad hoặc iPhone - chỉ cho iPhone.
  7. Từ đó, Xcode sẽ nhắc bạn chọn một vị trí để lưu dự án này. Bạn có thể chọn lưu nó bất cứ nơi nào bạn muốn.
  8. Sau khi hoàn thành, bạn nên có một dự án khá trống. Nhưng chúng tôi sẽ khắc phục điều đó sớm thôi.
  9. Nhấp vào Main.storyboard
  10. Đây là Trình tạo giao diện của bạn. Đây là nơi bạn làm hầu hết các công việc kết thúc. Bạn làm thiết kế và nhìn vào đây.
  11. Ở góc dưới bên phải, đây là nơi bạn có thể chọn các mục và bộ điều khiển như TableViewControll, Nút, Nhãn và Chế độ xem Văn bản.
  12. Có một thanh tìm kiếm ở đó cũng như bạn có thể sử dụng để tìm kiếm những gì bạn cần.

Bảng chính

  1. Tìm kiếm Bộ điều khiển Điều hướng và kéo nó vào màn hình.
  2. Từ đó, loại bỏ rootViewControll. Nhìn vào khung bên phải, chọn rootViewControll. Nhấn phím ‘xóa. Bây giờ hãy điều khiển và kéo bộ điều khiển điều hướng vào Bộ điều khiển xem và đặt nó làm Bộ điều khiển xem gốc.

Sau đó, bạn sẽ nhấp vào Bộ điều khiển Điều hướng và ở bên phải có một hộp kiểm trống có ghi Bộ điều khiển Chế độ xem Ban đầu. Hãy chắc chắn rằng bạn nhấp vào đó

Những gì nó làm về cơ bản là bảo Xcode bắt đầu với bộ điều khiển điều hướng thay vì chỉ xem. Đây là thanh điều hướng của chúng tôi mà bây giờ chúng tôi sẽ làm việc. Thanh điều hướng gần như là thanh bạn đã thấy trong video ở trên cùng với title Tiêu đề Counter Counter và Đặt lại Nút Nút.

  1. Từ đó, bạn sẽ tìm kiếm một nhãn là ‘Thư viện và kéo nó vào Trình điều khiển xem.
  2. Bây giờ tìm kiếm nút và làm điều tương tự nhưng hai lần.
  3. Từ đó, căn chỉnh nhãn và nút theo cách bạn muốn bằng cách kéo chúng xung quanh. Các dòng bạn nhìn thấy khi bạn di chuyển các mục này là sự sắp xếp cho bạn biết bạn đang sắp xếp nó ở đâu đó. Sau khi hoàn tất, bạn có thể tắt nút đặt lại ở thanh điều hướng nếu bạn muốn, đó là những gì tôi đã làm hoặc chỉ sử dụng vị trí của riêng bạn. Đừng lo lắng, nó sẽ không ảnh hưởng đến chức năng.
  4. Bây giờ, chúng tôi muốn biết những gì sẽ thấy. Vì vậy, với Nhãn, nhấp vào nó hai lần, bạn có thể thay đổi nó từ Nhãn thành những gì bạn muốn. Vì đây là một bộ đếm, chọn một số. Bây giờ bên phải có một thuộc tính Font. Theo mặc định, nó là System Font 17. Làm cho nó lớn hơn hoặc nhỏ hơn, làm theo sở thích của bạn. Tôi đã sử dụng 60. Bạn có thể làm những gì bạn thích.
  5. Đối với các nút, có một thiết lập lại và nhấn. Vì vậy, hãy chắc chắn để dán nhãn cho phù hợp. Bạn làm khá nhiều việc giống như bạn đã làm với Nhãn. Nhưng bạn không cần thay đổi phông chữ. Bạn có thể nếu bạn thích.
  6. Cuối cùng, chúng tôi muốn có một tiêu đề cho ứng dụng này. Vì vậy, trên thanh điều hướng, nhấp vào nó cho đến khi thanh được tô sáng. Bạn sẽ thấy rằng khung bên phải hiện hiển thị Nút Tiêu đề, Nhắc và Quay lại. thay đổi Tiêu đề thành một tiêu đề bạn thích.

Bây giờ bạn nên có một cái gì đó gần hơn với điều này.

Phần thú vị

Bây giờ chúng tôi muốn vào phần mã hóa của ứng dụng này. Trên đầu Xcode có Nút Trợ lý Trình chỉnh sửa. Nó trông giống như một sơ đồ Venn.

Bây giờ bạn sẽ thấy hai thứ, Trình tạo giao diện và mã cho Trình điều khiển xem. Những gì chúng tôi sẽ làm bây giờ là nhấn điều khiển trên bàn phím của bạn, giữ nó và kéo nhãn của bạn vào mã ở trên cùng. Đặt tên cho nhãn như ‘counterLabel.

Bây giờ bạn có nhãn, bạn cần làm tương tự cho hai nút. Nhưng đây là nơi mọi thứ thay đổi một chút. Trong kết nối, nhấp vào trình đơn thả xuống và chọn Hành động - Điều này cho phép chúng tôi để ứng dụng làm gì đó khi người dùng chạm vào nút. Làm tương tự cho cả hai và đặt cho chúng một cái tên có ý nghĩa như ‘tapButtonTapped,.

Bạn đã hoàn thành việc này, nhấp vào trình điều khiển xem ở khung bên trái và thay đổi Trình chỉnh sửa Trợ lý trở lại trình điều khiển bình thường trông giống như một loạt các dòng.

Được rồi, đầu tiên chúng ta sẽ nhập mã này vào: var counter: Int = 0 (Đây là một biến, cho phép là kiểu Integer và chúng ta đặt nó thành zero.) Có một var và cho phép nhưng chúng ta sẽ đi vào đó với một bài viết khác Nhưng về cơ bản var có thể được thay đổi, không thể.

Bây giờ chúng tôi có một quầy, chúng tôi phải hiển thị số này. Trong hàm viewDidLoad, hãy nhập hàm này vào counterLabel.text = String (bộ đếm) (vì vậy hãy thay đổi conterLabel thành bất cứ thứ gì bạn đặt tên cho nhãn của mình. biến truy cập của chúng tôi là loại int.

Được rồi bây giờ về cơ bản chúng ta có ứng dụng hiển thị số muốn nó được mở. Bây giờ chúng ta cần thêm các chức năng để thiết lập lại và nhấn. Chúng tôi sẽ bắt đầu với tap.

Bên trong IBAction cho nút nhấn, chúng tôi muốn thêm 1 mỗi lần người dùng chạm 1. Vì vậy, những gì chúng tôi làm là thêm một vào số. Sau đó thay thế văn bản trong nhãn bằng số. Chúng tôi làm như vậy bằng cách làm như sau:

Bây giờ sau khi bạn làm điều này, bạn muốn chắc chắn rằng bạn đã làm đúng. Vì vậy, chạy ứng dụng! Sử dụng CMD + R hoặc nhấn nút phát ở trên cùng.

Nếu bạn đã nhận thấy, một cái gì đó có thể sai, các nút có thể ở khắp mọi nơi. Nhưng khi bạn nhấn tap, nó sẽ thêm vào số trước đó. Nếu bạn không thấy nút chạm hoặc nhãn và nút ở khắp mọi nơi. Quay trở lại Main.storyboard. Những gì chúng ta sẽ làm bây giờ là đặt chúng ở nơi chúng ta muốn. Bởi vì đây là một hướng dẫn đơn giản. Tôi sẽ không nhận được chiều sâu với các ràng buộc. Chúng tôi sẽ sử dụng các đề xuất chống Apple gợi ý. Vì vậy, trong Main.storyboard, đảm bảo bạn đang ở trong Trình điều khiển xem. Xác nhận bạn bằng cách nhấp vào một cái gì đó trong ViewContoder như nền nhưng không phải là các mục trong Chế độ xem. Nếu bạn nhìn vào Trình tạo giao diện, có một nút mà bạn nhìn thấy trong hình bên dưới, khi bạn nhấp vào nó, bạn sẽ thấy một số tùy chọn, nhấp vào Đặt lại để ràng buộc được đề xuất. Bây giờ chạy lại nó, và mọi thứ sẽ trông hơi quen thuộc.

Nút bạn chạmMenu bạn sẽ thấy.

Bây giờ trở lại IBActions

Bên trong IBAction khác, chúng tôi có nó cho nút đặt lại. Chúng tôi muốn đặt số trở về 0. Vì vậy, chúng tôi sẽ làm điều này: number = 0. Đó là số đó, số hiện tại là 0. Nhưng nó không hiển thị trên ứng dụng khi bạn nhấn vào nó. Tiếp tục và thử nó. Chạy lại ứng dụng.

Vì vậy, để khắc phục điều này, vấn đề là chúng tôi chưa cập nhật nhãn hiệu vì vậy chúng tôi cần phải làm điều đó. Hãy cố gắng để tìm ra điều này. Nếu bạn vẫn bị mắc kẹt, câu trả lời nằm ở cuối trang.

Bây giờ bạn khá nhiều đã thêm các nguyên tắc cơ bản xuống. Các ứng dụng khá nhiều hoạt động. Bạn nhấn tap và nó sẽ thêm một vào quầy. Bạn nhấn thiết lập lại và bộ đếm trở về 0.

Thêm, thêm!

Bây giờ, nếu bạn muốn làm một cái gì đó vui hơn hoặc thêm một chút. Chúng ta có thể thoát khỏi dòng xấu xí đó trên thanh điều hướng. Đây là mã cho điều đó:

Trước tiên hãy giải quyết con voi trong phòng, CÁI GÌ LÀ GÌ? làm gì ở đó?

Đó là một tùy chọn, khá nhiều, nó cho Xcode biết rằng có khả năng là không có navigationContoder và không có gì để không có hoặc không có nó. Điều này là để mã vẫn có thể chạy nếu không có bộ điều khiển. Tùy chọn chủ yếu được sử dụng khi có khả năng không, nhưng nó không ảnh hưởng đến chương trình nhiều. Chúng tôi muốn cho phép con số không vì nó không thay đổi bất cứ điều gì nhưng Xcode không cho phép nó theo mặc định. Nếu không, ứng dụng sẽ bị sập, vì vậy với Tùy chọn, nó sẽ dễ dàng hơn.

Bây giờ đã được xử lý, hãy nói chuyện mã.

Dòng đầu tiên là khá nhiều thiết lập và hình nền trống. Nếu bạn sử dụng UIImage (), nó gần như trống rỗng và bỏ qua nhu cầu thực sự sử dụng một hình ảnh thuộc bất kỳ loại nào. Điều này là do đó không có hình ảnh nền.

Dòng thứ hai về cơ bản loại bỏ hình ảnh bóng về cơ bản là dòng / viền ở phía dưới. Nhưng bạn cần cả hai để hoạt động vì chúng tôi không muốn một trong hai nên đường dây không hiển thị.

Bây giờ đã xong, bạn có một bản sao chính xác của ứng dụng được hiển thị ở đầu!

Trả lời: counterLabel.text = String (số)

Andy Vương

Andy là sinh viên năm nhất của Đại học St. Anh ấy có một niềm đam mê để xây dựng các sản phẩm, làm việc trong ngành công nghệ, thử những điều mới và nói chung là cố gắng học hỏi những điều mới hàng ngày. Anh ấy hiện đang tìm kiếm một kỹ sư phần mềm / thực tập phát triển ở NYC hoặc San Francisco (Preferred ~ đã yêu thành phố). Niềm đam mê tôi có nhiều hơn là xây dựng, là xây dựng một cái gì đó hữu ích. Một cái gì đó giúp mọi người theo những cách mà trước đây chưa từng có.

Hãy kết nối! (Twitter) (Trang web) (Linkedin)