feat(app): add some different UIs to choose from

ueman · Jun 28, 2024 · b39f286 · b39f286
1 parent 3337adf
commit b39f286
Show file tree

Hide file tree

Showing 4 changed files with 135 additions and 22 deletions.
diff --git a/app/lib/home_page.dart b/app/lib/home_page.dart
@@ -4,8 +4,9 @@ import 'package:app/import_pass/pick_pass.dart';
 import 'package:app/pass_backside/pass_backside_page.dart';
 import 'package:app/router.dart';
 import 'package:app/widgets/app_icon.dart';
+import 'package:app/widgets/pass_list_tile.dart';
 import 'package:desktop_drop/desktop_drop.dart';
-import 'package:drift/drift.dart';
+import 'package:drift/drift.dart' as drift;
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 import 'package:passkit/passkit.dart';
@@ -21,6 +22,8 @@ class HomePage extends StatefulWidget {
 class _HomePageState extends State<HomePage> {
   List<PkPass> passes = [];
 
+  PassView passView = PassView.compact;
+
   @override
   void initState() {
     super.initState();
@@ -71,30 +74,106 @@ class _HomePageState extends State<HomePage> {
             ),
           ],
         ),
-        body: passes.isEmpty
-            ? const Center(child: Text('No passes'))
-            : RefreshIndicator(
-                onRefresh: () => loadPasses(),
-                child: ListView.builder(
-                  itemCount: passes.length,
-                  itemBuilder: (context, index) {
-                    final pass = passes[index];
-                    return Padding(
-                      padding: const EdgeInsets.all(16.0),
-                      child: InkWell(
-                        child: PkPassWidget(pass: pass),
-                        onTap: () {
-                          router.push(
-                            '/backside',
-                            extra: PassBackSidePageArgs(pass, true),
-                          );
+        body: Column(
+          children: [
+            ViewChooser(
+              selected: passView,
+              onViewChanged: (newViewSelection) {
+                setState(() {
+                  passView = newViewSelection;
+                });
+              },
+            ),
+            passes.isEmpty
+                ? const Center(child: Text('No passes'))
+                : Expanded(
+                    child: RefreshIndicator(
+                      onRefresh: () => loadPasses(),
+                      child: ListView.builder(
+                        padding: const EdgeInsets.fromLTRB(0, 50, 0, 0),
+                        itemCount: passes.length,
+                        itemBuilder: (context, index) {
+                          final pass = passes[index];
+                          if (passView == PassView.compact) {
+                            return PassListTile(
+                              pass: pass,
+                              onTap: () {
+                                router.push(
+                                  '/backside',
+                                  extra: PassBackSidePageArgs(pass, true),
+                                );
+                              },
+                            );
+                          } else {
+                            return Padding(
+                              padding: const EdgeInsets.all(16.0),
+                              child: InkWell(
+                                child: PkPassWidget(pass: pass),
+                                onTap: () {
+                                  router.push(
+                                    '/backside',
+                                    extra: PassBackSidePageArgs(pass, true),
+                                  );
+                                },
+                              ),
+                            );
+                          }
                         },
                       ),
-                    );
-                  },
-                ),
-              ),
+                    ),
+                  ),
+          ],
+        ),
       ),
     );
   }
 }
+
+class ViewChooser extends StatelessWidget {
+  const ViewChooser({
+    super.key,
+    required this.onViewChanged,
+    required this.selected,
+  });
+
+  final ValueChanged<PassView> onViewChanged;
+  final PassView selected;
+
+  @override
+  Widget build(BuildContext context) {
+    return SegmentedButton<PassView>(
+      segments: const <ButtonSegment<PassView>>[
+        ButtonSegment<PassView>(
+          value: PassView.preview,
+          label: Text('Preview'),
+          icon: Icon(Icons.preview),
+        ),
+        ButtonSegment<PassView>(
+          value: PassView.compact,
+          label: Text('Compact'),
+        ),
+        /*
+        ButtonSegment<PassView>(
+          value: PassView.calendar,
+          label: Text('Calendar'),
+          icon: Icon(Icons.calendar_month),
+        ),
+        */
+      ],
+      selected: {selected},
+      onSelectionChanged: (selection) => onViewChanged(selection.first),
+      multiSelectionEnabled: false,
+    );
+  }
+}
+
+enum PassView {
+  /// Shows a calendar
+  calendar,
+
+  /// Shows a preview of the actual pass
+  preview,
+
+  /// Shows list tiles with a brief description
+  compact,
+}
diff --git a/app/lib/widgets/pass_list_tile.dart b/app/lib/widgets/pass_list_tile.dart
@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+import 'package:passkit/passkit.dart';
+import 'package:passkit_ui/passkit_ui.dart';
+
+// TODO(ueman): Maybe move to `package:passkit_ui`?
+class PassListTile extends StatelessWidget {
+  const PassListTile({super.key, required this.pass, this.onTap});
+
+  final PkPass pass;
+  final VoidCallback? onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    final devicePixelRatio = MediaQuery.devicePixelRatioOf(context);
+    final icon = pass.icon?.forCorrectPixelRatio(devicePixelRatio);
+    return ListTile(
+      // TODO(ueman): The icon should be an Apple squircle
+      leading: icon == null ? null : Image.memory(icon),
+      title: Text(pass.pass.description),
+      subtitle: Text(pass.pass.organizationName),
+      trailing: PkPassWidget(pass: pass),
+      onTap: onTap,
+    );
+  }
+}
diff --git a/app/pubspec.lock b/app/pubspec.lock
@@ -25,6 +25,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.11.3"
+  android_intent_plus:
+    dependency: "direct main"
+    description:
+      name: android_intent_plus
+      sha256: "2bfdbee8d65e7c26f88b66f0a91f2863da4d3596d8a658b4162c8de5cf04b074"
+      url: "https://pub.dev"
+    source: hosted
+    version: "5.0.2"
   archive:
     dependency: transitive
     description:

diff --git a/app/pubspec.yaml b/app/pubspec.yaml
@@ -8,6 +8,7 @@ environment:
   flutter: 3.22.2
 
 dependencies:
+  android_intent_plus: ^5.0.2
   content_resolver: ^0.3.1
   desktop_drop: ^0.4.4
   drift: ^2.11.1