Android用のハイブリッドアプリを構築してみる。。。～画面の向きを固定にする～

はじめに

Androidアプリの実機でテストしていて、
端末を横向きにすると、レイアウト崩れを起こしていることに気づきました。
で、構築しているアプリとしては、縦向き固定でよいと思いますので、
縦向き固定にする方法を記載しておきます。

縦向き固定の設定

プロジェクトフォルダ直下にあるconfig.xmlにpreference設定を追加する

    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="res/icon/android/icon-ldpi.png" />
        <icon density="mdpi" src="res/icon/android/icon-mdpi.png" />
        <icon density="hdpi" src="res/icon/android/icon-hdpi.png" />
        <icon density="xhdpi" src="res/icon/android/icon-xhdpi.png" />
        <icon density="xxhdpi" src="res/icon/android/icon-xxhdpi.png" />
        <preference name="Orientation" value="portrait" />  ←この設定を追加した
    </platform>

※横方向に固定にする場合は、valueの設定をlandscapeにする

実機で確認

まずビルド

npm run build

実機デバッグ

cordova run android --device

実機で確認

端末を横に向けても、縦表示のままです。

まとめ

設定一つで画面表示の向きを固定化できるのは良いですね。
アプリの内容よっては、レスポンシブ対応するより、画面表示の向きを固定化する事で、
開発やテストのコストを抑えられるかと思いますので、方法の一つとしては検討の価値がありますね。

以上