文系プログラマー「いお」が語る

主にプログラミング関連の記事を書いています。

【Flutter×Firebase】【個人開発】レシートと収支の管理ができるスマホアプリを開発・リリースしました。

こんにちは。今回は個人開発アプリの紹介記事となります。ぜひダウンロードして使ってみてください! 開発したアプリ 開発環境 開発期間 開発の経緯 アプリの紹介 概要 機能 苦労したこと おわりに 開発したアプリ アプリ名:【レシート保存&収支管理「レシ…

【Flutter】ローディングのぐるぐるサンプル【コピペOK!】

今回は、アプリで処理を待つ間に表示されるローディングのあのぐるぐるを実装するサンプルです。関数を作ってあるのでメソッドをコピペして呼び出してもらえればすぐに実装できます! この記事で分かること ✅ローディングのぐるぐるの実装方法 目次 サンプル…

【Flutter】画面の下部によくあるナビゲーションバー(BottomNavigationBar)を実装するサンプル

今回は画面の下部にあるナビゲーションバーの実装方法サンプルです。 この記事で分かること ✅BottomNavigationBarの実装方法✅BottomNavigationBarの主なプロパティについて 目次 サンプル画面 サンプルコード 解説&実装手順 ①ナビゲーションバーがタップさ…

【Flutter初心者用】【コピペOK!】TextFieldに入力した値を取得しボタン押下で画面に表示するサンプルコード

今回はTextFieldに入力した値を取得しボタン押下で画面に表示する、という動きのサンプルとなっています。ユーザーの入力値の受け取りやボタン押下で動きを持たせるなど、Flutterアプリ開発の基本のきの部分についての記事です。 この記事で分かること ✅Text…

【Flutterで状態管理】StatelessWidgetとStatefulWidgetの違いと使い分け、InheritedWidgetについて(サンプルコードつき)

今回は、Flutterアプリの状態管理で大事なStatelessWidgetとStatefulWidgetの違いと使い分け、加えてInheritedWidgetについてまとめます。 この記事で分かること ✅StatelessWidgetとStatefulWidgetって何?✅StatelessWidgetとStatefulWidgetの違いと使い分け…

【Flutter】【エラー対応】「range out of order in character class[***]」が発生する原因と対処法

今回はFlutterアプリ開発時に遭遇することのある「range out of order in character class[***]」というエラーについて原因と対処法を解説します。(***には英数字や記号等が入る) この記事で分かること ✅「range out of order in character class ~」が発…

【Flutter】【コピペでOK!】TextFieldに入力する文字を「数字のみ」や「英数字と記号のみ」のように制限する方法(サンプルつき)

今回はTextFieldに入力する文字を制限する方法についてです。いくつか例を用いて説明します。そのままコピペでOKです! この記事で分かること ✅TextFieldに入力する値を制限する方法 目次 ①数字のみにしたい場合 ②英数字と記号のみにしたい場合 ③数字とハイ…

【FlutterWeb】【AndroidStudio】LAN内の別デバイスでデバッグするための設定と実行方法について

FlutterでWebアプリ開発のデバッグ実行時、開発機以外のデバイス(別のPCやタブレット、スマホなどの実機)で動かしたいときがあると思います。 そこで今回はLAN内の開発機以外のデバイスでデバッグ実行するためのAndroidStudioの設定と実行方法をまとめまし…

プログラミング未経験のスキルなし文系でも安定したIT企業にエンジニアとして就職し手に職をつけることができます

「プログラミング未経験だからIT企業に就職できるか不安…」 「文系でスキルもないし難しそう…」 「自信もお金もない…!」 それどころか、 正社員経験もなければ、アルバイトすら長く続いた試しがない… そんな私が、 ✅ワークライフバランスがしっかり整ってい…

【Flutter】【エラー対応】「A RenderFlex overflowed by pixels on the bottom」または「BOTTOM OVERFLOWED BY PIXELS」が発生する原因と対処法

