アプリは左サイドメニューがスライドによって開閉できるようになっている。実装できるか試してみたい。使うことが推奨されている。!以降では、用語を公式ドキュメントと合わせるために、サイドメニューを「ドロワー」、メインの画面を「スクリーン」と書きます。公式のガイドは非常に基本的な内容に留まっており、これだけだと期待しているようなメニューの実装ができない。用意されており、これらを組み合わせれば、以下のようなカスタマイズが可能だ。ドロワーを開くとき一緒にスクリーンもスライドさせるドロワーの幅を調整ドロワーの内容を独自のビューに置き換える最終的には次のようなアプリケーションが作れるようになる予定である。プロジェクトを作成する。dependencies....作られたプロジェクトのディレクトリに移動して、起動できることを確認しておこう。start必要なパッケージのインストール次に、必要なパッケージのインストールをしていく。開発しているので、さらに追加のパッケージも必要だ。提供されているので、最後にこれを追加しよう。@react-navigation/drawer基本的なメニューを作る次に、公式ガイドに従って、基本的なドロワーを実装する。型アノテーションを追加したコードが以下になる。},});とりあえず動くドロワーを実装できた。このままでは思い描いた動作とは程遠い。ドロワーがスクリーンに重なっている(一緒に移動するようにしたい)ドロワーの幅が狭すぎる(もっと広くしたい)ドロワーの内容が固定(登録済みの画面一覧が表示されるだけ)順番に解決していこう。プロパティで変更できる。</Drawer.Navigator>早速動かしてみよう。期待通りに動いているようだ。次はドロワーの幅を広くしたい。ドロワーの幅を調整する今のままだとドロワーの幅が狭すぎるので、もう少し広くしたい。},});これで幅を広げることもできた。次はいよいよ、ドロワーの中身を独自のビューに置き換えよう。ドロワーの中身として表示されるビューを上書きできるが、デフォルトでは以下のようになっている。以下のように書き換えてみよう。...ドロワーに表示されるメニュー項目の間隔と色が変わったのが分かると思う。リファレンスを参考にしてほしい。そもそもやりたかった「ドロワーの中身を独自のビューで置き換え」は実現できない。使って、中身を丸ごと置き換えてやる必要がある。コンポーネントを返す関数を指定する。