сделанная 4

This commit is contained in:
salih 2024-11-26 11:02:52 +04:00
parent c53172c99e
commit 279537d301
5 changed files with 297 additions and 249 deletions

View File

@ -0,0 +1,10 @@
class MarketData {
final String price;
final String name;
final String? discount;
final String size;
final String? image;
MarketData(this.price, this.name, this.discount, this.size,
{required this.image});
}

View File

@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:pmu/presentation/home_page/home_page.dart';
void main() {
runApp(const MyApp());
@ -12,258 +13,10 @@ class MyApp extends StatelessWidget {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
colorScheme: ColorScheme.fromSeed(seedColor: Color(0xFFFFA400)),
useMaterial3: true,
),
home: const MyHomePage(title: 'Магизин у дома'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final Color _color = Color(0xFF9878D7);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: _color,
title: Text(widget.title),
),
body: const MyWidget(),
);
}
}
class _CardDate {
final String text;
final String description;
final IconData icon;
final String? image;
_CardDate(this.text,
{required this.description,
this.icon = Icons.ac_unit_outlined,
this.image});
}
class MyWidget extends StatelessWidget {
const MyWidget({super.key});
@override
Widget build(BuildContext context) {
final data = [
_CardDate(
'First',
description: "This first card",
icon: Icons.ice_skating,
image:
'https://i.pinimg.com/originals/6a/11/e7/6a11e75396a475e69ccf36eb53459645.png',
),
_CardDate(
'Second',
description: "This second card",
icon: Icons.ac_unit_rounded,
image:
'https://mir-s3-cdn-cf.behance.net/project_modules/2800_opt_1/56da13103680399.5f5288873fac6.png',
),
_CardDate(
'Third',
description: "This third card",
icon: Icons.abc_sharp,
image:
'https://avatars.mds.yandex.net/i?id=200973d41be50944574dc1ef6f59aec5acd569de-7549266-images-thumbs&n=13',
),
];
final markerDate = [
_MarketData('100₽', "Банан", '80₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big1/hlr-system/428/425/752/325/184/4/100028179877b0.jpg'),
_MarketData('180₽', "Мандарины", '160₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/105/621/149/532/518/46/100028180607b0.jpg'),
_MarketData('140₽', "Сыр", '120₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/-21/355/242/874/191/753/100026606392b0.jpg'),
_MarketData('188₽', "Крабовые палочки Aro", '159₽ ', '500 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/208/792/956/332/518/55/100028195753b0.jpg'),
_MarketData('100₽', "Черноголовка Кола", '99₽ ', '2 л',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/822/548/713/816/182/3/100032947636b0.jpg'),
];
return Center(
child: SingleChildScrollView(
child: Wrap(
children: markerDate
.map((x) => SizedBox(
width: MediaQuery.of(context).size.width / 2 - 16,
child: _MarketCard.formDate(x),
))
.toList(),
),
),
);
}
}
class _MarketData {
final String price;
final String name;
final String? discount;
final String size;
final String? image;
_MarketData(this.price, this.name, this.discount, this.size,
{required this.image});
}
class _MarketCard extends StatelessWidget {
final String price;
final String name;
final String? discount;
final String size;
final String? image;
const _MarketCard(this.price, this.name, this.discount, this.size,
{required this.image});
factory _MarketCard.formDate(_MarketData date) =>
_MarketCard(date.price, date.name, date.discount, date.size,
image: date.image);
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(4),
decoration: BoxDecoration(
color: Color(0xFFE5E4E2),
borderRadius: BorderRadius.circular(16),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(14),
child: SizedBox(
child: Image.network(
image ?? '',
fit: BoxFit.fill,
errorBuilder: (_, __, ___) => const Placeholder(),
),
),
),
Row(
children: [
Text(
discount ?? '',
style: TextStyle(fontSize: 26, color: Color(0xFFF1571E)),
),
Text(
price,
style: TextStyle(
fontSize: 16, decoration: TextDecoration.lineThrough),
),
],
),
Text(
name,
style: TextStyle(fontSize: 20),
),
Text(
size,
style: TextStyle(fontSize: 18),
),
],
),
);
}
}
class _Card extends StatelessWidget {
final String text;
final IconData icon;
final String description;
final String? image;
const _Card(this.text,
{this.icon = Icons.earbuds_outlined,
required this.description,
this.image});
factory _Card.formDate(_CardDate date) => _Card(
date.text,
description: date.description,
icon: date.icon,
image: date.image,
);
@override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.only(top: 16, left: 10, right: 10),
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white54,
borderRadius: BorderRadius.circular(20),
border: Border.all(
color: Colors.white70,
width: 2,
),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 4,
offset: const Offset(0, 5),
blurRadius: 8,
)
],
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(15),
child: SizedBox(
height: 100,
width: 100,
child: Image.network(
image ?? '',
fit: BoxFit.fill,
errorBuilder: (_, __, ___) => const Placeholder(),
),
),
),
Flexible(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(children: [
Text(
text,
style: Theme.of(context).textTheme.headlineLarge,
),
Text(
description,
),
]),
),
),
Padding(
padding: const EdgeInsets.only(left: 8.0), child: Icon(icon))
],
));
}
}

View File

