React Nativeで立ち上がるiOS シミュレーターのOSバージョンを明示的に指定する方法

React Nativeでyarn iosを実行した際に立ち上がるOSのバージョンを指定する方法です。

package.jsonのscriptsにある”ios”の項目に–simulatorオプションをつけ希望のiOSデバイスとOSバージョンを追加します。

"ios": "react-native run-ios --simulator=\"iPhone 11 (14.0)\"",

Xcodeのシミュレータ選択欄と同じように記述します

iOS 14でgl-react-nativeでエラーが出る対策

gl-react-nativeがiOS 14で以下のエラーを出して動かなくなった件に対する対応方法です。

 const supportsWebGL2 = parseFloat(glesVersion.split(/[^\d.]+/g).join(' ')) >= 3.0; 
"expo-gl": "8.4.0",
"expo-gl-cpp": "8.4.0",

yarn.lock中のexpo-glとexpo-gl-cppのバージョンを8.0.0から8.4.0にすることで解決しました。expoのissueをヒントにしました。

React Nativeでスプラッシュ画面でカスタムフォントが適用されない問題

別途用意したフリーフォントをスプラッシュ(起動画面)で使いたかったが、起動時はそもそもフォントがロードされていない状態なので使えないようです。

そのため対策としては、

  • スプラッシュ画像に文字を埋め込む
  • 標準フォントを使う

が必要になってきます。


起動後はもちろん使える

Info.plistに追加後 RNのコンポーネント内で

fontFamily: 'RopaSans-Italic'

のようにスタイルで指定すればOKです。

React Nativeで絶対パス指定がうまくいってないないと実機で動作しなくなる現象に対する対策

絶対パス設定がうまくいっていないと実機で立ち上がらなくなります

Error: Unable to resolve module `components/ImageViewer` from `src/App.tsx`: components/ImageViewer could not be found within the project.

iOSデバイス実機でのエラー

上記のようなエラーが発生して main.jsbundleがビルドされなくなります。

以下の設定でクリアできました。

"baseUrl": "./"

またbabel.configでaliasを設定すると解決しました。

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        extensions: ['.js', '.jsx', '.ts', '.tsx', '.android.js', '.android.tsx', '.ios.js', '.ios.tsx'],
        root: ['./'],
        alias: {
          src: './src',
        },
      },
    ],
  ],
};

上記設置を適用することで 以下のようにsrcからimportできるようになります。

import { ColorButton } from 'src/components/ControlPanel/UI/ColorButton';

XcodeでArchiveできない時の対策

XcodeでiOSアプリをリリースする際に事前にArchiveする必要がありますが、メニューから選択できない状態になっていることがあります。

その際はビルドのターゲットデバイスをiOS Generic DeviceにすることでArchiveできるようになります。

Xcode 12からはAny iOS Device (armv7, arm64)となっています。

Mac OS Xの写真アプリ(Photos)でiPhone内の写真が全く表示されない場合の対策

Macの写真アプリでiPhoneの写真をインポートしようとした際にiPhone内の写真が全く表示されないことがありました。
以下のような状態です。
Photos
またはNo Photosと表示される場合もあります。
No Photos

続きを読む

Apple Musicが便利

最近Apple Musicに契約し直して音楽をたくさん聞くようになりました。
今までは月に何万円かCDやレコードにお金を使っていたのですが、Apple Musicを契約してからはほとんど購入していません。そして、以前物理メディアを大量に買っていた時にこれぐらい音楽を聴いていたかというと実は聞いていなかったのではないかと言う気がしています。
続きを読む

iOSシミュレータのロックとアンロックのショートカットキー

XcodeについてくるiOSシミュレータのロックとアンロック(ホーム画面の表示)するショートカットキーをメモしておきます。
iPhone iPadも同じコマンドで操作できます。

ロック

command + L

アンロック

command + shift + H

メニューバーのHardwareの項目にあるので、こちらをクリックしてもOKです。

Duet DisplayをiPad mini Retina で使ってみた

Duet DisplayというiOSデバイスをDock/Lightningケーブル経由でMacの外部ディスプレイにするアプリを試してみました。

http://www.duetdisplay.com

インストール/使用手順

  1. App StoreからDuet Displayをインストール(1,000円 2014年12月19日現在)
  2. Macにドライバをインストール。リンクをクリックすると自動的にドライバがダウンロードされます。
  3. Macを再起動。
  4. Duet Displayを起動したiOSデバイスをMacに接続

Duet Display起動から出力まで

iPad mini Retina でDuet Displayを起動。
Connect To Mac
続きを読む

Apple StoreでSquareリーダーを購入してみた

Square Reader

Apple Store渋谷でSquareリーダーを買ってきました。

SquareリーダーはiPhoneやiPadでクレジットカード決済ができるようになるサービスSquareのカード読み取りリーダーのことです。
このリーダーで決済した額の3.25%を手数料として差し引いた額を指定の口座に振り込んでもらえます。 続きを読む