今回はFlutterアプリ開発時に遭遇することのある「A RenderFlex overflowed by * pixels on the bottom」または「BOTTOM OVERFLOWED BY * PIXELS」(どちらも同じ意味)というエラーについて原因と対処法を解説します。(*には数字が入る) この記事で分かる…

【Flutter】【1分で分かる】SingleChildScrollViewとは?基本の使い方【サンプルコード付き】

今回はFlutterのSingleChildScrollViewウィジェットについてです。 この記事で分かること ✅「SingleChildScrollView」ウィジェットって何?✅「SingleChildScrollView」ウィジェットの基本的な使い方✅「SingleChildScrollView」ウィジェットのプロパティとメ…

【Flutter】【1分で分かる】ListTileの基本の使い方を解説【サンプルコード付き】

今回はListViewなどでよく使われる「ListTile」ウィジェットについてです。 この記事で分かること ✅「ListTile」ウィジェットって何?✅「ListTile」ウィジェットの基本的な使い方✅「ListTile」ウィジェットの主なプロパティとメソッドについて 目次 「ListTi…

【Flutter】【1分で分かる】ListViewウィジェットの基本的な使い方【サンプル】

今回はFlutterでよく使う「ListView」ウィジェットについてです。 この記事で分かること ✅「ListView」ウィジェットって何?✅「ListView」ウィジェットの基本的な使い方✅「ListView」ウィジェットの主なプロパティとメソッドについて 目次 「ListView」ウィ…

【Flutter】【1分で分かる】Textウィジェットの基本的な使い方【サンプル】

今回はFlutterでよく使う「Text」ウィジェットについてです。 この記事で分かること ✅「Text」ウィジェットって何?✅「Text」ウィジェットの基本的な使い方✅「Text」ウィジェットの主なプロパティとメソッドについて 目次 「Text」ウィジェットとは 具体例 …

【Flutter初心者用】Widget(ウィジェット)とは何か?

こんにちは!文系プログラマーいおです! 今回はFlutterアプリのWidgetについてまとめました。 Widgetとは? サンプル サンプルコード(main.dart) サンプルコードのWidget構成 おわりに Widgetとは? Flutterアプリの画面UIを構築するための部品のことを「…

【レビュー】【Flutter入門書】「基礎から学ぶFlutter」本を読んでみました【おすすめ】

こんにちは!文系プログラマーいおです! 「基礎から学ぶFlutter」という本を読んでみたのですが、この本はFlutter初心者がFlutterの全体像をつかむためにとても最適な良書だと感じたので共有しておこうと思います。 読んだ本 こんな人におすすめ! ✅Flutter…

【Flutter初心者用】【コピペでOK!】カウントダウンタイマーを作ってみる

こんにちは!文系プログラマーいおです! 今回はFlutterアプリでカウントダウンタイマーを作る方法を具体的なコード例を用いてわかりやすく解説します。 サンプル画面 サンプルコード全文 main.dart 実装手順 ①カウントダウン用の変数を定義 ②Timer.periodic…

【まとめ】Windows環境でFlutterとFirebaseの連携をする

こんにちは!文系プログラマーいおです! 今回はWindowsでFlutterとFirebaseを使ってアプリを開発する環境を構築するための手順をまとめようと思います。 はじめに ①Firebaseにプロジェクトを追加する 1.Firabaseのサイトにログイン 2.プロジェクトの命名 3.…

Windows11にGitをインストールする

Git

こんにちは!文系プログラマーいおです! 今回はWindows11環境にGitをインストールする方法についてです。 そもそもGitとは インストール手順 インストールの確認 おわりに そもそもGitとは Gitは、複数の人が同じファイルを編集する際に、誰がいつどのよう…

Windows11にNode.jsをインストールする

こんにちは!文系プログラマーいおです! 今回はNode.jsをインストールする方法についてです。 そもそもNode.jsとは? インストール環境 インストール手順 インストールの確認 おわりに そもそもNode.jsとは? まずはじめにNode.jsの概要についておさらい。N…

