product list page

This commit is contained in:
Mikkel Troels Kongsted 2025-01-27 12:46:25 +01:00
parent 559df9494a
commit f5d9507427
7 changed files with 106 additions and 16 deletions

BIN
mobile/assets/boykisser.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

View File

@ -1,19 +1,98 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'global_components.dart'; import 'global_components.dart';
class ProductListItem extends StatelessWidget {
final String name;
final int price;
final String imagePath;
const ProductListItem(
{super.key,
required this.name,
required this.price,
required this.imagePath});
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.all(10),
height: 100,
decoration: BoxDecoration(
color: Color(0xFFFFFFFF),
border: Border.all(),
borderRadius: BorderRadius.all(Radius.circular(10))),
child: ElevatedButton(
style: ButtonStyle(
backgroundColor: WidgetStateProperty.all(Colors.transparent),
elevation: WidgetStateProperty.all(0),
shape: WidgetStateProperty.all(RoundedRectangleBorder()),
padding: WidgetStateProperty.all(EdgeInsets.zero),
splashFactory: NoSplash.splashFactory),
onPressed: () {},
child: Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
padding: EdgeInsets.fromLTRB(10, 10, 0, 10),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
name,
style: TextStyle(fontSize: 24, color: Colors.black),
),
Text(
"${price.toString()} kr",
style: TextStyle(fontSize: 16, color: Colors.black),
)
],
)),
ClipRRect(
borderRadius: BorderRadius.only(
topRight: Radius.circular(10),
bottomRight: Radius.circular(10)),
child:
Image(image: AssetImage(imagePath), fit: BoxFit.contain))
],
))),
);
}
}
class Dashboard extends StatelessWidget { class Dashboard extends StatelessWidget {
const Dashboard({super.key}); const Dashboard({super.key});
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return const Scaffold( return Scaffold(
body: Row(mainAxisAlignment: MainAxisAlignment.center, children: [ body: Row(
Column(mainAxisAlignment: MainAxisAlignment.center, children: [ mainAxisAlignment: MainAxisAlignment.center,
Text( children: [
"Not implemented", Expanded(
style: TextStyle(fontSize: 32), child: Column(children: [
TextField(
decoration: InputDecoration(
label: Text("Search"),
contentPadding: EdgeInsets.only(top: 20))),
Expanded(
child: ListView(
children: [
ProductListItem(
name: "idk",
price: 12,
imagePath: "assets/boykisser.png",
),
ProductListItem(
name: "idk",
price: 12,
imagePath: "assets/boykisser.png",
),
],
),
) )
]) ]),
])); ),
],
));
} }
} }

View File

@ -4,8 +4,11 @@ class PrimaryButton extends StatelessWidget {
final void Function()? onPressed; final void Function()? onPressed;
final Widget child; final Widget child;
const PrimaryButton( const PrimaryButton({
{super.key, required this.onPressed, required this.child}); super.key,
required this.onPressed,
required this.child,
});
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
@ -22,14 +25,15 @@ class PrimaryInput extends StatelessWidget {
final double height; final double height;
final String label; final String label;
final String placeholderText; final String placeholderText;
final bool obscure;
const PrimaryInput( const PrimaryInput(
{super.key, {super.key,
this.width = 300, this.width = 300,
this.height = 100, this.height = 100,
this.obscure = false,
required this.label, required this.label,
required this.placeholderText}); required this.placeholderText});
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return SizedBox( return SizedBox(
@ -40,6 +44,7 @@ class PrimaryInput extends StatelessWidget {
border: const OutlineInputBorder(), border: const OutlineInputBorder(),
label: Text(label), label: Text(label),
hintText: placeholderText), hintText: placeholderText),
obscureText: obscure,
)); ));
} }
} }

View File

@ -18,7 +18,8 @@ class LogInPage extends StatelessWidget {
), ),
const PrimaryInput( const PrimaryInput(
label: "Mail/Tlf", placeholderText: "f.eks. example@example.com"), label: "Mail/Tlf", placeholderText: "f.eks. example@example.com"),
const PrimaryInput(label: "Password", placeholderText: "*********"), const PrimaryInput(
label: "Password", placeholderText: "*********", obscure: true),
PrimaryButton( PrimaryButton(
onPressed: () => { onPressed: () => {
Navigator.of(context).push(MaterialPageRoute( Navigator.of(context).push(MaterialPageRoute(

View File

@ -14,6 +14,7 @@ class MyApp extends StatelessWidget {
title: 'Fresh Plaza', title: 'Fresh Plaza',
theme: ThemeData( theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue), colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
scaffoldBackgroundColor: const Color(0xECF6F0FF),
useMaterial3: true, useMaterial3: true,
), ),
home: const MyHomePage(title: 'Fresh Plaza'), home: const MyHomePage(title: 'Fresh Plaza'),

View File

@ -19,9 +19,12 @@ class RegisterPage extends StatelessWidget {
const PrimaryInput(label: "Fornavn", placeholderText: "Fornavn"), const PrimaryInput(label: "Fornavn", placeholderText: "Fornavn"),
const PrimaryInput( const PrimaryInput(
label: "Mail/Tlf", placeholderText: "f.eks. example@example.com"), label: "Mail/Tlf", placeholderText: "f.eks. example@example.com"),
const PrimaryInput(label: "Password", placeholderText: "*********"),
const PrimaryInput( const PrimaryInput(
label: "Password (igen)", placeholderText: "*********"), label: "Password", placeholderText: "*********", obscure: true),
const PrimaryInput(
label: "Password (igen)",
placeholderText: "*********",
obscure: true),
PrimaryButton( PrimaryButton(
onPressed: () => { onPressed: () => {
Navigator.of(context).push(MaterialPageRoute( Navigator.of(context).push(MaterialPageRoute(

View File

@ -51,7 +51,8 @@ dev_dependencies:
# The following section is specific to Flutter packages. # The following section is specific to Flutter packages.
flutter: flutter:
assets:
- assets/
# The following line ensures that the Material Icons font is # The following line ensures that the Material Icons font is
# included with your application, so that you can use the icons in # included with your application, so that you can use the icons in
# the material Icons class. # the material Icons class.