flutter-adding-home-screen-widgets は何をしますか?
FlutterアプリにAndroidおよびiOS向けのホーム画面ウィジェットを追加します。アプリの情報をひと目で確認できるようにしたり、ホーム画面からクイックアクションを提供したい場合に使用します。
概要
ホーム画面ウィジェットは、アプリの機能や情報をホーム画面に直接表示する小さなビューです。このスキルでは、home_widget パッケージを使用して、Flutterアプリにウィジェットを追加します。
対応プラットフォーム
- Android (App Widgets)
- iOS (Widget Extension, iOS 14+)
使用方法
- パッケージの追加
dependencies:
home_widget: ^0.9.0
- Androidの設定
android/app/src/main/res/xml/home_widget_provider_info.xml を作成し、以下を記述します:
<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
android:minWidth="250dp"
android:minHeight="40dp"
android:updatePeriodMillis="1800000"
android:initialLayout="@layout/home_widget_layout"
android:resizeMode="horizontal|vertical"
android:widgetCategory="home_screen" />
- iOSの設定
XcodeでWidget Extensionを追加し、Info.plist に適切なエントリーを設定します。
- ウィジェットのビルド
import 'package:home_widget/home_widget.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () async {
// ウィジェットのデータを更新
await HomeWidget.saveWidgetData('title', 'Hello from Flutter!');
await HomeWidget.updateWidget(
iOSName: 'MyWidget',
androidName: 'MyWidgetProvider',
);
},
child: Text('ウィジェットを更新'),
),
),
),
);
}
}
- ウィジェットのUI
home_widget はFlutterウィジェットとしてUIをレンダリングしないため、代わりにネイティブのUI定義を使用します。AndroidではXMLレイアウト、iOSではSwiftUIを使用します。
注意点
- ウィジェットはアプリとは別のプロセスで動作するため、データの受け渡しには注意が必要です。
- iOSの場合、Widget Extensionは独立したターゲットとして追加する必要があります。
- 更新頻度はプラットフォームの制限に従います(特にiOSでは頻繁な更新は推奨されません)。