Recommended
More Related Content
What's hot
What's hot (20)
Similar to Androidをやっただけで iOSアプリもできればいいのに 〜MOEという選択〜
Similar to Androidをやっただけで iOSアプリもできればいいのに 〜MOEという選択〜 (20)
More from Saiki Iijima
Androidをやっただけで iOSアプリもできればいいのに 〜MOEという選択〜
- 2. 目次 ● 自己紹介 ● MOEとは？ ● 使いかた ● まとめ
- 4. 是非覚えて帰ってください
- 7. ● ReactNative ● Flutter ● Xamarin
- 8. ● ReactNative -> JavaScript ● Flutter -> Dart ● Xamarin -> C#
- 17. どう作っていくか
- 22. CommonModule
- 24. CommonModule
- 25. Common-module
- 26. /common /app (Android) app-module Model Presenter (ViewModel) /ios View View (ViewModel・LiveData)
- 27. app-module
- 29. Androidアプリ完成
- 31. iOS
- 33. プラグインを入れる
- 34. ios-moduleを作る
- 35. ios-moduleを作る
- 36. UIを作る
- 38. いろいろします（割愛）
- 41. Viewを作る
- 42. Viewを作る
- 44. 実装
- 45. 実装
- 46. 完成 で完成
- 48. MOEポイント
- 49. 萌えポイント
- 53. MOEポイント 人気がない
Editor's Notes
- 4月からAndroidアプリ開発を初めてその前はGoでAPIを作ったりC#でソーシャルゲームを作っていたりしました。
- 4月からAndroidアプリ開発を初めてその前はGoでAPIを作ったりC#でソーシャルゲームを作っていたりしました。
- さて、きょうはAndroidエンジニアの方が多いと思うのですが、Androidアプリを開発しただけでiOSアプリもついでにできればいいのにって思ったことありませんか？ ありますよね？ 多分Androidエンジニアの三大欲求の一つに入ってるんじゃないですかね
- クロスプラットフォーム対応といえば
- ReactNative -> JavaScript Flutter -> Dart Xamarin -> C#
- ReactNative -> JavaScript Flutter -> Dart Xamarin -> C#
- ただ今回の話はついでなので
- できればAndroidアプリはいつも通りに開発したいですよね Android Architecture Components とかも普通に使いたい。 そういったケースにぴったりのフレームワークを紹介します
- それが Intel Multi-OS Engine 通称MOE・もえ、ですね MOEなのかもえなのかもえなのかわからないのですが今日はあえて一番耳馴染みの良さそうなもえでいきたいと思います。 このもえ個人的にかなりよくできてておすすめなんですが、使ったことある方いらっしゃいますか？ ね、もえなんていう日本人向けみたいな略称してる割に全然日本で使ってる人がいないんですよ。 ということできょうはこのMOEがどんなものなのか、どこがいいのか紹介して、ユーザーを増やしたいと思っています。
- IntelとMigeranによって開発されている オープンソースフレームワーク AndroidとiOSのアプリを Java（Kotlin）で作成することが可能
- 公式の図を借りてきました 従来の開発だと AndroidチームがAndroidをJavaとAndroidStudioで開発して、iOSチームがXCodeとObc,swiftで開発しています。 当然、コードも似たようなロジックが別言語で二つ書かれることになります。
- もえを使った場合 一つのロジックコード 一つの言語 一つのIDE 一つの開発システムで iOSとAndroidをnativeなUIで作ることができます
- Androidアプリの作り方はほぼ変わらないので、いつも通りのAndroidアプリ開発+アルファでiOSを作ったり、既存のAndroidアプリケーションをあとからiOSに対応させることが理論的には可能 最悪途中でMOEを使うのやめたくなってやめたとしても、Androidアプリは問題なく動かすことが可能
- Androidアプリの作り方はほぼ変わらないので、いつも通りのAndroidアプリ開発+アルファでiOSを作ったり、既存のAndroidアプリケーションをあとからiOSに対応させることが可能 java・Kotlin好きな方でかけるしJavaのLibralyも普通に利用することが可能 RetroFitやRxJava
- Androidアプリに影響を与えないとはいえ少しだけ気を使う必要がある
- 普通のアプリだとappModulにView ViewModel Model が入ってると思います。
- このように PresenterとModelをcommonModuleに切り離し iosとandroidのView部分をそれぞれ別モジュールにする必要があります。
- 今回はViewModelとLiveDataを使いたいのでAndroidのViewがわにViewModelとLiveDataを噛ませています これはお好みですね
- では早速Androidから作っていきましょう
- CommonModuleを作っていきます
- やることは簡単でREtrofitとRxJava2を使ってAPIを叩き、結果が返ってきたらPresenterを通してViewを更新します。 ここで重要なのは特別なことをする必要がないということです。いつも通り特にきにすることなくRetrofitもRxJavaも使えます
- JavaLibrary作ります
- ほぼ割愛しますが、ViewとPresennterを作って、PresenterでRetrofitを使ってAPIを叩いて successだったらViewのshowRepoListを呼ぶだけですね。
- 次はAndroidのViewです
- これも特にいうことないんですが、 先ほど行ったように今回はViewModelとLivedataを噛ませています。 Viewを継承して、データが来たらLiveDataにSetValueするだけです
- MainActivityでObserveしてリスト表示のメソッドを呼ぶだけです なかでAdapterにデータをセットしたりして普通のアプリと同じように表示させているだけです
- Androidアプリは完成です
- 大事なことは共有したいロジックをcommonに分けるということだけですね。 あとAndroidの世界のものを持ち込まないということです。 それ以外は普通のAndroidアプリと変わりません。
- ios
- Viewだけ作っていきます commonはさっき作ったので全く触る必要はありません
- プラグインをいれます これだけで準備完了です
- 右クリックでMoe関連のアクションが表示されるようになるのでそこからMulti-OS EngineModuleを作ります おすと反応がなくなって死んでしまったのかな？って思うんですけど しばらく待つとXcodeプロジェクトなどの必要なファイルも全て作られます。
- ここまでやるととりあえず実行することができます。 AndroidStudioの右上から実行するとiOSのエミュレータが立ち上がってipaが実行されます。
- UIを作っていきます。 ここだけXcodeでの作業になります。 右クリックからXcodeをひらけるので開いて
- 普通のiOSアプリと同じようにCocoaTouchを使ってUIを作っていきます まずはファイルを作ります 今回はRepositoryListViewController
- リストとかリストアイテムとかいろいろ設置していくんですが、 ここはMOEは特に関係なく純粋なiOSアプリを開発するのと全く同じ手順なので割愛します 一つ注意する点としてlanguageはOBJ-Cにする必要があるようです TableViewつくってItemおいてレイアウト整えてドラッグ&ドロップしたりNavigationBarを追加したりしました。
- ここで大事なのはiOSのUI作成にMOEは関係ないということです。 わからなければiOSのUIとしてググればかいけつできますしやっぱりiOSアプリを普通に作りたいなと思った場合でもUIはそっくりそのまま利用することが可能です。
- ここからがMOE独自の操作です 右クリックからCreateNewBindingを選び
- 細かいことは割愛しますが色々設定をいれて先ほどXcodeで作ったRepositoryListViewControllerを対象にしてGenerateBindingsすると…
- こんな感じでUIViewControllerを継承したRepositoryListViewController.javaが自動で生成されます。
- 引きで見るとこんな感じで、UIViewControllerに必要なメソッドが一通り生成されます。 NatJというライブラリが頑張ってくれていて、同様の手順でたいていのiOSのNativeLibraryをJava,Kotlinで利用することができます。 生えてるメソッドをオーバーライドしていくことでiOS側での振る舞いを実装することが可能です。 赤くなってますがビルドできますし、Kotlinに変換してやると赤く無くなります。
- あとはcommonModuleのViewと 多分iOSでおなじみの UITableViewDataSourceとUITableViewDelegateを継承しつつ
- viewDidLoadでApi叩いてshowRepoListでリストを更新するような処理を書いてあげれば
- Androidアプリ開発はほぼそのままにiOSのViewを追加するだけでどっちもできました。 どうでしょう？結構よくないですか？ さて、最後にマルチOSエンジンのポイント
- 最後にMultiOsEngineのポイント、通称MOEポイントをおさらいしましょう。
- 最後にMultiOsEngineのポイント、通称MOEポイントをおさらいしましょう。
- AndroidStudioとJava(Kotlin) + XcodeでのUI組み立て で両OS に対応できる
- Nativeと同様のUIでnativeと同様のパフォーマンスです
- NatJによってiOSのAPIとNativeLibraryにフルアクセスできる
- 海外のブログでReactNativeやXamarinよりMOEがいいよ！と言っている人でさえ、 人気がないことが一番の問題だというくらい人気がない
- コミュニティはちゃんといきていて質問すれば結構答えてもらえます。 開発の人も結構登場して丁寧に教えて暮れます。 英語。 できれば日本語のコミュニティを作りたいですね。 ということで Multi-OS Engine すごくおすすめなので皆さん是非
- みなさん是非、MOEを使ってMOEのMOEポイントに萌え萌えしましょう