Flutterコードで複数プラットフォームを実行

Flutterコードで複数プラットフォームを実行

この記事では機能コードを紹介するつもりはなく、Flutterに関するYouTubeの共有動画を紹介します。

最終更新 2021/07/10 23:29
沙漠尽头的狼
読了目安 1 分
カテゴリ
Flutter
タグ
Flutter Android Desktop iOS Mac

参考動画:https://www.youtube.com/watch?v=_uOgXpEHNbc

動画付属のソースコード:https://github.com/abuanwar072/Flutter-Responsive-Admin-Panel-or-Dashboard

記事内のスクリーンショットのソースコード(管理人が動画を見ながらコーディングしたもの):https://github.com/dotnet9/FlutterTest/tree/main/src/admin_panel

この記事では機能コードの紹介はしません。興味があれば上記の動画またはソースコードを参照してください。

コード構造

コードファイル数は多いように見えますが、各dartファイルは数十行程度です。パネルは小さなモジュールごとにdartファイルに分割され、最後に組み合わされて表示されます。

まずはMacデスクトップでの表示(Windowsデスクトップも同様):

デスクトップ

Web版(F12を呼び出すと、フロントエンドと同じデバッグが可能)

Web

iOS(iPhone 12 Pro Max シミュレーター)

Android(シミュレーター)

元の動画から一部録画

興味が湧きましたか?記事の冒頭に戻り、動画(またはソースコード)をクリックして学習を始めましょう。

さらに探索

関連読書

その他の記事
同じカテゴリ / 同じタグ 2022/05/09

大前端時代の乱流:最も包括的なFlutter Webを紹介

Flutter Webの安定版リリースから1年以上が経過しました。この1年以上の開発を経て、大前端時代の乱流として、Flutter Webがどのような違いを持つのか、本記事では現在Flutterではあまり包括的に扱われていないWebに関する内容を中心に紹介します。

続きを読む
同じカテゴリ / 同じタグ 2022/05/06

Flutterアプリ開発入門ガイド

クロスプラットフォーム開発がソフトウェアデリバリー市場で急速に普及するにつれ、世界のトップモバイルアプリ開発企業もこの分野に注目しています。

続きを読む