Dart

はじめに Google I/O 2023でDart3のリリースが報告されました。 Dart3でClass Modifierが追加されたので試してみました。 （Class Modifierとは、抽象Classの頭につけているabstractなどです） interfaceクラス // vehicle.dart interface class Vehicle { void drive() { print('drive'); } } このVehicleクラスが定義されたファイルとは別ファイルで使う場合に下記の特長があります。 インスタンス化できる 継承できない implementsできる // car…

サービス開発パートナー事業部 アプリエンジニアチーム 自称Flutterエンジニアの務台です。最近ジムに通い始めました。弊社はフルリモート勤務なので意識して運動していきたいところです。 Flutter開発において、画面遷移にはgo_routerを使うのが主流かと思います。 かくいう私もgo_routerをよく使っていたのですが、 パスパラメータに文字列型しか使えない extraで渡した値がObject?になってしまう のがかなり使いづらいなぁと感じていました。 そこで今更ではありますが、その辺りを解決してくれるgo_router_builderを使ってみました。 バージョン go_router…

サービス開発パートナー事業部 アプリエンジニアチーム 自称Flutterエンジニアの務台です。 弊社が加入している関東ITS健康保険組合では、毎年恒例のディズニーチケット割引券の申し込みがスタートしました。被保険者、被扶養者であれば3000円引きでチケットが買えるので、興味のある方は申し込みをお忘れなく！ 私が今まで経験したプロジェクトでは全てLayerFirstなディレクトリ構成が採用されており、体感では同様のディレクトリ構成を使用している場合が多いのではないかと思います。 しかし、以下の記事で紹介したTodoアプリの作成にあたってはFeatureFirstなディレクトリ構成を使ってみました…

Flutter には SliverAppBar というものがあり、これを使うとヘッダーの AppBar をいい感じに表示することができる。 Twitter iOS アプリのプロフィールページなどのように、PullToRefresh するとヘッダー画像が blur していい感じに表示される、というのも SliverAppBar で簡単に実装できる。 なのだが、ちょっと複雑なことをしようとするとうまくいかず、自力で ScrollController の offset を取得してヘッダー背景がいい感じになるような Widget を作った。やってることは難しくなくてスクロールの offset をみて画…

1月なので何か新しいことでもやってみようかと思い、Flutterでのアプリ開発に足を踏み入れてみることにした。ただしその前に、Flutter開発に必要なDart言語が全くの初見だったので基礎の学習から始めた。Dartの自己学習中に引っかかった部分やDart特有の機能などについて調べた際のメモが結構貯まったので、せっかくなので項目別に整理してまとめることにした。 環境 Dart SDK 2.18.6 使用した参考書 学習メモ Null Safetyについて StringBufferでの文字列の連結 データ型の確認と比較 whereType()とwhere() 複数条件でのMapリストのソート M…

エキサイトの武藤です。 Flutterで多言語対応をする際、基本的にはWidget内でBuildContextからAppLocalizationsを呼び出して利用します。 しかし、複雑なロジックが必要な表示テキストの場合、Viewでそのロジックを書いてしまうとViewのコードが肥大化してしまいます。 その場合、View以外に表示テキストの生成処理を行うようになると思います。 今回は、RiverpodのProviderで表示テキストの生成を行う方法について説明します。 実行環境 l10nを使ったテキストの表示 ロジックを含む表示テキスト l10nを取得するBuildContext を扱うユニット…

ワールドカップの見すぎでflutterを怠っておりましたのでワールドカップも見つつ頑張ります。前のパートでルーレットのアプリを簡単に作りました。 今回はいろいろ改良を加えてみようかなのパートとなります ルーレットの中身を自分で入力しよう 今までAさん～Hさんで分けてきましたが、これを自分で入力できるようにします とりあえず書いてみる main.dart import 'package:flutter/material.dart'; import 'package:myapp1/screens/roulette.dart'; import 'package:myapp1/screens/home…

