Flutterの習作ということでリタイアシミュレータのモバイル版を製作。少し簡略化してモバイルで操作しやすい感じに。詳細にシミュレーションしたい方はWeb版のほうをご使用ください。
iOS版
Android版Web版（PC向け）
Flutterでグラフ charts_flutter
charts_flutter
dependencies: flutter: sdk: flutter charts_flutter: "^0.11.0"
Flutterで各種グラフを描画できるパッケージ。
便利なんだけど情報が少なくて目的の処理をするのに調べるのが面倒だったので備忘録。
コードにコメントでメモ
//double fontSize; //class GraphData { // int hoge = 0; // int fuga = 0; // GraphData(this.hoge, this.fuga); //} List<charts.Series<GraphData, int>> _serieseData = []; _serieseData.add( charts.Series<GraphData, int>( id: "凡例", data: _graphData, domainFn: (GraphData data, _) => data.hoge, measureFn: (GraphData data, _) => data.fuga, colorFn: (GraphData data, _) => charts.ColorUtil.fromDartColor(Colors.blue),//線の色 ), ); Container( padding: EdgeInsets.all(10), width: 600, height: 400, child: charts.LineChart( _serieseData, animate: true, animationDuration: Duration(milliseconds: 300), //アニメーションの時間 behaviors: [ charts.SeriesLegend( position: charts.BehaviorPosition.top,//凡例の表示位置 desiredMaxColumns: 1,//凡例の並べ方の行数 entryTextStyle: charts.TextStyleSpec(//凡例のテキストスタイル color: charts.ColorUtil.fromDartColor(Colors.white), fontSize: (fontSize).toInt(), ), ), charts.ChartTitle( '横軸タイトル', behaviorPosition: charts.BehaviorPosition.bottom,//横軸なので下に表示 titleOutsideJustification: charts.OutsideJustification.middleDrawArea, titleStyleSpec: charts.TextStyleSpec(//テキストスタイル color: charts.ColorUtil.fromDartColor(Colors.white),//色は変換して使う fontSize: (fontSize).toInt(),//int型を要求される ), ), charts.ChartTitle( '縦軸タイトル', behaviorPosition: charts.BehaviorPosition.start,//縦軸なので左に表示 titleOutsideJustification: charts.OutsideJustification.middleDrawArea, titleStyleSpec: charts.TextStyleSpec(//テキストスタイル color: charts.ColorUtil.fromDartColor(Colors.white), fontSize: (fontSize).toInt(), ), ), ], domainAxis: charts.NumericAxisSpec(//横軸 viewport: charts.NumericExtents(10, 100.0), //横軸の表示範囲を明示する場合 tickProviderSpec: charts.BasicNumericTickProviderSpec( zeroBound: false, //falseにすると軸を0から開始せずに、存在するデータの値の範囲を表示する desiredTickCount: 10,//目盛りを何分割するか desiredなので必ずしもこの値にはならないが考慮してくれる // desiredMinTickCount: 5,//分割の範囲を指定する場合 // desiredMaxTickCount: 10, ), renderSpec: charts.GridlineRendererSpec( labelStyle: charts.TextStyleSpec(//目盛りのテキストスタイル fontSize: (fontSize).round(), color: charts.MaterialPalette.white, ), lineStyle: charts.LineStyleSpec(//目盛り線の設定 color: charts.ColorUtil.fromDartColor(Colors.grey), dashPattern: [4, 4],//点線（実線と隙間のサイズを指定する） ), ), ), primaryMeasureAxis: charts.NumericAxisSpec(//縦軸 tickProviderSpec: charts.BasicNumericTickProviderSpec( zeroBound: true, desiredTickCount: 10, // desiredMinTickCount: 5, // desiredMaxTickCount: 10, ), renderSpec: charts.GridlineRendererSpec( labelStyle: charts.TextStyleSpec( fontSize: (fontSize).round(), color: charts.MaterialPalette.white, ), lineStyle: charts.LineStyleSpec( color: charts.ColorUtil.fromDartColor(Colors.grey) //dashPattern: [4, 4], ), ), ), ), ),
Flutter webの設置方法
Flutter 備忘メモ
flutter build web
で生成されたブツをサーバーに設置したけど動かない。
ルート以外に置く場合は、パスを指定しないといけないぽい。
index.html
<base href="/hoge/hige/hage/">
Intel NUCのHackintosh化
Xcodeが必要になりそうなので、ほこりをかぶっていたMac mini(2014)を引っ張り出してきた。CPU2コア、メモリ8GB、ストレージはHDDと性能が心もとない。とりあえず分解して、余ってるSSDに換装してみた。
手順はこちらを参考にした。
割と難易度高い……。特殊ねじのドライバーも購入。
ということで、Hackintoshに挑戦してみた。Windows向けのマシンにMacOSいれるやつ。そこそこ高性能なNUC(BOXNUC8I5BEK)を余らせていたのでこいつを使う。CPU4コア、メモリ32GB、ストレージはSSD。
以下、NUCのHackintosh化の備忘メモ
基本的な手順はこちらを参考にした。
Kextを二つほど指定フォルダに入れて、config.plistを修正するだけ。
WiFiもいけそうだけど対応にクセがありそうなのと使わないので今回はオミット。
追加したKextのconfig.plistへの反映は、propertreeを使うことで自動でやってくれる。
内臓AudioデバイスとHDMIオーディオの対応は面倒そうだったのでパス。必要なときはBluetoothのデバイスを接続する想定。が、Audioデバイスが無い状態で動画を再生するとエラーがでていて不穏だったので（開発ツールが音出したときに落ちたら嫌だ）、とりあえず余ってるUSBオーディオをつないでおいた。USBポートに差すだけで認識するので便利。1000円くらいで売ってる。
Bluetoothデバイスのバッテリー残量を表示する
昨今はPC回りの機器がワイヤレス化して便利。机がすっきり。マウス、キーボード、ヘッドホン、ゲームパッド、充電もQiなどなど。
何かしらバッテリー情報を表示するガジェットがないかと探したけどなぜかなさそう。ならば自分で作るかとBluetoothについて少し勉強した。
バッテリー情報の取り方①
バッテリーサービス0000180f-0000-1000-8000-00805f9b34fbバッテリー情報キャラクタリスティック00002a19-0000-1000-8000-00805f9b34fb
バッテリー情報の取り方②
昔ながらのBluetoothClassicではハンズフリープロファイル(HFP)に対応していればそれに従ってバッテリー情報がとれる。RFCOMMというプロトコルでシリアル通信すればいい。HFPはプロトコルスタック的にはこのRFCOMMの上にのっかっている。
ヘッドセット(HFP)0000111e-0000-1000-8000-00805f9b34fb
※詳細な技術情報は上記のUUIDやら単語でググったりGitHUB検索すればいろいろ出るはず
しかし①はBLEのBatteryServiceに対応したデバイスは少なく、ほとんどの機器のバッテリー情報が取れない。またWindowsPCと接続をとりあっているのかすぐ接続が切れる。更新通知設定は動作しなかった(使ったデバイスが悪いだけの可能性もあるけど)。まぁ毎度接続しなおせばバッテリー情報は一応とれる。
②はそもそもヘッドホンとしてWindowsで接続中なので、ソケット横取りしてバッテリー情報を取ることはできない（多分）。ペアリングしたあと、手動で切断した状態ならシリアル通信できた。ドライバの層でやらないとダメそう。
バッテリー情報を取得するソフトないなぁと思ったけど、これらが理由かな。
でも色々調べまわってたらBluetooth Battery Monitorなるものを発見した。
おそらくドライバレベルで対応している。そして素晴らしいことにバッテリー情報を取得するAPIが提供されていた。でも、ガジェットとして常時表示できないのと、見た目が好みじゃなかった。。
Bluetooth Battery Gadget
・2022/03/09 追記
Windows11でウィンドウが角丸になるので、角丸にしないオプションを追加。ただし影もなくなります。
C#でAnimated WebPのディレイを取る
Webpの画像はWin10ならWIC経由で取得可能だったけど、各フレームのディレイの取得方法がわからなかったので自作。
下記のWebPのファイルフォーマットを参照した。
developers.google.com
List<int> delay = new List<int>(); byte[] buff = new byte[stream.Length]; stream.Read(buff, 0, buff.Length); // WEBP if (System.Text.Encoding.ASCII.GetString(buff, 0, 4).Equals("RIFF")) { for (int i = 12; i < buff.Length - 8; i += 8) { string chname = System.Text.Encoding.ASCII.GetString(buff, i, 4); int chsize = BitConverter.ToInt32(buff, i + 4); if (chname.Equals("ANMF")) { int offset = i + 8 + 12; byte[] dbuff = { buff[offset], buff[offset + 1], buff[offset + 2], 0 }; delay.Add(BitConverter.ToInt32(dbuff, 0)); } i += chsize; } } return delay.ToArray();
これで自分用ツールのビューワをAnimatedWebPに対応。
