diff --git a/client/assets/banner.png b/client/assets/banner.png new file mode 100644 index 0000000..c3e9376 Binary files /dev/null and b/client/assets/banner.png differ diff --git a/client/lib/main.dart b/client/lib/main.dart index 8e94089..6b63d4b 100644 --- a/client/lib/main.dart +++ b/client/lib/main.dart @@ -1,4 +1,7 @@ +import 'dart:convert'; + import 'package:flutter/material.dart'; +import 'package:http/http.dart' as http; void main() { runApp(const MyApp()); @@ -12,25 +15,7 @@ class MyApp extends StatelessWidget { Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', - theme: ThemeData( - // This is the theme of your application. - // - // TRY THIS: Try running your application with "flutter run". You'll see - // the application has a purple toolbar. Then, without quitting the app, - // try changing the seedColor in the colorScheme below to Colors.green - // and then invoke "hot reload" (save your changes or press the "hot - // reload" button in a Flutter-supported IDE, or press "r" if you used - // the command line to start the app). - // - // Notice that the counter didn't reset back to zero; the application - // state is not lost during the reload. To reset the state, use hot - // restart instead. - // - // This works for code too, not just values: Most code changes can be - // tested with just a hot reload. - colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), - useMaterial3: true, - ), + theme: ThemeData(useMaterial3: true), home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } @@ -54,20 +39,33 @@ class MyHomePage extends StatefulWidget { State createState() => _MyHomePageState(); } -class _MyHomePageState extends State { - int _counter = 0; +class Recipe { + String name; + String icon; - void _incrementCounter() { - setState(() { - // This call to setState tells the Flutter framework that something has - // changed in this State, which causes it to rerun the build method below - // so that the display can reflect the updated values. If we changed - // _counter without calling setState(), then the build method would not be - // called again, and so nothing would appear to happen. - _counter++; - }); + Recipe(this.name, this.icon); + + factory Recipe.fromMap(Map json) { + return Recipe(json['Name'], json['Icon']); } + factory Recipe.fromJson(Map json) { + return Recipe(json['Name'], json['Icon']); + } +} +Future> fetchRecipes() async { + final response = await http.get( + Uri(scheme: "http", host: "localhost", port: 8080, path: "api/recipes")); + + if (response.statusCode == 200) { + final parsed = json.decode(response.body).cast>(); + return parsed.map((json) => Recipe.fromMap(json)).toList(); + } else { + throw Exception("Failed to fetch recipes"); + } +} + +class _MyHomePageState extends State { @override Widget build(BuildContext context) { // This method is rerun every time setState is called, for instance as done @@ -76,50 +74,29 @@ class _MyHomePageState extends State { // The Flutter framework has been optimized to make rerunning build methods // fast, so that you can just rebuild anything that needs updating rather // than having to individually change instances of widgets. - return Scaffold( - appBar: AppBar( - // TRY THIS: Try changing the color here to a specific color (to - // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar - // change color while the other colors stay the same. - backgroundColor: Theme.of(context).colorScheme.inversePrimary, - // Here we take the value from the MyHomePage object that was created by - // the App.build method, and use it to set our appbar title. - title: Text(widget.title), - ), - body: Center( - // Center is a layout widget. It takes a single child and positions it - // in the middle of the parent. - child: Column( - // Column is also a layout widget. It takes a list of children and - // arranges them vertically. By default, it sizes itself to fit its - // children horizontally, and tries to be as tall as its parent. - // - // Column has various properties to control how it sizes itself and - // how it positions its children. Here we use mainAxisAlignment to - // center the children vertically; the main axis here is the vertical - // axis because Columns are vertical (the cross axis would be - // horizontal). - // - // TRY THIS: Invoke "debug painting" (choose the "Toggle Debug Paint" - // action in the IDE, or press "p" in the console), to see the - // wireframe for each widget. - mainAxisAlignment: MainAxisAlignment.center, - children: [ - const Text( - 'You have pushed the button this many times:', - ), - Text( - '$_counter', - style: Theme.of(context).textTheme.headlineMedium, - ), - ], - ), - ), - floatingActionButton: FloatingActionButton( - onPressed: _incrementCounter, - tooltip: 'Increment', - child: const Icon(Icons.add), - ), // This trailing comma makes auto-formatting nicer for build methods. - ); + return Container( + child: Column(children: [ + Padding( + padding: EdgeInsetsDirectional.all(16.0), + child: Image(image: AssetImage("assets/banner.png"))), + Text(textAlign: TextAlign.start, "Einkaufsliste"), + FutureBuilder>( + future: fetchRecipes(), + builder: (context, snapshot) { + if (snapshot.hasError) print(snapshot.error); + + if (snapshot.hasData) { + List rows = List.empty(growable: true); + + for (Recipe recipe in snapshot.data!) { + rows.add(TableRow(children: [Text(recipe.name)])); + } + + return Table(children: rows); + } else { + return Center(child: CircularProgressIndicator()); + } + }) + ])); } } diff --git a/client/pubspec.lock b/client/pubspec.lock index b9fd799..e99fa66 100644 --- a/client/pubspec.lock +++ b/client/pubspec.lock @@ -75,6 +75,22 @@ packages: description: flutter source: sdk version: "0.0.0" + http: + dependency: "direct main" + description: + name: http + sha256: b9c29a161230ee03d3ccf545097fccd9b87a5264228c5d348202e0f0c28f9010 + url: "https://pub.dev" + source: hosted + version: "1.2.2" + http_parser: + dependency: transitive + description: + name: http_parser + sha256: "2aa08ce0341cc9b354a498388e30986515406668dbcc4f7c950c3e715496693b" + url: "https://pub.dev" + source: hosted + version: "4.0.2" leak_tracker: dependency: transitive description: @@ -192,6 +208,14 @@ packages: url: "https://pub.dev" source: hosted version: "0.7.2" + typed_data: + dependency: transitive + description: + name: typed_data + sha256: f9049c039ebfeb4cf7a7104a675823cd72dba8297f264b6637062516699fa006 + url: "https://pub.dev" + source: hosted + version: "1.4.0" vector_math: dependency: transitive description: @@ -208,6 +232,14 @@ packages: url: "https://pub.dev" source: hosted version: "14.2.5" + web: + dependency: transitive + description: + name: web + sha256: cd3543bd5798f6ad290ea73d210f423502e71900302dde696f8bff84bf89a1cb + url: "https://pub.dev" + source: hosted + version: "1.1.0" sdks: dart: ">=3.5.3 <4.0.0" flutter: ">=3.18.0-18.0.pre.54" diff --git a/client/pubspec.yaml b/client/pubspec.yaml index d82df6d..abd33a5 100644 --- a/client/pubspec.yaml +++ b/client/pubspec.yaml @@ -28,6 +28,7 @@ environment: # the latest version available on pub.dev. To see which dependencies have newer # versions available, run `flutter pub outdated`. dependencies: + http: flutter: sdk: flutter @@ -58,6 +59,9 @@ flutter: # the material Icons class. uses-material-design: true + assets: + - assets/banner.png + # To add assets to your application, add an assets section, like this: # assets: # - images/a_dot_burr.jpeg