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
Monacaでアプリ名の多言語化
Search
Daisuke Kishino
November 28, 2017
Programming
0
740
Monacaでアプリ名の多言語化
Daisuke Kishino
November 28, 2017
Tweet
Share
More Decks by Daisuke Kishino
See All by Daisuke Kishino
Flutterコンテストを開催した話
kishino
1
410
Monaca、WKWebViewに移行しようぜ!
kishino
0
900
Ionicあらまし@okayama-js
kishino
0
1.1k
MonacaアプリをネイティブのUXに近づけるために
kishino
0
880
Sign In with Appleを実装してみた
kishino
0
430
Fluid interfaces for Monaca
kishino
0
240
Vue.jsの特徴
kishino
0
600
Other Decks in Programming
See All in Programming
iOS 26にアップデートすると実機でのHot Reloadができない?
umigishiaoi
0
130
オンコール⼊⾨〜ページャーが鳴る前に、あなたが備えられること〜 / Before The Pager Rings
yktakaha4
0
120
Goで作る、開発・CI環境
sin392
0
240
Advanced Micro Frontends: Multi Version/ Framework Scenarios @WAD 2025, Berlin
manfredsteyer
PRO
0
280
猫と暮らす Google Nest Cam生活🐈 / WebRTC with Google Nest Cam
yutailang0119
0
160
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
540
ISUCON研修おかわり会 講義スライド
arfes0e2b3c
1
450
生成AI時代のコンポーネントライブラリの作り方
touyou
1
240
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
okashoi
1
270
git worktree × Claude Code × MCP ~生成AI時代の並列開発フロー~
hisuzuya
1
590
Hack Claude Code with Claude Code
choplin
4
2.3k
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
5
7.7k
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Navigating Team Friction
lara
187
15k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Typedesign – Prime Four
hannesfritz
42
2.7k
Building Adaptive Systems
keathley
43
2.7k
Visualization
eitanlees
146
16k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Raft: Consensus for Rubyists
vanstee
140
7k
Become a Pro
speakerdeck
PRO
29
5.4k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Transcript
Monacaでアプリ名の多言語化 Monaca UG TOKYO #3 ~年末のLT大会!~ @2017/11/27
2 ピープルソフトウェア株式会社 岸野 大輔 @岡山県 Monaca歴10ヵ月 最近はAngularJSとかVue.jsとかやってます。 好きな言語はSwift 自己紹介
3 多言語化したアプリ • 会津若松の観光アプリ • Monaca+BaaS@rakuza • OnsenUI+Vue.js • 日本語、英語、中国語(簡・繁)、タイ
語の5か国語に対応
4 アプリの多言語化 • サーバー側 • BaaS@rakuzaで対応 • アプリ側 • OnsenUI+Vue.jsで作っているので、vue-i18nで対応
5 アプリ名は? • リリースの1週間前にアプリ名が多言語化されていないことに気が 付く • Cordova・Monacaに何か仕組みがあるだろうと高を括っていた ら、どうやらなさそう・・ どうしよう!!!
6 ネイティブはどうやるんだっけ? • Android 1. resにvalues-enなど、言語ごとのディレクトリを作成 2. strings.xmlを作成し、「app_name」にアプリ名を記述 • iOS
1. XcodeからInfoPlist.stringを作成し、 Localizationをクリックして各言 語をチェックする 2. InfoPlist.stringの「CFBundleDisplayName」にアプリ名を記述 strings.xmlとInfoPlist.stringをコピーすればよいのでは?
7 CordovaのHook機能を使ってみる • Cordovaの各種操作時に処理を挟み込むことができる • プラグイン追加時、プリペア時など • after_prepare(プリペア後)に、strings.xmlとInfoPlist.stringをコ ピーするHookスクリプトを作成
8 Hookスクリプト Android用の スクリプト iOS用のスク リプト プラグインの 定義ファイル Hookスクリプトは Cordova
Pluginとして作 成
9 plugin.xml
10 Hookスクリプト(Android)
11 コピーするリソースファイル Monacaはルート配下に自由に ファイルを配置できないため、 wwwに配置 phonegap buildがこのディレク トリ構成(Androidだけ)なので真 似た
12 project.pbxprojの罠 • Androidはstrings.xmlをコピーするだけでOK! • iOSはコピーするだけだとうまくいかない・・ • iOSはXcodeに認識させるために、リソースファイル(InfoPlist.string) とそのLocalization設定をproject.pbxprojに定義する必要がある •
Xcode使ってると、よくコンフリクトする謎フォーマットのアレです
13 project.pbxprojの構成 PBXFireReference PBXVariantGroup すべてのリソースファイルを表すク ラス。ここにInfoPlist.stringを言語分 だけ設定する。 ※ en.lprojなど、言語ごとのディレ クトリに配置した上で追加する
Localizationされているファイルの グループを表現するクラス。 InfoPlist.stringsというグループ名を 設定する。 ファイルの ObjectIDを参照
14 node-xcode • project.pbxprojをパース・編集できるnode.jsのライブラリ • このライブラリを使って、 PBXFireReferenceとPBXVariantGroupを 設定 iOSもうまくいった!!
15 (TIPS)node-xcodeのインストール • CustomConfigプラグインを使用していればインストール不要…と 思ったが、Monaca標準のCustomConfigプラグイン(2.0.3)だと node-xcodeのバージョンが古い(0.8.x) • 0.9.xでないと、 PBXVariantGroupの編集ができない •
MonacaのCustomConfigプラグインを最新(4.0.2)にしてみるも、なぜ かビルドでコケる… • npm install xcodeを実行して、node_modules以下をまるごとアップ ロードして解決
16 参考 • cordova-plugin-localization-strings (https://github.com/kelvinhokk/cordova-plugin-localization- strings) • node-xcodeの使い方の参考 • .xcodeproj/project.pbxproj
を解読する (https://qiita.com/yokomotod/items/02e395e99bb891d27f67) • project.pbxprojの仕様の参考
17 ソースコード • GitHubにアップしました https://github.com/kishino/cordova-plugin-i18n-app-name