💡

.NET MAUI でクロスプラットフォーム対応(予定)のメモアプリ作った

2022/12/06に公開約3,000字

Cache というメモアプリを、C# でクロスプラットフォーム対応のモバイルアプリが作れるフレームワークである Xamarin の後継の .NET MAUI で作ってみたので感想など書きます。

クロスプラットフォーム(大嘘)

スクショ

アプリ起動直後の画面です。メモがずらっと並んでいて1番下にメモの入力欄があります。

入力欄左の Expander を押すとタグ一覧が出てきて、メモにタグをつけることができます。

選択時

画面右上のタグアイコンのところを押すと、タグで表示するメモを絞り込めます。

左スワイプで削除

ごみ箱

ダークテーマはこんな感じです。青っぽい色にしてしまって割と後悔しています。。
好きといえば好きなんですが、ずっと見てると飽きるんですよねー。黒系のテーマに今後変更するかもしれないです。

機能まとめ

現在の主な機能は以下の通りです。

  • メモ作成・削除
  • タグ付与、タグで絞り込み
  • ごみ箱
  • テーマ変更

めちゃくちゃ単純です。Slack とか Discord の自分宛ての DM に雑なメモを書くみたいな感じの使い方を想定しています。
せっかくクロスプラットフォームなのでデータのクラウド同期に対応したいです。
あとマークダウンを使えるようにもしたいです。→ 実装中です。

実装中のマークダウン表示のテスト

ちなみにですが、数年前に同じようなアプリを作っていて、それにタグ機能を付け足したものを .NET MAUI で作ってみたという感じになります(UI は少し変わってますが)。昔のは普通に Kotlin で作ったもので、動作を比べてみると面白い...くはないですね。

使用ライブラリ

CommunityToolkit.Mvvm

変更通知プロパティを自動生成してくれたり、メソッドから ICommand を自動生成してくれるライブラリです。

CommunityToolkit.Maui

通知バーの色変更したり、View の event を Command に変換する Behavior を使うために導入しています。他にどういう機能があるのかは知らないです()

EntityFrameworkCore.Sqlite

.NET での ORM です。メモデータの保存に使ってます。MAUI のプロジェクトで使うにはちょっとコツが必要だったので別の記事で書きたいと思います。

上2つの CommunityToolkit は .NET MAUI でアプリを作るならほぼ必須級だと思います。CommunityToolkit.Mvvm のところは ReactiveProperty もいいかも?

感想

バグ多い

まあ新し目のフレームワークなので仕方ないのかもしれないですがバグが多いです。Android でしか公開していない理由は iOS のデベロッパーライセンスの取得がめんどくさそうだからというのもありますが、主な理由は以下の通りです。

タイトルビューがどう頑張っても上手く表示されないです。お疲れ様でした。
普通に致命的なのでクロスプラットフォーム()になってます。

Android は多分一番マシなんですが、CollectionView が重すぎてスクロールしてるだけでカクつき始めます。この単純なアプリでこの重さだと実用性ないんじゃ・・・という気がします。

Windows は次にまともですが、ハンバーガーメニューを開くとタイトルバーに色がつく謎バグ(?)があります。めちゃくちゃダサいです。
まあ Windows はちょっと修正すればすぐに公開できそうですが、Windows のアプリって今はどう配布するのが正解なんでしょうか...

で最後に Macですが、一見まともに見えますが、メニュー開くとタヒんでます。これはアカン。

ここに書いてない以外にもまだまだバグはあるので、直るのを気長に待つか GitHub で Contribution するしかないです。

(個人的に)昔 Kotlin で作ったときよりは作りやすい

XAML を割と書きなれてるからだと思いますが、Kotlin で頑張ってたときよりは楽しかったです。その他のフレームワークとの比較は、経験がほぼないので比較できないです。
ホットリロードとかはできますよ(適当)

最後に

とりあえず自分的にほしい最低限の機能はできたので公開してみました。
自分的には70%ぐらい満足です。あとは TODO の機能を作りきりたいです。今はマークダウンの表示を頑張って実装しています。

ビビッときた方は使ってくれると嬉しいです。

TODO

  • クロスプラットフォーム対応
  • クラウド同期
  • マークダウン対応
  • バグ修正

Discussion

ログインするとコメントできます