- vừa được xem lúc

Bắt đầu xây dựng Mobile App với Kotlin Multiplatform Mobile (KMM)

0 0 25

Người đăng: Miên PV

Theo Viblo Asia

Trước khi bước vào xây dựng một Mobile App bằng Kotlin Multiplatform Mobile, bạn nên biết về Kotlin Multiplatform Mobile là gì và các công cụ cần thiết (Xcode, JDK, Android Studio, Kotlin Multiplatform Mobile module,...) để bắt đầu với việc viết code.

Tổng quan về Kotlin Multiplatform Mobile bạn có thể tìm đọc ở bài viết của mình: https://viblo.asia/p/tong-quan-ve-kotlin-multiplatform-mobile-kmm-5pPLkGRyLRZ

Còn nếu bạn đã biết rõ, okay bắt đầu thôi!

1. Check your environment

Đối với các máy sử dụng MacOS, bạn cần cài đặt và run KDoctor tool

Terminal, gõ lệnh

brew install kdoctor

Muốn gõ lệnh trên thì bạn cũng phải cài đặt Homebrew cho máy đã nhé. (Cách cài tại https://brew.sh/)

2. Bắt đầu tạo cross-platform app

Tạo Project từ Template

  1. Ở Android Studio, chọn File | New | New Project.
  2. Chọn Kotlin Multiplatform App từ danh sách templates, click Next.

  1. Đặt tên cho Project rồi tiếp tục click Next

  1. Tại iOS framework distribution, chọn Regular framework. Các Android, iOS hay Shared Name nên để mặc định như vậy luôn nhé.

  1. Click Finish.

Project sẽ được cài đặt tự động, mất một chút thời gian để download và setup các components được yêu cầu.

Xem qua cấu trúc project

Với mỗi project Kotlin Multiplatform Mobile sẽ có ba modules chính

  • shared: module Kotlin này chứa logic chung cho cả ứng dụng Android và iOS – nghĩa là khi bạn code ở phần shared này sẽ chạy chung cho cả hai nền tảng. Nó sử dụng Gradle làm hệ thống xây dựng giúp bạn tự động hóa quy trình xây dựng của mình. Module dùng chung được tích hợp vào thư viện Android và iOS framework.
  • androidApp là một Module Kotlin tích hợp vào một ứng dụng Android. Nó sử dụng Gradle làm hệ thống xây dựng. Module androidApp phụ thuộc vào và sử dụng shared module như một thư viện Android thông thường. Nhìn ảnh dưới đây sẽ thấy nó rất quen thuộc đối với bạn nào thường xuyên lập trình Android.

  • iOSApp là một Xcode project được build thành một ứng dụng iOS. Nó phụ thuộc và sử dụng mô-đun được chia sẻ làm khung iOS.

Root project

Shared module bao gồm ba bộ source chính: androidMain, commonMain, and iosMain. Trong Kotlin Multiplatform, các bộ source khác nhau trong shared module có thể hướng đến riêng cho các platform khác nhau.

3. Run App

Okay bây giờ đến phần run App thôi!

Run App trên Android

  1. Tạo một máy ảo Android (Android virtual device). Cách tạo theo link hướng dẫn: https://developer.android.com/studio/run/managing-avds#createavd
  2. Ở vị trí này, bạn chọn androidApp sau đó click Run (Hoặc ^R cho MacOS, Ctrl + R cho Windows nhé)

3. Và đây là kết quả

Run App trên iOS

  1. Mở XCode, lần đầu build KMM thì bạn cần phải đồng ý vài điều khoản điều kiện của nó.
  2. Giờ, thay vì chọn Andoird App thì bạn chọn iosApp sau đó click Run, chờ một lát để nó build những thứ cần thiết nhé.

  1. Và đây là kết quả

4. Code App

Mở Greeting.kt file ở shared/src/commonMain/kotlin. Thư mục này chứa shared code cho cả Android và iOS. Bạn code bất cứ thứ gì ở file này nó sẽ đều chạy ở cả hai nền tảng.

Bây giờ re-run lại androidApp hoặc iOSApp để xem kết quả nhé. Mình đang chạy app iOS, androidApp cũng cho ra kết quả như vậy.

Thành công!!!

Như vậy mình đã trình bày cho các bạn cách để run thành công một project KMM trên cả hai nền tảng, trong các bài viết tiếp theo mình sẽ đi sâu hơn ví dụ như thêm các dependencies, hay upgrade project của mình.

Cảm ơn bạn đã đọc bài viết!

References

Create your first cross-platform app, Last modified: 21 October 2022, src: https://kotlinlang.org/docs/multiplatform-mobile-create-first-app.html
Source Cover Page: https://devhub.global/event/ios-developer-private-event-london-27th-april-2022/

Bình luận

Bài viết tương tự

- vừa được xem lúc

Học Flutter từ cơ bản đến nâng cao. Phần 1: Làm quen cô nàng Flutter

Lời mở đầu. Gần đây, Flutter nổi lên và được Google PR như một xu thế của lập trình di động vậy.

0 0 281

- vừa được xem lúc

Học Flutter từ cơ bản đến nâng cao. Phần 3: Lột trần cô nàng Flutter, BuildContext là gì?

Lời mở đầu. Màn làm quen cô nàng FLutter ở Phần 1 đã gieo rắc vào đầu chúng ta quá nhiều điều bí ẩn về nàng Flutter.

0 0 206

- vừa được xem lúc

[Android] Hiển thị Activity trên màn hình khóa - Show Activity over lock screen

Xin chào các bạn, Hôm nay là 30 tết rồi, ngồi ngắm trời chờ đón giao thừa, trong lúc rảnh rỗi mình quyết định ngồi viết bài sau 1 thời gian vắng bóng. .

0 0 107

- vừa được xem lúc

Tìm hiểu Proguard trong Android

1. Proguard là gì . Cụ thể nó giúp ứng dụng của chúng ta:. .

0 0 100

- vừa được xem lúc

Làm ứng dụng học toán đơn giản với React Native - Phần 6

Chào các bạn một năm mới an khang thịnh vượng, dồi dào sức khỏe. Lại là mình đây Đây là link app mà các bạn đang theo dõi :3 https://play.google.com/store/apps/details?id=com.

0 0 68

- vừa được xem lúc

20 Plugin hữu ích cho Android Studio

1. CodeGlance. Plugin này sẽ nhúng một minimap vào editor cùng với thanh cuộn cũng khá là lớn. Nó sẽ giúp chúng ta xem trước bộ khung của code và cho phép điều hướng đến đoạn code mà ta mong muốn một cách nhanh chóng.

0 0 315