【Flutter初心者用】【コピペでOK!】QRコードの生成サンプル

こんにちは!文系プログラマーいおです! 今回はFlutterでQRコードを生成して表示するサンプルです。 サンプル画面 サンプルコード全文 実装手順 ①qr_flutterのインストール ②qr_flutterのインポート ③QRコード化するURLを格納した変数を定義 ④QrImage()でQR…

【Flutter初心者用】【コピペでOK!】ドラムロールで日付選択&入力サンプル

こんにちは!文系プログラマーいおです! 今回はFlutterで日付をドラムロールで選択し、画面に表示しているテキストの値を、選択した日付に変更する方法をまとめました。 サンプル画面 サンプルコード全文 実装手順 ①DatetimePickerのインストール ②Datetime…

【Flutter初心者向け】MaterialAppとScaffoldとは??サンプルアプリをもとに分かりやすく解説

こんにちは!文系プログラマーいおです! Flutterアプリをいざ作ろう!!と思ったときにまずぶつかる疑問、 「MaterialApp」「Scaffold」て何者?? ということで今回は「MaterialApp」「Scaffold」の役割と使い方について、Flutterプロジェクトを立ち上げた…

【Flutter初心者用】画像を表示させる方法をシンプルにわかりやすく解説

こんにちは!文系プログラマーのいおです! 今回はFlutterのアプリ内に画像を表示させる方法についてわかりやすく記事にまとめてみようと思います。 画像表示手順 ①画像ファイルを置くためのフォルダ作成 ②①に画像ファイルを置く ③pubspec.yamlの編集 pubspe…

【Visual Studio】【Xamarin】「.NETによるモバイルアプリ開発」ワークロードがない!どうすればいい?【2023年6月現在】

こんにちは!文系プログラマーのいおです! Visual StudioでXamarinを使ってアプリ開発をすることになりました。そこでやり方をネットで調べたところ「.NETによるモバイルアプリ開発」をインストールする必要があるらしく、Visual Studioのインストーラを見…

【Flutter初心者】【Windowsデスクトップアプリ開発】FlutterでWindowsデスクトップアプリを作ってみよう!

こんにちは!文系プログラマーのいおです! 今回はFlutterでWindowsデスクトップアプリを作るために必要な環境構築作業についての記事を書こうと思います。 はじめに Visual Studioで「C++によるデスクトップ開発」のインストール 1. Visual Studioの導入 2.…

【Flutter初心者用】画面の値を変化させるsetState()の基本をシンプルにわかりやすく解説

こんにちは!文系プログラマーのいおです! 今回はFlutterのsetState()メソッドについて、Flutterプロジェクトを立ち上げたときのデフォルトのサンプルプログラムを用いて説明する記事を書こうと思います。 はじめに 値を変化させるsetState() setState()に…

【Flutter初心者用】画面間のデータの渡し方をシンプルにわかりやすく解説

こんにちは!文系プログラマーのいおです! 今回はFlutterでの画面遷移時に、前画面から次の画面へデータを受け渡す方法について具体的なプログラム例を用いて解説します。 はじめに データの渡し方 コンストラクタとは 具体的なプログラム例 First Page 実…

【Flutter初心者用】画面遷移(pop)時におこる謎の黒い画面の正体について

こんにちは!文系プログラマーのいおです! Flutterで画面遷移のプログラムを組んでいて、 エミュレーターでテスト中、 「戻る」ボタンを押下。 あれ、、、、 なんか真っ黒な画面が出て画面が動かなくなった…なにこのブラックアウト… このような状態になった…

【Flutter初心者用】【スマホアプリ開発】画面遷移の実装方法についてシンプルにわかりやすく解説します

こんにちは!文系プログラマーのいおです! 今回は、Flutterでアプリ開発をする際にほぼ必ずと言っていいほど必要になってくる、基本的な画面遷移の方法についてを具体的なプログラム例を示しつつ説明していこうと思います。 Flutterにおける画面遷移の基本…