Báo cáo thực tập lập trình ứng dụng trên nền tảng iOS (2)

1 TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM BÁO CÁO THỰC TẬP LẬP TRÌNH ỨNG DỤNG TRÊN NỀN TẢNG iOS Công ty thực tập : Zalo, Công ty cổ phần VNG Người phụ trách : Ninh Đắc Thêm Thực tập sinh : Nguyễn Hồng Phúc TP Hồ ChíMinh, tháng 07 năm 2020 Nguyễn Hồng Phúc LỜI MỞ ĐẦU Ngày nay, với phát triển vượt bậc điện thoại thông minh đãkéo theo phát triển thần tốc ứng dụng di động Theo thông tin đến từ công ty nghiên cứu thị trường Annie, đến năm 2022, người tiêu dùng chi khoảng 157 tỉ USD cho ứng dụng hàng năm Con số khẳng định ngành công nghiệp ứng dụng di động phận thiếu ngành công nghiệp phần mềm Không nằm ngồi chơi, Việt Nam tí ch cực nỗ lực vàphát triển ngành công nghiệp ứng dụng di động phát triển mạnh mẽ, để hòa nhập với cơng ty hàng đầu lập trì nh ứng dụng giới Lĩnh vực lập trình ứng dụng di động phát triển bắt kịp xu hướng phát triển chung, đáp ứng tốt nhu cầu, đòi hỏi thực tế người Vìthế em đinh lựa chọn lập trì nh ứng dụng điện thoại, cụ thể làtrên tảng iOS để tì m hiểu vàđịnh hướng cho việc học nghề nghiệp sau Sau quátrình học tập, lĩnh hội nhiều kiến thức tảng bổ í ch từ thầy cơ, để cóthể ứng dụng vào thực tế, tích lũy kinh nghiệm cho thân Em đãlựa chọn Zalo Group, Công ty cổ phần VNG – làmơi trường lý tưởng vàchun nghiệp giúp em cócơ hội thực dự định thân Nguyễn Hồng Phúc LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Công ty cổ phần VNG, cụ thể làZalo Group tạo điều kiện cho em có hội thực tập công ty Chỉ thời gian ngắn, nhờ dẫn nhiệt tình anh leader, em tiếp thu kiến thức quan trọng để làm ứng dụng di dộng Chân thành cảm ơn anh lead vàcác anh chị nhóm iOS Platform bỏ nhiều thời gian, cơng sức để hướng dẫn em hoàn thành đợt thực tập Đặc biệt cảm ơn vàlòng biết ơn sâu sắc tới anh Ninh Đắc Thêm, training iOS, hướng dẫn, giúp đỡ cho em tận tình khó khăn cơng việc, đến khó khăn việc làm quen với môi trường việc tiếp cận kiến thức công nghệ, kỹ tư lập trình vàtư sản phẩm để làm sản phẩm thời gian qua Em xin cảm ơn thầy cô khoa Công nghệ phần mềm nhiệt tình hỗ trợ, tạo điều kiện em làm báo cáo Nguyễn Hồng Phúc Tp.HCM, ngày 29 tháng 07 năm 2020 Nguyễn Hồng Phúc NHẬN XÉT CỦA KHOA Nguyễn Hồng Phúc Nội dung LỜI MỞ ĐẦU LỜI CẢM ƠN CHƯƠNG 1: GIỚI THIÊU CÔNG TY THỰC TẬP 1.1 Giới thiệu VNG Corp 1.2 Sản phẩm công ty 1.3 Lịch làm việc thực tập công ty CHƯƠNG 2: NỘI DUNG THỰC TẬP 2.1 Tì m hiểu công ty vàcác kỹ công ty 2.2 Nghiên cứu kỹ thuật 2.2.1 Các công cụ làm việc 2.2.2 Git / Git workflow 2.2.2 Tìm hiểu ngơn ngữ Objective-C 10 2.2.3 Lập trình iOS với Objective-C 12 2.2.4 Tìm hiểu ngơn ngữ Swift 14 2.2.5 Lập trình “Reactive programing” 20 Thực project 21 CHƯƠNG 3: CHI TIẾT VỀ PROJECT 22 3.1 Giới thiệu ứng dụng 22 3.2 Thực 23 3.2.1 Màn hình lựa chọn chức 23 3.2.2 Màn hình chức nhiều đối tượng tiêu thụ từ camera 24 3.2.3 Màn hình áp dụng nhiều lọc 25 3.2.4 Màn hình áp dụng hiệu ứng video 26 3.2.5 Màn hình chụp ảnh/quay video 27 3.2.6 Kết xử lýảnh video lưu vào thư viện 29 TỔNG KẾT 32 Nguyễn Hồng Phúc Nguyễn Hồng Phúc CHƯƠNG 1: GIỚI THIÊU CÔNG TY THỰC TẬP 1.1 Giới thiệu VNG Corp VNG thành lập ngày 09/09/2004, làmột công ty Internet vàCông nghệ hàng đầu Việt Nam vàĐông Nam Á, kỳ lân công nghệ tỷ USD+ Việt Nam với 3200 thành viên VNG có văn phịng đặt quốc gia, lĩnh vực hoạt động VNG tập trung vào nhóm sản phẩm chủ lực, mang đến cho người dùng trải nghiệm phong phú vàđơn giản 1.2 Sản phẩm công ty Hệ sinh thái ứng dụng vàdịch vụ VNG bao gồm nhóm chí nh, bao gồm: • Trịchơi trực tuyến: Phát triển vàsản xuất tròchơi trực tuyến, phát hành thị trường quốc tế Sản phẩm: Khu vườn mây, Dead target, iCá,… Nhập vàphát hành tròchơi tiếng giới Sản phẩm: VõLâm Truyền Kỳ, Rules of Survival, Crossfire Legend… • Nền tảng kết nối: Các tảng kết nối đa dạng, đa dịch vụ, phục vụ tồn diện nhu cầu kết nối, giải trí, tìm kiếm cá nhân tổ chức Nền tảng OTT Zalo, hệ sinh thái mạng xã hội giải trí Zing (Zing TV, Zing MP3, …) Các tảng vCS, 123Go, 123Phim, cơng cụ tìm kiếm Laban.vn… Nguyễn Hồng Phúc • Tài vàthanh tốn: Các tảng dịch vụ trung gian tốn, tài chí nh cá nhân theo xu hướng Sản phẩm: Cổng trung gian toán 123 Pay, Ví điện tử ZaloPay • Dịch vụ đám mây: Cung cấp dịch vụ đám mây toàn diện cho tổ chức, doanh nghiệp, địa phương Các hệ thống, giải pháp công nghệ thông minh dựa kết nối Internet công nghệ đám mây Sản phẩm: 123CS, Cloud server, IoT HUB, vCloudStack, vObjectStorage, Tape Backup, vCloudcam, Vending Machine, … 1.3 Lịch làm việc thực tập công ty Em tham gia làm việc công ty ngày 02/12/2019 tới 30/05/2020 Công việc ngày lúc 9:00am tới 6:00pm Thời gian nghỉ trưa khoảng tiếng rưỡi Sau ngày làm việc em báo cáo tiến độ công việc ngày, đặt câu hỏi vànhận chia sẻ, giải đáp từ anh hướng dẫn, đặt mục tiêu cho ngày làm việc Mỗi tuần họp tiến độ tuần lần, thường làchiều thứ Mọi người họp vàbàn bạc vấn đề đãgiải quyết, tồn đọng, học, giải pháp vàmục tiêu cho tuần Nguyễn Hồng Phúc CHƯƠNG 2: NỘI DUNG THỰC TẬP 2.1 Tìm hiểu cơng ty kỹ công ty Thời gian : ngày Nội dung : Giới thiệu công ty, cách tổ chức công ty Được nghe người phụ trách giới thiệu cơng ty, q trì nh thành lập phát triên, quy trình làm việc từ cao xuống thấp, cách thức tổ chức cơng ty Ngồi ra, thực tập sinh giới thiệu cách thức làm việc công ty thời gian làm, quy định cần phải tuân thủ, cách sử dụng email công việc… Kết : Hiểu thêm công ty cổ phần VNG, trình thành lập phát triển Có thêm kỹ việc sử dụng email cơng việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm 2.2 Nghiên cứu kỹ thuật 2.2.1 Các công cụ làm việc Thời gian : ngày Nội dung : Tìm hiểu cơng cụ sử dụng trình làm việc Trong thời gian này, anh lead hướng dẫn thực tập sinh tìm hiểu cơng cụ giúp ích cho công việc sau Một số phần mềm số Bộ cơng cụ XCode sử dụng để lập trình ứng dụng iOS, Zalo - ứng dụng trao đổi vàlàm việc nhóm, Source Tree - ứng dụng quản lýphiên mãnguồn Thực : Thực hành sử dụng phần mềm nêu Kết : Sử dụng thành thạo chứng phần mềm nêu trên, đáp ứng nhu cầu làm việc suốt quãng thời gian thực tập 2.2.2 Git / Git workflow Thời gian : ngày Nội dung: Được giới thiệu chi tiết Git Nguyễn Hồng Phúc 10 - Repository: nơi để lưu trữ, thư mục chứa tất mã nguồn, phiên - Head: trỏ vô mã nguồn bạn làm việc - Add: giúp Git biết tập tin cần theo dõi - Commit: yêu cầu Git lưu lại trạng thái repo - Remote: nơi chứa repositories không không nằm máy mà nằm khác (như Github, Gitlab ) - Pull: giúp lấy mã nguồn từ remote - Push: tải mã nguồn lên remote - Merge: kết hợp phiên khác mã nguồn lại thành - Status: hiển thị thơngtin tình trạng repo Ngoài mà người dùng Git biết, em biết thêm q trình thực tập cơng ty lệnh khác như: - Git rebase: quátrình gắn nhánh vào nhánh gốc - Gitlog: ghi lại thao tác xảy với repo - Git branch: phân nhánh để làm việc với Git Vàđể phối hợp nhịp nhàng thành viên với nhau, công ty sử dụng git workflow Kết : - Nắm Git - Biết cách sử dụng áp dụng vào cơng việc 2.2.2 Tìm hiểu ngơn ngữ Objective-C Thời gian : ngày Nội dung : Được training ngôn ngữ Objective-C, Foudation framework - Biên dịch vàchạy chương trì nh Sử dụng Xcode để soạn thảo code , cấu trúc chương trì nh - Class, Object vàMethod : Các khái niệm tương tự với khái niệm đãđược học mơn lập trì nh hướng đối tượng, nhiên cách triển khai, cũ pháp có phần khác so với ngơn ngữ C++, Java Nguyễn Hồng Phúc 18 Error handling: Trong swift xử lý với error handling pattern sử dụng NSError Cocoa vàObjective-C Để thị hàm, phương thức gây lỗi, ta sử dụng keyword throws trước phần khai báo tham số Khi dòng liệu hoạt động không mong muốn, gọi throw object(thỏa mãn NSError protocol) để ném lỗi cho phạm vi gọi tới hàm xử lý Tương tự ngơn ngữ khác ta cóthể sử dụng -catch pattern để xác định vàxử lýlỗi Trong quátrình handling lỗi, sử dụng từ khóa defer để tạo tập lệnh bảo đảm thực thi trước thoát khỏi phạm vi Type casting: Cách để kiểm tra kiểu thể (instance), để xem nónhư là1 kiểu lớp cha, lớp phân cấp Toán tử kiểm tra kiểu (is) giúp kiểm tra có phải làthể lớp hay không Thực tế biến, class thực chất là1 thể lớp đó, biết lớp đócóthể là1 lớp X ta chuyển đổi kiểu dựa toán tử down casting (as) Kết phép biến đổi thất bại nên ta sử dụng as? Vàas! Swift cung cấp kiểu đặc biệt để làm việc với kiểu liệu không rõ ràng (nonspecial) Any cho thể tất kiểu bảo gồm function type AnyObject cho tất class type Extensions: Giúp mở rộng (thêm – không overide) chức vào class, struct, enumeration, protocol cósẵn – bao gồm phần source code màchúng ta truy cập trực tiếp (tương tự category Objective-C khơng có tên) Chú ý extensions có thêm computed properties, khơng thể store properties hay observers properties đãtồn Nguyễn Hồng Phúc 19 Protocols: Định nghĩa method, properties, yêu cầu phùhợp với nhiệm vụ, chức cụ thể Được adopt class, structure, enumeration để thực thực thi u cầu cụ thể Ngồi protocols cịn cóthể dùng là1 parameter, kiểu trả method, function, initializer Một kiểu liệu biến, hằng, property Một kiểu items container (array, dictionary,…) Delegation làmột design parten cho phép class, structure thực hành động class khác thông qua protocols Một protocol kế thừa nhiều protocol khác Nếu muốn protocol adopted class (không phải structure, enumeration) ta kế thừa AnyObject protocol Các protocol kế hợp với ta muốn kiểu liệu phải conform nhiều protocols lúc với protocol composition (toán tử &) Chúng ta kết hợp tương tự trường hợp muốn kiểu giátrị thỏa mãn làsubclass class vàthỏa mãn protocol Generics: Generic code cho phép viết code cách linh động, có tí nh sử dụng lại (mang tính chất chung, dùng nhiều trường hợp – tương tự khái niệm template C++) Generic function với cúpháp dạng: Func swap(_ a: intout T, _ b: inout T) Generic type cho phép ta định nghĩa kiểu liệu (custom class, structure, enumeration) Struct Stack{ xử lýcác phần tử với tên gọi kiểu liệu làElement} Trong số trường hợp, ta cần đến ràng buộc kiểu liệu thay (T) Vídụ Dictionary nhận key phải conform với hashable interface Ràng buộc yêu cầu T phải thỏa mãn làsubclass S | thỏa mãn protocol P | protocol composition func someFunction(someT: T, someU: U) Nguyễn Hồng Phúc 20 Associated types: sử dụng protocol với từ khóa associatedtype Item để định nghĩa kiểu liệu khơng cómơtả rõràng, nóđược adopted thìmới rõràng Vídụ, Protocol Container có kiểu phần tử Item (chưa nó cụ thể nào) ta muốn tham số append vàsubscript làItem Ta cần định nghĩa kiểu Item protocol này: associatedtype Item Automatic Refrerence Counting: Cơ chế theo dõi vàquản lýbộ nhớ màta đãsử dụng, tự động giải phóng nhớ sử dụng thể hiên class khơng cịn sử dụng Mỗi thể class tạo ra, ARC tự động tạo vùng nhớ để lưu thông tin thể đó, nósẽ theo dõi tham chiếu đến thể hiện, vùng nhớ không giải tham chiếu đến thể Mỗi gán thể cho thể khác, có1 tham chiếu “strong” đến Cần lưu ývàxử lývới reference cycles thể class, thể class với Closures Khi xử lýinstance, sử dụng week thể cóvịng đời nhỏ vàunowned với thể có vịng đời lớn Khi xử lý closure, sử dụng unowned instance vàclosure cócùng thời điểm giải phóng (luôn tham chiếu đến nhau) Memory Safety: Mặc định, thao tác lập trì nh Swift ngăn chặn làunsafe Nó bảo đảm biến ln khởi tạo trước sử dụng, vùng nhớ không truy cập chưa cấp phát, kiểm tra mảng vượt quágiới hạn, giải xung đột nhiều truy cập vào vùng nhớ,… 2.2.5 Lập trình “Reactive programing” Thời gian: ngày Nội dung: Tìm hiểu vàtiếp cập phướng pháp lập trì nh theo luồng liệu Thực hiện: Nguyễn Hồng Phúc 21 Tì m hiểu nguyên lý hoạt động framework hỗ trợ lập trì nh phản ứng, gồm có reactive cocoa, reactRX, reactiveSwift, reactiveObjectiveC Trong tập trung thực hành reactiveSwift Kết quả: Sử dụng thành thạo lập trì nh dạng tí n hiệu vàcó khả áp dụng vào toán thực tế Thực project Sau thời gian đãnắm kiến thức lập trì nh iOS Em giao công việc tập trung vào xây dựng component cho Zalo Swift Trong báo cáo em xin trình bày project gần nhất, đólàxây dựng camera AR Nguyễn Hồng Phúc 22 CHƯƠNG 3: CHI TIẾT VỀ PROJECT 3.1 Giới thiệu ứng dụng Ứng dụng là1 thành phần phát triển độc lập, có khả tí ch hợp vào ứng dụng lớn khác cần đền chức sử dụng camera nâng cao Ứng dụng gồm chức sau: - Frame filter: lọc ảnh quay từ camera thành hì nh ảnh có màu sáng tùy chỉnh, ứng dụng hỗ trợ nhiều lọc để người dụng lựa chọn - Sticker: Thêm stickers vàcho phép chỉnh sửa thủ công (xoay, di chuyển, thu phóng) - Video effect: Thêm hiệu ứng động vào video (sấm chớp, tim bay,…) - Lưu trữ vàchia sẻ: Video, ảnh sau xử lýđược lưu trữ nhớ điện thoại, cóđịnh dạng phùhợp vàdễ dàng chia sẻ lên mạng xãhội - Xử lý lọc nâng cao (nhiều lọc lồng ghép), từ nguồn phát (camera, video) cóthể tạo lúc nhiều hiệu ứng sử dụng cho nhiều views khác Mục tiêu cần đạt: - Ứng dụng đáp dứng yêu cầu đặt ban đầu - Tối ưu xử lýảnh để tiếc kiệm lượng - Ứng dụng chạy thời gian thực (>24 FPS) - Cóthể tích hợp dễ dàng vào hệ thống khác Nguyễn Hồng Phúc 23 3.2 Thực Project thực vàđãcósản phẩm dùng thử sau: 3.2.1 Màn hình lựa chọn chức Các bước thực hiện: - Tạo UIButton với frame ¼ hì nh - Add Target vànavigate đến Controller tương ứng Nguyễn Hồng Phúc 24 3.2.2 Màn hình chức nhiều đối tượng tiêu thụ từ camera Các bước thực hiện: - Tạo Image source Protocol vàáp dụng cho camera - Đọc liệu từ camera vàchuyển thành texture - Sử dụng Metal shader languege tạo lọc trực tiếp GPU - Tạo Image cosumer protocol sử dụng cho lọc vàview cuối - Hiển thị ảnh lên view texture availble (>30 hì nh/giây) - Nguyễn Hồng Phúc 25 3.2.3 Màn hình áp dụng nhiều lọc Các bước thực hiện: - Đọc liệu từ camera áp dụng Image source protocol - Xử lýmỗi lọc lần lọc cuối - Hiển thị kết lên view frame Nguyễn Hồng Phúc 26 3.2.4 Màn hình áp dụng hiệu ứng video Các bước thực hiện: - Đọc liệu từ video effect - Tạo lọc loại bỏ background effect - Đọc liệu từ camera - Kết hợp texture nhận từ nguồn vàgửi kết đến view frame Nguyễn Hồng Phúc 27 3.2.5 Màn hình chụp ảnh/quay video Các bước thực hiện: - Tải texture từ stick chuẩn bị sẵn - Đọc liệu từ camera - Tạo control đại diện cho sticker hì nh - Đọc tọa độ, thơng tin độ thu phóng, góc xoay stick control - Kết hợp texture từ camera vàsticker tạo thành texture vàgửi đến view Nguyễn Hồng Phúc 28 Nguyễn Hồng Phúc 29 3.2.6 Kết xử lýảnh vàvideo lưu vào thư viện Nguyễn Hồng Phúc 30 TÀI LIỆU THAM KHẢO [1] https://www.raywenderlich.com/2992-beginning-arc-in-ios-5-tutorial-part-1 [2] Metal shader language, apple [3] https://www.raywenderlich.com/3090-memory-management-tutorial-for-ios [4] https://stackoverflow.com/questions/30532200/nsmutablearray-thread-concurrency-withgcd [5] https://developer.apple.com/documentation/dispatch?language=objc [6] https://viblo.asia/p/cac-khai-niem-co-ban-ve-grand-central-dispatch-gcd-m68Z039dKkG [7] https://viblo.asia/p/grand-central-dispatch-part-2-QWkwGna3M75g [8] https://www.raywenderlich.com/5995-beginning-table-views/lessons/1 [9] https://techtalk.vn/tron-bo-9-clip-huong-dan-autolayout-trong-xcode-8-moi-nhat.html [10] https://www.raywenderlich.com/811496-auto-layout-tutorial-in-ios-getting-started [11] https://viblo.asia/p/auto-layout-trong-ios-va-nhung-dieu-can-biet-p1-bJzKm0ow59N [12] https://www.twilio.com/blog/2018/05/xcode-auto-layout-swift-ios.html [13] https://medium.com/@abhimuralidharan/ios-content-hugging-and-content-compressionresistance-priorities-476fb5828ef [14] https://viblo.asia/p/auto-layout-tutorial-in-ios-9-part-1-aKYMNBLbM83E [15] https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/Autolay outPG/ConflictingLayouts.html#//apple_ref/doc/uid/TP40010853-CH19-SW1 [16] https://www.youtube.com/watch?v=GTp_AcwbPUc&list=PL23Revp-82LIMTPyLtvzTCDl-vJKwjlU&index=7 [17] https://krakendev.io/blog/autolayout-magic-like-harry-potter-but-real [18] https://github.com/codepath/ios_guides/wiki/Auto-Layout-Basics [19] https://www.youtube.com/watch?v=XKlk3Dqjm9I&list=PLWBrqglnjNl0FySgr9U2ScGEhDnx kfobK Nguyễn Hồng Phúc 31 [20] https://savvyapps.com/blog/using-advanced-auto-layout-techniques-to-adapt-interfaces-toscreen-content-intrinsic-content-size-stack-views [21] https://www.raywenderlich.com/433-uigesturerecognizer-tutorial-getting-started [22] https://www.raywenderlich.com/2925473-ios-animation-tutorial-custom-view-controllerpresentation-transitions [23] https://www.raywenderlich.com/2650-uikit-dynamics-tutorial [24] https://medium.com/@kevalpatel2106/what-is-reactive-programming-da37c1611382 [25] https://medium.com/fueled-engineering/conquering-reactiveswift-primitives-part-23f39d47d7bc [26] https://www.raywenderlich.com/2493-reactivecocoa-tutorial-the-definitive-introductionpart-1-2 [27] https://github.com/gokhanakkurt/MVVM-Reactive-Sample [28] https://learnappmaking.com/urlsession-swift-networking-how-to/ [29] https://www.youtube.com/watch?v=WZaYJVBVRY0 https://www.raywenderlich.com/3136-sqlite-tutorial-for-ios-making-our-app [30] https://www.raywenderlich.com/818-asyncdisplaykit-2-0-tutorial-getting-started [31] https://www.appcoda.com/avfoundation-swift-guide/ [32] https://developer.apple.com/documentation/avfoundation/cameras_and_media_capture/requesti ng_authorization_for_media_capture_on_ios [33] http://www.it.hiof.no/~borres/j3d/math/twod/p-twod.html Nguyễn Hồng Phúc 32 TỔNG KẾT Như vậy, dù thời gian hạn chế, em cố gắng hoàn thành tốt ứng dụng camera AR với tính năng, yêu cầu đặt ban đầu Ứng dụng thiết kế từ lowlevel-API vìthế có hiệu suất ổn định, bảo đảm kiến thức tiếp thu làđủ sâu để phát triển thêm tí nh nâng cao Ứng dụng hồn tồn cóthể tí ch hợp vào dự án khác cần đến camera AR vàcũng cóthể kế thừa vàtiếp tục phát triển tí nh Chân thành cảm ơn giúp đỡ anh chị nhóm iOS Platform, hỗ trợ anh chị, bạn bètrong công ty đãgiúp đỡ, hỗ trợ để em cóthể hồn thành tốt nhiệm vụ giao quãng thời gian thực tập công ty Nguyễn Hồng Phúc ... iOS, Zalo - ứng dụng trao đổi vàlàm việc nhóm, Source Tree - ứng dụng quản lýphiên mãnguồn Thực : Thực hành sử dụng phần mềm nêu Kết : Sử dụng thành thạo chứng phần mềm nêu trên, đáp ứng nhu cầu... sử dụng trình làm việc Trong thời gian này, anh lead hướng dẫn thực tập sinh tìm hiểu cơng cụ giúp ích cho công việc sau Một số phần mềm số Bộ cơng cụ XCode sử dụng để lập trình ứng dụng iOS, ... nghiệp ứng dụng di động phát triển mạnh mẽ, để hòa nhập với cơng ty hàng đầu lập trì nh ứng dụng giới Lĩnh vực lập trình ứng dụng di động phát triển bắt kịp xu hướng phát triển chung, đáp ứng tốt