久々の複数での集まりで嬉しい限りです(^^♪ 夕練にＹ田君参上！ 今回からDART BIKE 660SSで練習開始です。 前後リジットで直接プツシュなどを感じてもらう為に。 サスぺーション付き車両では分かりずらい自転車の挙動や全てのダイレクト感を味わっていただく為にあえての26"シングルMTBで練習です。 プッシュ＝山を越えた後に自転車に圧力を加えて加速する方法。 前輪には腕を、後輪には脚を･･･と圧力を加えて、ペダルを漕がなくとも前に進む事を体で感じる事から始めます。 力の入れ方やタイミングの問題でなかなか上手くは行きませんが、反復練習しながら出来た時の事を忘れずに何度もチャレンジする事によ…

概要 OOPでプログラミングしていく場合、宣言的にUIを構築できるのがメリットの一つかと思われます。 雑なユースケースですが、Userインスタンスが自分だった場合に処理や見た目を変えるなど。 Userインスタンスのid(それかインスタンス)を見て比較するわけですが、プリミティブな型でidを保持するのは少々危険かと思います。 dartはインスタンス同士を比較する By default, == returns true if two objects are the same instance. pub.dev dartではclassのoperatorというメンバをoverrideすることで、独自の…

エキサイトで内定者アルバイトをしている岡島です！ 今回はFreezedパッケージを使っていて、階層(入れ子)構造のJSONデータを扱う時につまづいたので解決した対処法を共有します。 Freezedについて 階層（入れ子）構造になっている JSONの扱い方 まとめ 参考記事 Freezedについて https://pub.dev/packages/freezed Freezedを使うメリットとして、モデルの定義時にコードの実装量が減り、可読性が上がることが挙げられます。 ドキュメントには以下のような機能の実装が例に挙げられていました。 コンストラクタ+プロパティの定義 toString, ope…

スマレジの テックファーム（SES 部門） でWebエンジニアとして働いている やまて（@r_yamate） と申します。 実務では、2023 年 3 月末で SES の派遣先で、テーブルオーダーシステムの機能改修業務の設計などを担当していた業務を終えたところです。 4月からは、スマレジの関連アプリの開発業務を担当しています。触ったことのなかった Flutter での開発で、日々奮闘中です。 はじめに IT 関連の学習について、学習効率を高めることを目的として、月に 1 記事、振り返りのブログ記事を投稿していたのをしれっとストップしていたので、ここ 3 か月をまとめて振り返っておきます。 4 …

どうも、（@daiouoka）です。試験的に投稿します。毎月第四土曜日は面白かった動画やポッドキャストとかのまとめ記事です。 面白かったyoutube 面白かったニコニコ動画 TVer ポッドキャスト その他(画像とか) 面白かったyoutube

エンジニア・プログラマーの学習に約立つコンテンツのセール情報を集めました 1位 現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル ¥27,800 → ¥1,600 94%OFF!! ⭐ ⭐ ⭐ ⭐ （20,561件） 現役シリコンバレーエンジニアが教えるPython入門！応用では、データ解析、データーベース、ネットワーク、暗号化、並列化、テスト、インフラ自動化、キューイングシステム、非同期処理など盛り沢山の内容です！ 2位 【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 初級編 - ¥15,800 → ¥1,500 …

import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; void main() => runApp(MyApp()); class MyApp extends StatefulWidget { const MyApp({super.key}); @override State<MyApp> createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { @override Widget build(Build…

FlutterのInAppWebviewにて非同期に処理するJavaScriptから返り値を取る。 あわせてよみたい ランキング FlutterのInAppWebviewにて非同期に処理するJavaScriptから返り値を取る。 最近は毎日家に帰るとちょっとだけプログラミングをして寝る生活を続けている。複雑な問題なんかに出くわすと頭を悩ましてしまうけど、それを見事解決できるとすごい脳汁が沸くよね。 プログラミングの楽しさってそういう複雑なパズルを解く楽しみと通づるところがあると思う。プロジェクトを進めていくといろんなissueが出てくるのだけど、それを1つ1つネットを調べたりしながら問題解決方…

エンジニア・プログラマーの学習に約立つコンテンツのセール情報を集めました 1位 現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル ¥27,800 → ¥1,600 94%OFF!! ⭐ ⭐ ⭐ ⭐ （20,561件） 現役シリコンバレーエンジニアが教えるPython入門！応用では、データ解析、データーベース、ネットワーク、暗号化、並列化、テスト、インフラ自動化、キューイングシステム、非同期処理など盛り沢山の内容です！ 2位 【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 初級編 - ¥15,800 → ¥1,500 …

こんにちは。今回は、google bardについて初心者エンジニアに向けて、リアルタイムデータベースとプッシュ通知を使ったリアルタイムアプリケーションの開発方法をご紹介します。 まず、google bardとは何なのでしょうか。google bardは、googleが提供するクラウドプラットフォームの一つで、アプリケーションの開発に必要な多数のサービスを提供しています。その中でも、今回使うのはfirebaseというサービスです。 firebaseには、リアルタイムデータベースという機能があります。これは、データベースへの書き込みや削除が発生した場合に、自動的にクライアントアプリケーションにその…

Flutterで作るmisocaクライアント こんにちは、弥生モバイルチームのtijinsです。 公式MisocaアプリはAndroid用、iOS用がありますが、それぞれ別のコードベースで開発されています。 今回はFlutterで開発するとAndroid/iOSの両方で動作するという噂が本当なのか確認してみました。 Flutterで作るmisocaクライアント Flutterについて Dart 画面レイアウト Scaffold レイアウトの基本 Constraintsの動作 LayoutBuilder ConstraintLayout ユーザー入力を受け取るWidget マテリアルデザイン 画…