product page for web.

This commit is contained in:
OkaykOrhmn 2025-02-17 18:14:17 +03:30
parent 09d4553e73
commit 25b5fe1160
1 changed files with 123 additions and 22 deletions

View File

@ -13,6 +13,102 @@ class ProductPage extends StatelessWidget {
return DefaultTabController(
length: 2,
child: Responsive(context).builder(
desktop: Scaffold(
body: Center(
child: ConstrainedBox(
constraints: BoxConstraints(
maxWidth: 1600,
),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(32.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
IconButton(
onPressed: () {
context.pop();
},
icon: Icon(
Icons.arrow_back_ios,
size: 32,
)),
Padding(
padding: const EdgeInsets.only(right: 32.0),
child: IconButton(
iconSize: 32,
onPressed: () {},
icon: Icon(Icons.bookmark_add_rounded)),
),
],
),
),
Expanded(
child: Row(
children: [
Expanded(
child: SingleChildScrollView(
physics: BouncingScrollPhysics(),
child: productTabBarView(context))),
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 64.0),
child: Column(
children: [
Expanded(
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: AspectRatio(
aspectRatio: 1 / 1,
child: Image.network(
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
width: double.infinity,
fit: BoxFit.cover,
)),
),
),
Padding(
padding:
const EdgeInsets.only(top: 32.0, bottom: 64),
child: SizedBox(
width: double.infinity,
height: 90,
child: ListView.builder(
itemCount: 20,
padding: EdgeInsets.symmetric(horizontal: 8),
scrollDirection: Axis.horizontal,
shrinkWrap: true,
physics: BouncingScrollPhysics(),
itemBuilder: (context, index) {
return Container(
margin:
EdgeInsets.symmetric(horizontal: 8),
padding: EdgeInsets.all(4),
decoration: BoxDecoration(
color: Theme.of(context)
.colorScheme
.surface
.withAlpha(200),
borderRadius:
BorderRadius.circular(8)),
child: Image.network(
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png'),
);
},
),
),
)
],
),
)),
],
),
),
],
),
)),
),
mobile: Scaffold(
body: SingleChildScrollView(
child: Column(
@ -52,9 +148,7 @@ class ProductPage extends StatelessWidget {
),
),
InkWell(
onTap: () {
context.pop();
},
onTap: () {},
child: Container(
decoration: BoxDecoration(
color: Theme.of(context)
@ -99,33 +193,40 @@ class ProductPage extends StatelessWidget {
))
],
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: TabBar(
tabs: [
Tab(text: 'Item'),
Tab(text: 'Shop'),
],
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: SizedBox(
height: 1500,
child: TabBarView(
children: [itemTab(context), shopTab(context)],
),
),
),
productTabBarView(context),
],
),
),
),
desktop: Scaffold(),
),
);
}
Column productTabBarView(BuildContext context) {
return Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: TabBar(
tabs: [
Tab(text: 'Item'),
Tab(text: 'Shop'),
],
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: SizedBox(
height: 1500,
child: TabBarView(
children: [itemTab(context), shopTab(context)],
),
),
),
],
);
}
Widget itemTab(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),