@ -0,0 +1,48 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:pmu/domain/models/card.dart';
class DetailsPage extends StatelessWidget {
final MarketData data;
const DetailsPage(this.data, {super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Color(0xFFFFA400),
),
body: SingleChildScrollView(
child: Container(
constraints: BoxConstraints(
minHeight: MediaQuery.sizeOf(context).height - 105),
decoration: const BoxDecoration(
color: Color(0xFFFFA400),
),
padding: const EdgeInsets.all(10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(bottom: 16.0),
child: Image.network(data.image ?? ''),
),
Padding(
padding: const EdgeInsets.only(bottom: 4.0),
child: Text(
data.name,
style: Theme.of(context).textTheme.headlineLarge,
),
),
Text(
data.size,
style: Theme.of(context).textTheme.bodyLarge,
)
],
),
),
),
);
}
}

View File

@ -0,0 +1,144 @@
part of "home_page.dart";
typedef OnLikeCallback = void Function(String title, bool isLiked)?;
class _MarketCard extends StatefulWidget {
final String price;
final String name;
final String? discount;
final String size;
final String? image;
final OnLikeCallback onLike;
final VoidCallback? onTap;
const _MarketCard(this.price, this.name, this.discount, this.size,
{required this.image, this.onLike, this.onTap});
factory _MarketCard.formDate(MarketData date,
{OnLikeCallback? onLike, VoidCallback? onTap}) =>
_MarketCard(date.price, date.name, date.discount, date.size,
image: date.image, onLike: onLike, onTap: onTap);
@override
State<_MarketCard> createState() => _MarketCardState();
}
class _MarketCardState extends State<_MarketCard> {
bool isLiked = false;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: widget.onTap,
child: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.all(4),
constraints: const BoxConstraints(minHeight: 140),
decoration: BoxDecoration(
color: Color(0xFFE5E4E2),
borderRadius: BorderRadius.circular(16),
),
child: IntrinsicHeight(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(14),
child: SizedBox(
width: double.infinity,
height: 160,
child: Stack(
children: [
Positioned.fill(
child: Image.network(
widget.image ?? '',
fit: BoxFit.cover,
errorBuilder: (_, __, ___) => const Placeholder(),
),
),
Align(
alignment: Alignment.bottomRight,
child: Container(
decoration: const BoxDecoration(
color: Color(0xFFffef42),
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
)),
padding: const EdgeInsets.fromLTRB(8, 2, 8, 2),
child: Text(
"новинка",
style: Theme.of(context)
.textTheme
.bodyMedium
?.copyWith(color: Colors.black),
),
),
)
],
)),
),
Row(
children: [
Padding(
padding: const EdgeInsets.only(
top: 6,
),
child: Text(
widget.discount ?? '',
style:
TextStyle(fontSize: 26, color: Color(0xFFF1571E)),
),
),
Text(
widget.price,
style: TextStyle(
fontSize: 16, decoration: TextDecoration.lineThrough),
),
],
),
Text(
widget.name,
style: TextStyle(fontSize: 20),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
widget.size,
style: TextStyle(fontSize: 18),
),
const Spacer(),
Align(
alignment: Alignment.bottomRight,
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: GestureDetector(
onTap: () {
setState(() {
isLiked = !isLiked;
});
widget.onLike?.call(widget.name, isLiked);
},
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 100),
child: isLiked
? const Icon(
Icons.favorite,
color: Colors.redAccent,
key: ValueKey<int>(0),
)
: const Icon(
Icons.favorite,
color: Colors.grey,
key: ValueKey<int>(1),
)),
)),
)
],
)
],
),
)),
);
}
}

View File

@ -0,0 +1,93 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:pmu/domain/models/card.dart';
import 'package:pmu/presentation/details_page/details_page.dart';
part 'card.dart';
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final Color _color = Color(0xFFFFA400);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: _color,
title: Text(widget.title),
),
body: const Body(),
);
}
}
class Body extends StatelessWidget {
const Body({super.key});
@override
Widget build(BuildContext context) {
final markerDate = [
MarketData('100₽', "Банан", '80₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big1/hlr-system/428/425/752/325/184/4/100028179877b0.jpg'),
MarketData('180₽', "Мандарины", '160₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/105/621/149/532/518/46/100028180607b0.jpg'),
MarketData('140₽', "Сыр", '120₽ ', '100 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/-21/355/242/874/191/753/100026606392b0.jpg'),
MarketData('188₽', "Крабовые палочки Aro", '159₽ ', '500 г',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/208/792/956/332/518/55/100028195753b0.jpg'),
MarketData('100₽', "Черноголовка Кола", '99₽ ', '2 л',
image:
'https://main-cdn.sbermegamarket.ru/big2/hlr-system/822/548/713/816/182/3/100032947636b0.jpg'),
];
return Center(
child: SingleChildScrollView(
child: Wrap(
children: markerDate
.map((x) => SizedBox(
width: MediaQuery.of(context).size.width / 2 - 16,
child: _MarketCard.formDate(
x,
onLike: (title, isLiked) =>
_showSnackBar(context, title, isLiked),
onTap: () => _navToDetails(context, x),
),
))
.toList(),
),
),
);
}
void _showSnackBar(BuildContext context, String title, bool isLiked) {
WidgetsBinding.instance.addPostFrameCallback((_) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
content: Text(
'Товар $title ${isLiked ? 'добавлен в избранное' : 'удален из избранного'}',
style: Theme.of(context).textTheme.bodyLarge,
),
backgroundColor: Colors.orangeAccent,
duration: const Duration(seconds: 1),
));
});
}
void _navToDetails(BuildContext context, MarketData data) {
Navigator.push(
context,
CupertinoPageRoute(builder: (context) => DetailsPage(data)),
);
}
}