はじめまして！Monacaエバンジェリストの生形です。
長い間パブリックベータ版として皆様にご愛顧頂いておりましたMonacaが、
9/12、ついに正式リリースを迎えました！
本日は、正式リリースで追加された新機能のうち、目玉の２機能をご紹介します！
UIフレームワーク Onsen UI
Onsen UIは、シンプルなコードでモバイル用UIを構築することができる、HTML5ベースのUIフレームワークです。
ここでは、基本的な利用方法を解説します。
まず、プロジェクトのプラグイン設定で、Onsen UIを有効にします。
続いて、ページを構成するhtmlファイルにOnsen UIをロードするための記述を追記します。
以上で、Onsen UIを利用するための準備が整いました。
Onsen UIには"ons-"で始まる様々な独自タグが用意されており、それらをhtmlファイルに記述することで、
モバイルアプリライクなリストやボタンなどのコンポーネントを簡単に作ることができます。
今回は、コンポーネントの１つである、タブバーを定義するタグの使い方を見てみましょう。
htmlファイルの構成は以下の通りです。
- index.htmlタブバーを定義
- left.html左側のタブに関連付いたページを定義
- right.html右側のタブに関連付いたページを定義
index.htmlは以下のように定義します。
[index.html]
<body>
<ons-tabbar>
<ons-tabbar-item page="left.html" active="true">
left
</ons-tabbar-item>
<ons-tabbar-item page="right.html">
right
</ons-tabbar-item>
</ons-tabbar>
</body>
<ons-tabbar>タグは、タブバー全体を定義します。
<ons-tabbar-item>タグは、タブバー内の１つ分の項目を定義します。
page属性にはタブ選択時に表示するページのURLを指定します。
また、active属性をtrueに設定することで、タブが選択された状態にすることができます。
今回の例では、初期表示時に左側のタブが選択された状態にしています。
left.htmlとright.htmlはそれぞれ以下のようになっています。
[left.html]
<body>
<h1>ひだり</h1>
</body>
[right.html]
<body>
<h1>みぎ</h1>
</body>
実行すると、以下のような画面になります。
Onsen UIの詳細は、以下のドキュメントをご確認ください。
Onsen UI
チーム開発機能（一部機能は有料プランのみ利用可能）
これまでご要望の多かった、１つのプロジェクトを複数名で開発できるチーム開発機能がMonaca IDEに追加されました。
・開発者としての参加（プロジェクトの編集、チームメンバの管理）
Professional、Business、Enterpriseプランのみ利用可能
・テスターとしての参加（Monacaデバッガーによるテスト、チャット機能）
無料プランを含むすべてのプランで利用可能
チーム開発機能のイメージ
さらに、今回の正式リリースに伴い、Monacaデバッガーが2.0.0にバージョンアップしました。
（9/12時点でAndroid版のみ。iOS版は近日中に配信予定）
新機能として、アプリのスクリーンショットをキャプチャし、IDEにアップロードしてチームで共有することが可能になりました。
チャット画面
これらの機能により、中規模以上のアプリ開発時にチーム内での連携作業をスムーズに行うことができるようになります。
その他の新機能や各種料金プランの詳細が知りたい方は、以下のページをご確認ください。
今後も新機能の第二弾、第三弾が控えております！
パワーアップしたMonacaを、これからもどうぞよろしくお願いいたします。