アプリ置き場

アプリ置き場

http://www.moreread.net/

Flutterでグラフ charts_flutter

charts_flutter

dependencies:
  flutter:
    sdk: flutter
  charts_flutter: "^0.11.0"


Flutterで各種グラフを描画できるパッケージ。
便利なんだけど情報が少なくて目的の処理をするのに調べるのが面倒だったので備忘録。

f:id:nazenaninadesico:20210911202745p:plain

コードにコメントでメモ

//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],
            ),
      ),
    ),
  ),
),

Intel NUCのHackintosh化

Xcodeが必要になりそうなので、ほこりをかぶっていたMac mini(2014)を引っ張り出してきた。CPU2コア、メモリ8GB、ストレージはHDDと性能が心もとない。とりあえず分解して、余ってるSSDに換装してみた。

手順はこちらを参考にした。
割と難易度高い……。特殊ねじのドライバーも購入。
換装した結果、幾分きびきび動作するようになったんだけど、CPU性能とメモリ容量(直付け増設不可)が如何ともしがたい。昨今のデバイスiOSシミュレータなどは重そうだし……。
 
ということで、Hackintoshに挑戦してみた。Windows向けのマシンにMacOSいれるやつ。そこそこ高性能なNUC(BOXNUC8I5BEK)を余らせていたのでこいつを使う。CPU4コア、メモリ32GB、ストレージはSSD

 
以下、NUCのHackintosh化の備忘メモ
 
基本的な手順はこちらを参考にした。
 
IntelBluetoothモジュールはこちらで対応できた。
Kextを二つほど指定フォルダに入れて、config.plistを修正するだけ。
WiFiもいけそうだけど対応にクセがありそうなのと使わないので今回はオミット。
 
追加したKextのconfig.plistへの反映は、propertreeを使うことで自動でやってくれる。
 
OpenCoreを使ったMacOSインストール時にUIがロシア語(キリル文字)になってまったく読めなくて焦ったけど、手探りでメニュー弄ったら下記の場所に言語選択があった。(写真は言語変更済み)

 
内臓AudioデバイスHDMIオーディオの対応は面倒そうだったのでパス。必要なときはBluetoothのデバイスを接続する想定。が、Audioデバイスが無い状態で動画を再生するとエラーがでていて不穏だったので(開発ツールが音出したときに落ちたら嫌だ)、とりあえず余ってるUSBオーディオをつないでおいた。USBポートに差すだけで認識するので便利。1000円くらいで売ってる。
 
ということでとりあえず無事に動作して、Xcodeやら iOSシミュレータやらも動作しました。

 

Bluetoothデバイスのバッテリー残量を表示する

昨今はPC回りの機器がワイヤレス化して便利。机がすっきり。マウス、キーボード、ヘッドホン、ゲームパッド、充電もQiなどなど。
ただし、Bluetooth機器は取り込み中(MMOとか…)にバッテリーが切れると困る。Windows上からBluetoothの設定画面で一応バッテリー情報を見れるのだけど、奥まった場所にあり不便。
何かしらバッテリー情報を表示するガジェットがないかと探したけどなぜかなさそう。ならば自分で作るかとBluetoothについて少し勉強した。
 
バッテリー情報の取り方①
Bluetooth Low EnergyのBatteryServiceに対応したデバイスではバッテリー残量を取得できた。
バッテリーサービス
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 Moniterが入っていれば提供APIを叩く感じでガジェットを作った。
Bluetooth Battery Gadget

f:id:nazenaninadesico:20210717085923p:plain

・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に対応。

Apple Wireless Keyboardの「英数」「かな」キーを「半角/全角」キーにしたい

HHKで打つとカタカタ音がして夜中に使うのは忍びないので、ここ数年はApple Wireless Keyboardを使っている。Windowsで使うにあたり、キーの機能をカスタマイズしてくれるツールがこちら。
 
Apple Keyboard Bridge

 

このありがたいフリーソフトのおかげで、Apple Wireless Keyboardの「英数」「かな」キーを「半角/全角」キーとして利用できていた。しかしながら、Windows 10 バージョン 2004 (Windows 10 May 2020 Update)のアップデートのせいで「英数」「かな」キーがApple Keyboard Bridgeで認識されなくなった。IME関連の更新もあったし、たぶんおま環じゃないとは思う……。デフォルトでそれぞれのキーが、IME Off、IME Onとして動作するようになっている。そうじゃなくてトグルする「半角/全角」キーにしたい。
 
仕方がないのでキーフックして「半角/全角」のイベントにすり替えるツールを作ったので置いておきます。 「英数」は0x1A、「かな」は0x16のキーコードが来るようになったみたい。
 
// Apple Keyboard Bridgeバージョンアップされないかなぁ。。
 

 

 

■追記

Apple Keyboard BridgeのコードGithubにあった。。

ありがたく使わせていただきます。修正して使用ちゅう。

github.com