Hexabase(ヘキサベース)は企業向けのBaaS(Backend as a Service)を提供しています。認証やデータストア、ファイルストレージ、リアルタイム通知などの機能があり、企業向けのシステム開発に必要な機能をまるっと提供しています。
APIはREST APIとGraphQLを提供しています。そのAPIをラップしたSDKも開発を進めています。SDKは現在、TypeScriptとDart向けに開発しています。Dart向けのSDKは、もちろんFlutterでも利用できます。
この記事ではFlutter SDKを使って作成したサンプルアプリ、写真メモアプリを紹介します。
デモとコード
デモとコードはZapp!にて確認できます。デモデータなので自由に変更してもらって大丈夫です。
パッケージとソースコード
パッケージはpub.devで公開しています。
ソースコードはGitHubにて公開しています。ライセンスはMIT Licenseです。
hexabase/hexabase-dart: Hexabase SDK for Dart & Flutter
インストール
インストールは dart pub get
で行えます。
dart pub get hexabase
インポート
SDKをインポートします。
import 'package:hexabase/hexabase.dart';
初期化
まずインスタンスを作成します。
var client = Hexabase();
別なファイルで再度インポートした場合には、以下でインスタンスを取得してください。
var client = Hexabase.instance;
写真メモアプリでHexabaseを利用している部分について
写真メモアプリは大きく分けて、Hexabaseで以下の機能を使っています。
- 認証
- データの新規作成
- データの検索
- データに紐付く写真のアップロード
- データに紐付く写真のダウンロード
認証
Hexabaseを利用する際にはユーザー認証が必要です。今回はあらかじめデモアカウント情報を入れてありますが、以下のコードで認証できます。
void _checkLogin() async {
final client = Hexabase.instance;
final bol = await client.isLogin();
setState(() {
isLogin = bol;
});
}
データの新規作成・編集
今回はデータ作成で写真に関するメモ入力とファイルアップロードを行います。メモは入力された時点でデータストアのデータに反映しています。
以下のようにメモ欄をテキストフィールドに表示しています。 getAsString
ではデータストアにあるデータを文字列型で取得します。万一フィールドがない、またはNullだった場合に備えて defaultValue でデフォルト値を指定できます。
新しい入力値は set
メソッドで適用できます。
TextFormField(
initialValue: widget.item.getAsString('note', defaultValue: ""),
decoration: const InputDecoration(hintText: "Note"),
maxLines: 5,
onChanged: (String value) {
widget.item.set('note', value); // 入力値をデータストアにセット
},
),
写真アップロード
Hexabaseではデータストアのデータに紐付ける形でファイルをアップロードできます。データはバイト配列(Unit8List)で指定します。
// 画像選択時の処理
Future<void> _pickImage() async {
// 複数選択可能
final images = await _picker.pickMultiImage();
// リセット
widget.item.set('photo', []);
// 選択した画像数を反映
setState(() {
_count = images.length;
});
// 写真の選択していなければここで終わり
if (images.isEmpty) return;
for (var image in images) {
// 画像データの読み込み
final bytes = await image.readAsBytes();
// HexabaseFileオブジェクトの作成
final photo = HexabaseFile(
name: image.name,
contentType: image.mimeType ?? 'application/octet-stream');
photo.data = bytes;
// データストアにセット
widget.item.add('photo', photo);
}
}
写真をセットしたら、後は save
メソッドにてメモ欄とともに保存されます。
// データストアへの保存・更新処理
Future<void> _save() async {
widget.item.isNotifyToSender = true;
// データストアに保存
await widget.item.save();
// 前の画面に戻る
Navigator.of(context).pop(widget.item);
}
写真データのダウンロード
写真データをダウンロードする際には download
メソッドを使います。返却値はバイト文字列(Unit8List)になります。
// 写真データ(1件)を取得
Future<void> _getImage() async {
// 詳細データを取得
await widget.item.getDetail();
// 写真データを取得(Nullの可能性がある)
final photos = await widget.item.get('photo');
// 写真データがなければ終了
if (photos == null || photos.isEmpty) return;
if (photos.first == null) return;
// 写真の実データを取得
final image = await photos.first.download() as Uint8List?;
setState(() {
_count = photos.length; // 全写真の数
_image = image; // 写真の実データ
});
}
データの検索
データの取得は items
メソッドを使います。今回は検索条件として、直近7日間のデータとしています。他にも検索条件を用意していますので、SDKドキュメントを参照してください。
// 登録されている写真メモを取得する
void _getMemos() async {
final client = Hexabase.instance;
// データストアの設定
_datastore = client.project(id: projectId).datastore(id: datastoreId);
// 7日前のデータまでに限定
var date = DateTime.now().subtract(const Duration(days: 7));
var query = _datastore!.query();
query.greaterThanOrEqualTo('created_at', date);
// データの取得
final items = await _datastore!.items(query: query);
// ステートを更新
setState(() {
_memos = items;
});
}
まとめ
執筆時点(2022年11月)でのHexabase Dart/Flutter SDKでは、認証とデータストアのCRUD操作、そしてファイルアップロード/ダウンロードに対応しています。
Hexabaseでは他にもリアルタイム通信や細かなロール管理など多くの機能があります。ぜひそうした機能を使って、あなたのアプリケーション開発を高速に行ってください。