OGPなどのmetaタグの設定OGPやdescriptionを始めとしたmetaタグが設定できるパッケージはいくつかありますが（これとか）、OGPが有効なSNSの多くはWebAssemblyに対応していないので上手く機能しません。なので、index.htmlにmetaタグを直接記述する必要があります。Flutter Web 上のページ毎に異なるmetaタグを設定したい場合は、index.htmlのmetaタグをページに合わせて変える必要があります。方法は多岐に渡りますが、Flutterとは離れる内容なので大まかな一例を書きます。Cloudflare Workers などの...

MediaQuery.of(context)と同じようにpackage_info_plusをPackageInfo.of(context)で呼び出せるようにする方法です。!同じ要領でdevice_info_plusをDeviceInfo.of(context)、battery_plusをBattery.of(context)で呼べるようにも出来ます PackageInfoWidgetの作成import 'package:flutter/material.dart';import 'package:package_info_plus/package_info_plus.d...

Dartの公式に Null Safety の解説ページ は当然あるのですが、Dartの経験者向けの内容ですし、一覧で確認できる記事があっても良いのではと思い書きます。!Null Safety はバージョンアップで書き方の変わる可能性があります。本記事は Dart 2.19.5 で検証しています。 nullを許容する変数の書き方nullが入る可能性のある変数を定義する時は?を付けます。String? str = null;int? integer = null;// ? 付きの変数に何も初期値を入れない場合、自動でnullが入る// なので以下の書き方は上と同じ意味...

弊社のアプリ「敬語翻訳」にChatGPTでお礼文と謝罪文を生成する機能を付けました。敬語翻訳には文章を敬語の種類（尊敬語、謙譲語、丁寧語など）ごとに色分けする機能があるのですが、ChatGPTから文字が出力されるたびに色分け処理をすることで、待ち時間も視覚的に楽しめるようになっていると思います。ちなみに生成後は文字をタップすることで言い回しを変更できます。大まかに以下のような処理を行っています。作りたい文章の要点を利用者に記入していただき、サーバーに送信サーバー側で ChatGPT API に投げるChatGPT API から送られてくる文章をストリーミングでアプリ側...

2021年に公開された1803本のFlutter製アプリを調査しました。その中で、UIやデザイン、設計において開発の参考になりそうな、個人的に素晴らしいと感じたアプリをご紹介します。アプリ内に使用しているOSSライセンスの一覧があり、Flutter製であることが公表されているものだけを掲載しています。また、順番に意味はありません。※ 許可を得ずに勝手に紹介しておりますので、問題がございましたらご連絡ください。 機能の多いUI きょうの献立https://apps.apple.com/jp/app/id1576492917https://play.google.com/...

2020年に公開された1054本のFlutter製アプリを調査しました。その中で、UIやデザイン、設計において開発の参考になりそうな、個人的に素晴らしいと感じたアプリをご紹介します。アプリ内に使用しているOSSライセンスの一覧があり、Flutter製であることが公表されているものだけを掲載しています。また、順番に意味はありません。※ 許可を得ずに勝手に紹介しておりますので、問題がございましたらご連絡ください。!この記事は2021年にnoteに書いたものを再掲しています Google製 Google Onehttps://apps.apple.com/jp/app/...

以下のTextを表示すると、機種によっては日本語と英語で下線がずれて表示されてしまいます。const Text( 'あAいIうUえEおO', style: TextStyle( fontSize: 40, decoration: TextDecoration.underline ),),Flutterのソースコードを読んでみたところ、フォントを指定していない場合、AndroidではRoboto、iOSでは.SF UI Textを設定していました[1]。なので、iOSで試しに「ヒラギノ角ゴ」を指定してみると、正しく下線が引かれるようになりました。co...