Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
クロスプラットフォームモバイルアプリ開発ツール総ざらい2019 〜Titanium M...
Search
amay077
February 07, 2019
Programming
11
10k
クロスプラットフォームモバイルアプリ開発ツール総ざらい2019 〜Titanium Mobile から Kotlin/Native まで〜 #droidkaigi
DroidKaigi 2019 Day1 roomC 16:30〜
amay077
February 07, 2019
Tweet
Share
More Decks by amay077
See All by amay077
愛知県新型コロナ対策サイト(非公式)の紹介
amay077
0
300
愛知県コロナ対策サイトが立ち上がってから
amay077
0
97
Xamarin.Forms Hot Reload のススメ
amay077
0
860
ハムスター検出器を1日で作ってみた #NGK2018B
amay077
1
1.1k
App Center から Azure Pipeline に乗り換えた話
amay077
0
1.3k
Xamarin.Forms.GoogleMaps について
amay077
0
1.5k
Xamarin.Android で始めるクロスプラットフォームモバイルアプリ開発 #jaghama
amay077
0
640
Xamarin.Android で始めるクロスプラットフォームモバイルアプリ開発 #jxug
amay077
0
950
Xamarin.Android で始めるクロスプラットフォームモバイルアプリ開発 #droidkaigi #droidkaigi1
amay077
3
3.6k
Other Decks in Programming
See All in Programming
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
680
Team topologies and the microservice architecture: a synergistic relationship
cer
PRO
0
1.2k
Kotlin エンジニアへ送る:Swift 案件に参加させられる日に備えて~似てるけど色々違う Swift の仕様 / from Kotlin to Swift
lovee
1
260
LINEヤフー データグループ紹介
lycorp_recruit_jp
0
1.9k
童醫院敏捷轉型的實踐經驗
cclai999
0
210
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
chiilog
1
260
Deep Dive into ~/.claude/projects
hiragram
12
2.3k
関数型まつりレポート for JuliaTokai #22
antimon2
0
160
20250628_非エンジニアがバイブコーディングしてみた
ponponmikankan
0
640
AIコーディング道場勉強会#2 君(エンジニア)たちはどう生きるか
misakiotb
1
280
iOS 26にアップデートすると実機でのHot Reloadができない?
umigishiaoi
0
110
プロダクト志向なエンジニアがもう一歩先の価値を目指すために意識したこと
nealle
0
120
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
140
7k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
The Language of Interfaces
destraynor
158
25k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
How STYLIGHT went responsive
nonsquared
100
5.6k
Adopting Sorbet at Scale
ufuk
77
9.4k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
It's Worth the Effort
3n
185
28k
Transcript
ΫϩεϓϥοτϑΥʔϜ ϞόΠϧΞϓϦ։ൃπʔϧ ૯͟Β͍2019 2019.2.7 DroidKaigi2019 @amay077 ʙTitanium Mobile͔ΒKotlin/Native·Ͱʙ
About me • Ԟࢁ ༟ਈ - @amay077ʢ͋Ί͍ʣ • Android, iOS,
Xamarin, TypeScript AWS, Azure… • ѪݝࡏॅͷϑϧϦϞʔτϫʔΧʔ • ཧใγεςϜɺҐஔใϓϩάϥϛϯά • DroidKaigi2017ొஃˠٕज़ॻయ2→ۀຊԽ(ڞஶ)
Work for • B2B͚PaaSɺݿཧɾӡૹۀ͚SaaS • AWS, Elasticsearch, Cassandra,
Lambda, etc • શһ͕ϑϧϦϞʔτϫʔΧʔ ͓ࣄ༰ϦϞʔτͰͷಇ͖ํͳͲڵຯ͋Δํɺؾܰʹฉ͍͍ͯͩ͘͞
ࠓ͓ͳ͢͠Δ͜ͱ Android ͱ iOS ͚ͷʮωΠςΟϒΞϓϦʯ͕ ։ൃͰ͖Δπʔϧʹ͍ͭͯ ΨϫωΠςΟϒWebΞϓϦͱͷൺֱ ࠓ͓ͳ͠͠ͳ͍ࣄ ϕετϓϥΫςΟε ήʔϜܥ
੩తϥΠϒϥϦ(.a) ΒΜ
༻ޠॖ͠·͢ ΫϩεϓϥοτϑΥʔϜˠ X-Plat ϓϥοτϑΥʔϜ → PF R/N → React Native
K/N → Kotlin Native Multi Platform Project → MPP
Agenda 1. ͳͥX-Plat։ൃπʔϧΛ͏ͷ͔ʁ 2. X-Plat։ൃπʔϧྲྀߦͷྺ࢙ 3. X-Plat։ൃπʔϧͷྨ 4. Kotlin/NativeͷՄೳੑ 5.
VS WebΞϓϦ
ͳͥ X-Plat։ൃπʔϧΛ͏ͷ͔ʁ
A:ʮແݶͷϚχʔ͕ͳ͍͔ΒͰ͢ʯ
X-Plat։ൃπʔϧ ʮඞཁѱʯ Ͱ͢
ͳͥX-Plat։ൃπʔϧΛ͏ͷ͔ʁ ʢۀγεςϜ։ൃऀͷཱ͔Βʣ 1. ࣾһ20ਓதɺϞόΠϧ୲͕1ʙ2ਓ͔͠ډͳ͍ 2. Ϧʔυސ٬ͷཁٻʹԠͯ͡ɺਝʹϓϩτλΠϓ Λ࡞Δඞཁ͕͋Δ(Android? iOS? ͍྆ํ) 3.
Android൛Λೲͨ͠ޙͰɺiOS൛ͷ։ൃґཔ͕ དྷΔˠͦͷޙͷอकΛ̍ਓͰΔ͜ͱʹ
ͳͥX-Plat։ൃπʔϧΛ͏ͷ͔ʁ ʢݸਓϓϩάϥϚͷཱ͔Βʣ 1. झຯͰAndroidΞϓϦΛ3ϲ݄͘Β͍͔͚ͯ࡞ͬͨ 2. ετΞʹϦϦʔεͨ͠ΒׂͱߴධՁͩͬͨ 3. iOS൛ཉ͍͠ͱݴΘΕͨ 4. ͍͟
iOS൛ ։ൃʹணख͕ͨ͠ɺ·ͨ3ϲ݄͔͚ͯ ಉ͜͡ͱΛΔͷ͔ʔʢઓҙࣦ
X-Plat։ൃπʔϧ͚ͩͲX-Plat͡Όͳ͍ ޮΑ͘։ൃͰ͖ΔϛυϧΣΞͱͯ͠ͷX-Plat։ൃπʔϧ AndroidϚϯ͚ͩͲReactNativeͰiOS൛Ͱ͖·ͨ͠ iOSΨʔϧ͚ͩͲFlutterͰAndroid൛Ͱ͖·ͨ͠ AndroidϚϯ͚ͩͲXamarin.FormsͰAndroid൛͚ͩ࡞Γ ·ͨ͠ →⭕ʮ͓·͡ͳ͍ʯʮ͓࡞๏ʯ͕ڞ௨APIʹ࣮ࡁΈ
X-Plat։ൃπʔϧ ྲྀߦͷྺ࢙ ⏰45
Titanium Mobile by Appcelerator • ྲྀߦ: 2011ʙ ※Զ؍ଌʹΑΔ • JavaScript
Ͱ iOS ͱ Android ΞϓϦ͕࡞ΕΔͱ͍͏৮ΕࠐΈ • ݩτϨλͷ @masuidrive ͞Μ͕ΤϰΝϯδΣϦετͯͨ͠ • Zaim ͷॳظόʔδϣϯίϨͩͬͨ • ࢲධ:ʮiOSͰ͔͠ಈ͔ͳ͍APIଟ͗͢ϫϩλʯ
AIR for Mobile by Adobe • ྲྀߦ(ͯ͠ͳ͍Ͷ): 2012ʙ • ActionScript
ͰҎԼಉจ • Adobe FlashܥͳͷͰʮUIಠࣗඳըํࣜʯΛ࠾༻ • Α͘ѱ͘ʮFlashͬΆ͍ʯΞϓϦʹͳͬͨ • ࢲධ:ʮͬ͞Γ͕ͯ͠Δ…த՚ϑΥϯτ…ʯ
RubyMotion by Scratchwork • ྲྀߦ: 2013ʙ • Ruby Ͱ iOS
ͱ Android(ޙൃ) ΞϓϦ͕࡞ΕΔͱ͍͏৮ΕࠐΈ • iOS·ͨAndroidͷAPI͕Ruby͔Βݺͼग़ͤΔͱ͍͏ PFͷAPIϥούΛఏڙ • ݩͯͳCTOͷਓ͕ rebuild.fmͰڭ? • ࢲධ:ʮWebܥRubyistʹͬͱΘΕΔ͔ͱࢥ͚ͬͨͲͶ…ʯ
Delphi/C++Builder by Embarcadero • 2013ʙ • Delphi/C++ Ͱ iOSͱAndroidɺWin/Mac͚ΞϓϦ͕։ൃՄ •
Adobe Airͱಉ͘͡ʮUIಠࣗඳըํࣜʯΛ࠾༻ • ͭɺiOS·ͨAndroidͷAPIͷAPIϥούʔఏڙ • ࢲධ:ϚχΞ͕બͿʰͬͱධՁ͞ΕͯΑ͍։ൃπʔϧNo.1ʱ
Xamarin by Mircosoft • ྲྀߦ: 2016ʙ • C#/.NET Ͱ iOS
ͱ AndroidɺWin͚ΞϓϦ͕։ൃՄ • Android/iOS APIͷϥούʔʹՃ͑ɺ .NET FrameworkͷҰ෦ػೳΛڞ௨APIͱͯ͠ఏڙ • ը໘։ൃʹɺڞ௨API(Xamarin.Forms)Λఏڙ • ࢲධ:ʮ࠷ۙฉ͔ͳ͍ʁ.NETͷҰ෦ͱͯ͠ਁಁ͠·ͨ͠ɻʯ
ReactNative by Facebook • ྲྀߦ: 2016ʙ • React Ͱ iOS
ͱ AndroidɺWeb͚ΞϓϦ͕։ൃՄ • ڞ௨APIͱڞ௨ͷը໘ఆٛ(JSX)Λఏڙ • AirBnB͕Ϧʔυͨ͠ྲྀߦظͱݬ໓ظΛܦͯ҆ఆظʹʁ • Skype ReactNative(ReactXP)
Flutter by Google • ྲྀߦ: 2017ʙ • Dart Ͱ iOS
ͱ Android͚ΞϓϦ͕։ൃՄ(Web͜Ε͔Β) • ಠࣗඳըํࣜʹΑΓAndroidͰiOSͰMaterialͳUIΛఏڙ (iOS-style ͋Γ) • HotReloadʹΑΔരը໘։ൃ͕ߴධՁ • ौ୩ͷJKͷ60%͕ʮDartͰͳ͚Ε…ʯͱճ
Kotlin/Native with MPP by JetBrains • ྲྀߦ: 2018?ʙ • Kotlin/Native
• Kotlin ͔Β iOS(ͷଞPF)ͷ API ͕͑Δ • iOS/Android/Web͚ ωΠςΟϒ ϥΠϒϥϦ͕ϏϧυͰ͖Δ • MPP(Multi Platform Project) • ڞ௨APIΛ࡞ΔΈ(expect:ڞ௨API, actual:PFຖͷ࣮)
X-Plat։ൃπʔϧ ͷྨ ⏰45
ը໘ඳըํࣜʹΑΔྨ 1. PFʹҕৡ ϓϥοτϑΥʔϜͷUIύʔπ͕༻͞ΕΔ ʢAndroid:TextView, iOS:UILabel ʣ 2. ಠࣗඳը UIύʔπΛCanvasʹࣗྗͰඳը
PFʹҕৡํࣜͷಛ ⭕ωΠςΟϒͰ࡞ͬͨUIͱશʹಉ͡UXͰ͋Δ ⭕PF͚ͷOSSΛར༻͍͢͠ ❌ରԠPF͕૿͑Δͱɺͦͷ࣮͕ඞཁ ❌PFຖʹػೳ͕ҟͳΔͱڞ௨Խ͕ͮ͠Β͍ ྫ:iOSͷTextFieldʹauto-size͕͋Δ͚Ͳ…
ಠࣗඳըํࣜͷಛ ⭕εΩϯΛม͑Δ͚ͩͰPFͬΆ͍ݟͨʹͳΔ ⭕1ͭͷ࣮ͰଞPFʹରԠՄೳ ❌PF͚ͷOSSϥΠϒϥϦΛར༻ͮ͠Β͍ WebView, MapͳͲͳͲ ❌CJK(ςΩετඳըɾೖྗ)पΓͰτϥϒϧى͖͕ͪ
APIఏڙํࣜʹΑΔྨ 1. PFͷAPIϥούΛఏڙ͠ͳ͍ 2. PFͷAPIϥούΛఏڙ͢Δ Ruby͔ΒActivityΫϥε͕͑Δ ,PUMJO͔ΒUIViewController͕͑Δ
X-Plat։ൃπʔϧͰͷ࣮ͷجຊ 1. X-Plat։ൃπʔϧͷݴޠͷඪ४API,ΫϥεΛ͏ 2. X-Plat։ൃπʔϧ༻ͷڞ௨APIΛ͏ Core “Flutter” primitives ͳͲ 3.
1 2 ʹతͷAPI͕ͳ͚Εڞ௨APIΛࣗ࡞͢Δ 1→2→3ͷॱʹ࠶ར༻ੑམ͍ͪͯ͘ͷͰɺͳΔ͘1ͰؤுΔ ͕࣮ࡍͱͯ͠ 3. ඞਢͳͷͰڞ௨APIͷࣗ࡞ͷ͕͢͠͞ॏཁ
ڞ௨APIͷجຊతͳߟ͑ํ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠) *OUFOUΛ͛ͯ ΧϝϥΛىಈʜ
actual:Android͚ͷ࣮ 6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ actual:iOS͚ͷ࣮ ࣮͕ೖ͞ΕΔ ΞϓϦ ※ͬͱϩʔϨϕϧͳจࣈྻʹΑΔ Invoke Λ࠾༻͢ΔX-Plat͋Γ
ڞ௨APIͷجຊతͳߟ͑ํ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠) *OUFOUΛ͛ͯ ΧϝϥΛىಈʜ
actual:Android͚ͷ࣮ 6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ actual:iOS͚ͷ࣮ ࣮͕ೖ͞ΕΔ ΞϓϦ ͜͜ΛԿݴޠͰ ॻ͘ͷ͔ʁ
ReactNative ͷ߹ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠) *OUFOUΛ͛ͯ
ΧϝϥΛىಈʜ actual:Android͚ͷ࣮ 6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ actual:iOS͚ͷ࣮ ࣮͕ೖ͞ΕΔ ΞϓϦ +BWB4DSJQU ,PUMJO 4XJGU ڮ͠ͷઃఆ +BWB4DSJQU
Xamarinͷ߹ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠) *OUFOUΛ͛ͯ ΧϝϥΛىಈʜ
actual:Android͚ͷ࣮ 6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ actual:iOS͚ͷ࣮ ࣮͕ೖ͞ΕΔ ΞϓϦ $ $ $ $
Kotlin/Native with MPPͷ߹ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠)
*OUFOUΛ͛ͯ ΧϝϥΛىಈʜ actual:Android͚ͷ࣮ 6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ actual:iOS͚ͷ࣮ ࣮͕ೖ͞ΕΔ ΞϓϦ ,PUMJO ,PUMJO ,PUMJO
PFͷAPIϥούͷଘࡏ $BNFSB UBLF1IPUP *NH ڞ௨APIఆٛ(expected:࣮ແ͠) *OUFOUΛ͛ͯ ΧϝϥΛىಈʜ
6**NBHF1JDLFS$POU SPMMFSͰ࣮ʜ ࣮͕ೖ͞ΕΔ ΞϓϦ $ $ $༻ϥού $༻ϥού $ "OESPJE4%, J044%,
ڞ௨APIͷࣗ࡞ͷ͢͠͞ ʙPFͷAPIͷϥούʔ͕ͳ͍߹ʙ 1'ݻ༗"1*Λ͏ʹ,PUMJO4XJGUͰϥΠϒϥϦ Λ࣮͠ɺ91MBUଆͱڮ͢͠Δ͔͠ͳ͍ FlutterͷPlatformChannel, R/NͷNative Modules ͳͲ ❌ʮڮ͠ʯͰτϥϒϧى͖͕ͪ ❌ϥΠϒϥϦͱΞϓϦͰϓϩδΣΫτ͕அ͞ΕΔ
σόοάͮ͠Β͍
ڞ௨APIͷࣗ࡞ͷ͢͠͞ ʙPFͷAPIͷϥούʔ͕͋Δ߹ʙ ⭕KotlinSwiftΛΘͳͯ͘PFͷAPIΛར༻Ͱ͖Δ ⭕ΞϓϦͱಉ͡ϓϩδΣΫτͱͯ͠σόοάͰ͖Δ ❌PF͚ͷϥΠϒϥϦΛ͏ʹʮڮ͠ʯ͢Δ͠ ͔ͳ͍ ❌APIʹஶ࡞ݖ͕͋ΔΜͰ͚ͨͬ͠
ը໘ඳըํࣜͱAPIఏڙํࣜʹΑΔྨ ↑PFʹҕৡ ↓ಠࣗඳը ←PFͷAPIϥού༗ PFͷAPIϥούແˠ Titanium Mobile Air
for Mobile RubyMotion※ Delphi Flutter Xamarin Kotlin/Native※ React Native ※ը໘ఆٛΛڞ௨Խ͢Δػೳͳ͍
Kotlin/Native ͷՄೳੑ
Xamarin(.NET) vs Kotlin/Native(+MPP) ྫ: C#͔ΒActivityΫϥε͕͑ΔɺRuby͔Β UIViewController͕͑Δ ⭕KotlinSwiftΛΘͳͯ͘PFͷAPIΛར༻Ͱ͖Δ ⭕ΞϓϦͱಉ͡ϓϩδΣΫτͱͯ͠σόοάͰ͖Δ ❌PF͚ͷϥΠϒϥϦΛ͏ʹʮڮ͠ʯ͢Δ͔͠ͳ͍ ❌APIʹஶ࡞ݖ͕͋ΔΜͰ͚ͨͬ͠
9BNBSJO ,PUMJO 1'ͷ"1*ϥού ͋Γ ͋Γ ඪ४"1*ɺ Ϋϥεͷ ๛ গͳΊ ରԠ1' αʔόʔαΠυɺ σεΫτοϓ αʔόʔαΠυɺ 8FC ଞݴޠ͔Βͷར༻ ෆՄೳ Մೳ
Kotlin/Native ͕ීٴ͢Δʹ MPPରԠOSS์͓͍ͬͯͯ૿͍͑ͯͩ͘Ζ͏ Ͱඪ४API͕ͬͱ֦ॆ͞Εͯ΄͍͠ ܕ͢Β OSS(klock) ʹཔΔΜ͡Ό… ϞόΠϧ͚ͷڞ௨APIηοτ(Xamarin.EssentialsͷΑ͏ͳ)ཉ͍͠ ྫ: val
photo = camera.takePhoto() ͷ1ߦͰ Android/iOSͲͪΒ ࣸਅࡱӨͰ͖Δతͳ Ͳ͔͜ʹങऩ͞Εͳ͍͜ͱΛفΔ
VS WebΞϓϦ ʙ࠶ߟʂΨϫωΠςΟϒʙ
ΨϫωΠςΟϒΞϓϦͱ ωΠςΟϒΞϓϦ͕ͩɺը໘ʹWebView͔͠ͳ͘ɺͬͺ Βͦͷதʹදࣔͨ͠WebαΠτΛΞϓϦͱͯ͠ݟ͍ͤͯΔ͚ͩ (ʹΨϫ͚ͩωΠςΟϒ)ͳΞϓϦ UIUX͕ωΠςΟϒͱ͔͚Ε͍ͯΔɺಡΈࠐΈ͕සൃ͠ετ ϨεϑϧɺͳͲͷཧ༝ͰسΈݏΘΕ͖ͯͨ ͕ɺPWAͷྗ͕֦େ͢Δͳ͔Ͱݟ͠ඞࢸʢݸਓͷݟղʣ
࠶ߟʂΨϫωΠςΟϒ Α͘Ͱ͖ͨPWAωΠςΟϒΞϓϦʹ͍ۙUXΛఏڙ͢Δ (Twitter, Facebook, GoogleMapsͳͲ) ΨϫωΠςΟϒͷதʹʮΑ͘Ͱ͖ͨPWAʯ͕ຒΊࠐ·Ε͍ͯͨ ΒɺͦΕωΠςΟϒΞϓϦͱൺͯḮ৭ͳ͍ ʮͦΕPWAͰΑ͘ͳ͍ʁʯˠʮηϯαʔ͏ʁͳΒΨϫωΠςΟ ϒͰʯˠʮΞϓϦʹձࣾੜ໋ݒ͚ΔʁͳΒωΠςΟϒͰ͢Ͷʯ ͑ͬͱɺ͡Ό͋
Cordova, Monaca ͳͲͷग़൪Ͱ͔͢ʁ
ΨϫωΠςΟϒͷΨϫͰ͏X-Plat։ൃπʔϧ ͬͺΓ੩తܕ͚ݴޠΛ͍͍ͨ Ώ͘Ώ͘ʮશωΠςΟϒʯʹҠߦ͢Δ͔ PFͷAPIϥού͕͋ΔX-PlatͳΒPFݻ༗ػೳͷ ΞΫηεΑΓ؆୯ WebViewJavaScriptͱͷ࿈ܞඞਢ
ࣄྫ1:Nintendo Switch Online ΞϓϦ Xamarin.FormsʹΑΔΨϫωΠςΟ ϒΞϓϦ ίϯςϯπWebΞϓϦ(ͯͳ) ௨ɺϘΠενϟοτ(WebRTC)ͳ ͲωΠςΟϒ࣮
αϯϓϧ2:ݕࡧγεςϜ(ฐࣾࣄྫ) ͱ͋ΔCRMͷWebϖʔδ WebView “Ψϫ”Xamarin.Forms Χϝϥىಈ ίʔυ: BIJ002A 1.
JavaScript→C#࿈ܞ 2. ڞ௨APIͰΧϝϥىಈɺΛࡱӨ 3. PFͷAPIϥούΛ͍ɺ Android:Tensorflow iOS:CoreML Ͱը૾͔ΒΛݕग़ 4. ίʔυΛC#→JavaScript࿈ܞͰ Webϖʔδʹฦ٫ ݕࡧ
·ͱΊ
·ͱΊ X-Plat։ൃπʔϧඞཁѱ ͲͷπʔϧΦϫίϯͰͳ͍ K/NʹݴޠͷนΛ͑ΒΕΔັྗ͕͋Δ PFͱͦͷݴޠͷϦεϖΫτΛΕͣʹ WebΞϓϦͱྑ͍ͬͯ͘͜͏
͝ਗ਼ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠$