Hexabase Dart/Flutter SDKを使ったサンプルアプリの紹介（写真メモアプリ）

[Hexabase（ヘキサベース）](https://www.hexabase.com/)は企業向けのBaaS（Backend as a Service）を提供しています。認証やデータストア、ファイルストレージ、リアルタイム通知などの機能があり、企業向けのシステム開発に必要な機能をまるっと提供しています。

APIはREST APIとGraphQLを提供しています。そのAPIをラップしたSDKも開発を進めています。SDKは現在、TypeScriptとDart向けに開発しています。Dart向けのSDKは、もちろんFlutterでも利用できます。

この記事ではFlutter SDKを使って作成したサンプルアプリ、写真メモアプリを紹介します。

## デモとコード

デモとコードは[Zapp!](https://zapp.run/edit/flutter-ze0062ke106?entry=lib%2Fmain.dart&file=lib%2Fmain.dart)にて確認できます。デモデータなので自由に変更してもらって大丈夫です。

## パッケージとソースコード

パッケージはpub.devで公開しています。

[hexabase | Flutter Package](https://pub.dev/packages/hexabase)

ソースコードはGitHubにて公開しています。ライセンスはMIT Licenseです。

[hexabase/hexabase-dart: Hexabase SDK for Dart & Flutter](https://github.com/hexabase/hexabase-dart)

## インストール

インストールは `dart pub get` で行えます。

```
dart pub get hexabase
```

## インポート

SDKをインポートします。

```dart
import 'package:hexabase/hexabase.dart';
```

## 初期化

まずインスタンスを作成します。

```dart
var client = Hexabase();
```

別なファイルで再度インポートした場合には、以下でインスタンスを取得してください。

```dart
var client = Hexabase.instance;
```

## 写真メモアプリでHexabaseを利用している部分について

写真メモアプリは大きく分けて、Hexabaseで以下の機能を使っています。

- 認証
- データの新規作成
- データの検索
- データに紐付く写真のアップロード
- データに紐付く写真のダウンロード

### 認証

Hexabaseを利用する際にはユーザー認証が必要です。今回はあらかじめデモアカウント情報を入れてありますが、以下のコードで認証できます。

```dart
void _checkLogin() async {
	final client = Hexabase.instance;
	final bol = await client.isLogin();
	setState(() {
		isLogin = bol;
	});
}
```

### データの新規作成・編集

今回はデータ作成で写真に関するメモ入力とファイルアップロードを行います。メモは入力された時点でデータストアのデータに反映しています。

以下のようにメモ欄をテキストフィールドに表示しています。 `getAsString` ではデータストアにあるデータを文字列型で取得します。万一フィールドがない、またはNullだった場合に備えて defaultValue でデフォルト値を指定できます。

新しい入力値は `set` メソッドで適用できます。

```dart
TextFormField(
	initialValue: widget.item.getAsString('note', defaultValue: ""),
	decoration: const InputDecoration(hintText: "Note"),
	maxLines: 5,
	onChanged: (String value) {
		widget.item.set('note', value); // 入力値をデータストアにセット
	},
),
```

### 写真アップロード

Hexabaseではデータストアのデータに紐付ける形でファイルをアップロードできます。データはバイト配列（Unit8List）で指定します。

```dart
// 画像選択時の処理
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` メソッドにてメモ欄とともに保存されます。

```dart
// データストアへの保存・更新処理
Future<void> _save() async {
	widget.item.isNotifyToSender = true;
	// データストアに保存
	await widget.item.save();
	// 前の画面に戻る
	Navigator.of(context).pop(widget.item);
}
```

#### 写真データのダウンロード

写真データをダウンロードする際には `download` メソッドを使います。返却値はバイト文字列（Unit8List）になります。

```dart
// 写真データ（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ドキュメント](https://hexabase.github.io/hexabase-dart-sdk-docs/docs/SDK/Datastore#search-datastore)を参照してください。

```dart
// 登録されている写真メモを取得する
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では他にもリアルタイム通信や細かなロール管理など多くの機能があります。ぜひそうした機能を使って、あなたのアプリケーション開発を高速に行ってください。

[株式会社 Hexabaseー法人向けクラウドシステム『Hexabase』ー](https://www.hexabase.com/)