main.dart file
import 'package:flutter/material.dart';
import 'package:new_test/cart_page.dart';
void main() {
runApp(
const MaterialApp(
debugShowCheckedModeBanner: false,
home: MyApp(),
),
);
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
bool a = true;
bool b = false;
bool c = false;
bool d = false;
bool e = false;
int index = 0;
List<Map<String, dynamic>> Setas = [
{
'1_img': const AssetImage("assets/images/1.png"),
'1_name': "Slik Chair",
'1_color': Colors.amber,
'1_price': "\$ 80",
},
{
'2_img': const AssetImage("assets/images/2.png"),
'2_name': "Balloon Chair",
'2_color': Colors.grey,
'2_price': "\$ 260",
},
{
'3_img': const AssetImage("assets/images/3.png"),
'3_name': "Rocking Chair",
'3_color': Colors.teal,
'3_price': "\$ 90",
},
{
'4_img': const AssetImage("assets/images/4.png"),
'4_name': "Thulip Chair",
'4_color': const Color(0xffE57F84),
'4_price': "\$ 120"
},
{
'5_img': const AssetImage("assets/images/5.png"),
'5_name': "Folding Chair",
'5_color': const Color(0xff2F5061),
'5_price': "\$ 80",
},
];
List<Map<String, dynamic>> Lamps = [
{
'1_img': const AssetImage("assets/images/4.png"),
'1_name': "Slik Chair",
'1_color': Colors.amber,
'1_price': "\$ 80",
},
{
'2_img': const AssetImage("assets/images/4.png"),
'2_name': "Balloon Chair",
'2_color': Colors.grey,
'2_price': "\$ 260",
},
{
'3_img': const AssetImage("assets/images/3.png"),
'3_name': "Rocking Chair",
'3_color': Colors.teal,
'3_price': "\$ 90",
},
{
'4_img': const AssetImage("assets/images/4.png"),
'4_name': "Thulip Chair",
'4_color': const Color(0xffE57F84),
'4_price': "\$ 120"
},
{
'5_img': const AssetImage("assets/images/5.png"),
'5_name': "Folding Chair",
'5_color': const Color(0xff2F5061),
'5_price': "\$ 80",
},
];
var val = "";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
"Discover",
style: TextStyle(
fontSize: 35, fontWeight: FontWeight.w700, color: Colors.black),
),
actions: const [
Icon(
Icons.search_rounded,
color: Colors.black,
size: 35,
),
SizedBox(
width: 10,
),
Icon(
Icons.perm_identity_sharp,
color: Colors.black,
size: 35,
),
SizedBox(
width: 10,
),
],
backgroundColor: Colors.white,
elevation: 0,
),
body: SingleChildScrollView(
child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.all(20.0),
child: Container(
height: MediaQuery.of(context).size.height / 3.5,
width: MediaQuery.of(context).size.width * 0.9,
alignment: const Alignment(-0.5, -0.8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30.0),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
image: const DecorationImage(
image: NetworkImage(
"https://th.bing.com/th/id/OIP.qycBT-EJHLvwl4r0rzcz3QHaGE?pid=ImgDet&w=1625&h=1331&rs=1",
),
fit: BoxFit.cover)),
child: const Text(
"BRING GREAT DESINGN TO\nEVERYONE",
style: TextStyle(
fontSize: 20,
color: Colors.white70,
fontWeight: FontWeight.w500),
),
),
),
const SizedBox(
height: 15,
),
Container(
height: MediaQuery.of(context).size.height / 15,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const SizedBox(
width: 25,
),
Container(
child: InkWell(
onTap: () {
setState(() {
// val = "Setas";
a = true;
b = false;
c = false;
d = false;
e = false;
});
},
child: const Text(
"Setas",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
),
),
const SizedBox(
width: 25,
),
InkWell(
onTap: () {
setState(() {
// val = "Lamps";
a = false;
b = true;
c = false;
d = false;
e = false;
});
},
child: const Text(
"Lamps",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
),
const SizedBox(
width: 25,
),
Container(
child: InkWell(
onTap: () {
setState(() {
// val = "Sofas";
a = false;
b = false;
c = true;
e = false;
d = false;
});
},
child: const Text(
"Sofas",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
),
),
const SizedBox(
width: 25,
),
Container(
child: InkWell(
onTap: () {
setState(() {
a = false;
b = false;
c = false;
e = true;
d = false;
});
},
child: const Text(
"Tables",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
),
),
const SizedBox(
width: 25,
),
Container(
child: InkWell(
onTap: () {
setState(() {
a = false;
b = false;
c = false;
e = false;
d = true;
});
},
child: const Text(
"Bed",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
),
),
const SizedBox(
width: 25,
),
],
),
),
),
if (a)
SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: IndexedStack(
index: index,
children: [
Row(children: [
Padding(
padding: const EdgeInsets.only(
left: 20.0,
top: 10,
),
child: Row(
children: [
InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
const cart_page()));
// mycolor = Setas[index]['1_color'];
},
child: Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.amber,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid),
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/images/1.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.6, 0.5),
child: const Text(
'Slik Chair',
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 80",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.grey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/images/2.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Balloon Chair",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 260",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.teal,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/images/3.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Rocking chair",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 90",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: const Color(0xffE57F84),
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/images/4.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Thulip Chair",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 120",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: const Color(0xff2F5061),
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/images/5.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Folding chair",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 80",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
],
),
),
]),
],
),
)
else
Container(),
(b)
? SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: Row(
children: [
Padding(
padding: const EdgeInsets.only(
left: 20.0,
top: 10,
),
child: Row(
children: [
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.blueGrey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Lamps/1.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.5),
child: const Text(
"Lamp",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 80",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.amber,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Lamps/2.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Designer Lamps",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 260",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.teal,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Lamps/3.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Stand Lamps",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 90",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.brown,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Lamps/4.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Houseing Lamps",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 120",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
],
),
),
],
),
)
: Container(),
(c)
? SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: Row(
children: [
Padding(
padding: const EdgeInsets.only(
left: 20.0,
top: 10,
),
child: Row(
children: [
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.blueGrey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Sofas/1.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.6, 0.5),
child: const Text(
"Simple Sofa",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 580",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.black54,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Sofas/2.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Balloon Sofa",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 760",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: const Color(0xff2F5061),
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Sofas/3.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Rocking Sofa",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 990",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
// color: const Color(0xffE57F84),
color: Colors.grey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Sofas/4.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Thulip Sofa",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 420",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
// color: const Color(0xff2F5061),
color: Colors.black54,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Sofas/5.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Soft Sofa",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 880",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
],
),
),
],
),
)
: Container(),
(e)
? SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: Row(
children: [
Padding(
padding: const EdgeInsets.only(
left: 20.0,
top: 10,
),
child: Row(
children: [
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.blueGrey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Tables/3.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Large Table",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 150",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
// color: const Color(0xffE57F84),
color: Colors.pinkAccent,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Tables/4.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Dressing Table",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 320",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
// color: const Color(0xff2F5061),
color: Colors.cyan,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Tables/5.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.3, 0.5),
child: const Text(
"Office Table",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 80",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.brown.shade300,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Tables/1.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.6, 0.5),
child: const Text(
"Simple Table",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 50",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.brown.shade500,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Tables/2.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.2, 0.5),
child: const Text(
"Round Table",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 70",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
],
),
),
],
),
)
: Container(),
(d)
? SingleChildScrollView(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
child: Row(
children: [
Padding(
padding: const EdgeInsets.only(
left: 20.0,
top: 10,
),
child: Row(
children: [
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.blueGrey,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Bed/1.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.6, 0.5),
child: const Text(
"Single Bed",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 280",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
Stack(
children: [
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
decoration: BoxDecoration(
color: Colors.black54,
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
),
alignment: const Alignment(-1, -0.4),
child: Image.asset('assets/Bed/2.png'),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.6, 0.5),
child: const Text(
"Jambo Bed",
style: TextStyle(
fontSize: 25, color: Colors.white70),
),
),
Container(
height:
MediaQuery.of(context).size.height / 3,
width:
MediaQuery.of(context).size.width * 0.5,
alignment: const Alignment(-0.7, 0.8),
child: const Text(
"\$ 580",
style: TextStyle(
fontSize: 25, color: Colors.white),
),
),
],
),
const SizedBox(
width: 20,
),
],
),
),
],
),
)
: Container(),
const SizedBox(
height: 20,
),
Container(
alignment: const Alignment(-0.80, 0),
child: const Text(
"New Arrived",
style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
),
),
const SizedBox(
height: 20,
),
Container(
height: 100,
width: MediaQuery.of(context).size.width * 0.9,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
borderRadius: BorderRadius.circular(10)),
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
children: [
Container(
height: 70,
width: 90,
decoration: BoxDecoration(
// color: Colors.red,
borderRadius: BorderRadius.circular(12),
image: const DecorationImage(
image: NetworkImage(
"https://th.bing.com/th/id/OIP.KHPCzoWrjRV84VScPXcivAHaHa?pid=ImgDet&w=200&h=200&c=7&dpr=1.5"),
fit: BoxFit.cover),
),
),
const SizedBox(
width: 20,
),
Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
"Modern Crystal",
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.w500),
),
const SizedBox(
height: 5,
),
const Text(
"\$ 280",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
],
),
),
const SizedBox(
width: 40,
),
Container(
child: const Icon(
Icons.arrow_forward_sharp,
size: 35,
),
)
],
),
),
),
const SizedBox(
height: 20,
),
Container(
height: 100,
width: MediaQuery.of(context).size.width * 0.9,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
borderRadius: BorderRadius.circular(10)),
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
children: [
Container(
height: 70,
width: 90,
decoration: BoxDecoration(
// color: Colors.red,
borderRadius: BorderRadius.circular(12),
image: const DecorationImage(
image: NetworkImage(
"https://i.etsystatic.com/15637923/r/il/a4a9ed/3300920191/il_1588xN.3300920191_nd8r.jpg"),
fit: BoxFit.cover)),
// child: Image.asset('assets/images/6.png',fit: BoxFit.fill ),
),
const SizedBox(
width: 20,
),
Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
"Touch Lamps",
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.w500),
),
const SizedBox(
height: 5,
),
const Text(
"\$ 100",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
],
),
),
const SizedBox(
width: 58,
),
Container(
child: const Icon(
Icons.arrow_forward_sharp,
size: 35,
),
)
],
),
),
),
const SizedBox(
height: 20,
),
Container(
height: 100,
width: MediaQuery.of(context).size.width * 0.9,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
spreadRadius: 2,
blurRadius: 4,
color: Colors.grey.shade300,
blurStyle: BlurStyle.solid
// offset: Offset(1,1)
)
],
borderRadius: BorderRadius.circular(10)),
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
children: [
Container(
height: 70,
width: 90,
decoration: BoxDecoration(
// color: Colors.red,
borderRadius: BorderRadius.circular(12),
image: const DecorationImage(
image: NetworkImage(
"https://th.bing.com/th/id/OIP.WqxoGY6pMbYx9ZsI8MjNBwHaHa?pid=ImgDet&rs=1"),
fit: BoxFit.cover)),
// child: Image.asset('assets/images/6.png',fit: BoxFit.fill ),
),
const SizedBox(
width: 20,
),
Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
"Mushroom",
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.w500),
),
const SizedBox(
height: 5,
),
const Text(
"\$ 168",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
],
),
),
const SizedBox(
width: 80,
),
Container(
child: const Icon(
Icons.arrow_forward_sharp,
size: 35,
),
)
],
),
),
),
const SizedBox(
height: 20,
),
],
),
),
backgroundColor: Colors.white,
);
}
}
- cart_page.dart Page
import 'package:flutter/material.dart';
class cart_page extends StatefulWidget {
const cart_page({Key? key}) : super(key: key);
@override
State<cart_page> createState() => _cart_pageState();
}
class _cart_pageState extends State<cart_page> {
int i = 01;
Color yellow = Colors.yellow;
var img = Image(image: AssetImage('assets/images/1.png'));
@override
Widget build(BuildContext context) {
// MyPages data = ModalRoute.of(context)!.settings.arguments;
return Scaffold(
appBar: AppBar(
backgroundColor: yellow,
elevation: 0,
),
body: Column(
children: [
Expanded(
flex: 3,
child: Container(
child: img,
),
),
Expanded(
flex: 3,
child: Container(
// height: MediaQuery.of(context).size.,
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30),
topRight: Radius.circular(30),
),
),
child: Padding(
padding: const EdgeInsets.all(28.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Slik Chair",
style:
TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
),
SizedBox(
height: 10,
),
Text(
"This Is The Best Chair In Slik Categories...",
style: TextStyle(fontSize: 20, color: Colors.blueGrey),
),
SizedBox(
height: 20,
),
Row(
children: [
InkWell(
onTap: () {
setState(() {
yellow = Colors.amber;
});
},
child: Container(
height: 35,
width: 35,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
spreadRadius: 0.5,
blurRadius: 5)
]),
child: Padding(
padding: const EdgeInsets.all(4.0),
child: InkWell(
onTap: () {
setState(() {
yellow = Colors.amber;
img = Image(
image:
AssetImage("assets/images/1.png"));
});
},
child: Container(
height: 30,
width: 30,
decoration: BoxDecoration(
color: Colors.amber,
borderRadius: BorderRadius.circular(10),
),
),
),
),
),
),
SizedBox(
width: 20,
),
InkWell(
onTap: () {
setState(() {
yellow = Colors.redAccent;
img = Image(
image: AssetImage('assets/images/11.png'));
});
},
child: Container(
height: 35,
width: 35,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
spreadRadius: 0.5,
blurRadius: 5)
]),
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
height: 30,
width: 30,
decoration: BoxDecoration(
color: Colors.redAccent,
borderRadius: BorderRadius.circular(10),
),
),
),
),
),
SizedBox(
width: 20,
),
InkWell(
onTap: () {
setState(() {
yellow = Colors.green;
img = Image(
image: AssetImage("assets/images/10.png"));
});
},
child: Container(
height: 35,
width: 35,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
spreadRadius: 0.5,
blurRadius: 5)
]),
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
height: 30,
width: 30,
decoration: BoxDecoration(
color: Colors.green,
borderRadius: BorderRadius.circular(10),
),
),
),
),
),
SizedBox(width: 60),
InkWell(
onTap: () {
setState(() {
i--;
if (i < 1) i = 0;
});
},
child: Container(
height: 35,
width: 35,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey.shade200,
// boxShadow: [
// BoxShadow(color: Colors.grey,spreadRadius: 0.5,blurRadius: 5)
// ]
),
child: Icon(
Icons.remove,
size: 25,
),
),
),
SizedBox(width: 15),
Text(
"$i",
style: TextStyle(
fontSize: 25, fontWeight: FontWeight.bold),
),
SizedBox(width: 15),
InkWell(
onTap: () {
setState(() {
i++;
});
},
child: Container(
height: 35,
width: 35,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey.shade200,
// boxShadow: [
// BoxShadow(color: Colors.grey,spreadRadius: 0.5,blurRadius: 5)
// ]
),
child: Icon(
Icons.add,
size: 25,
),
),
),
],
),
SizedBox(height: 30),
Row(
children: [
Container(
height: 65,
width: 65,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
spreadRadius: 0.2,
blurRadius: 10),
],
),
child: Icon(
Icons.star_border_rounded,
size: 45,
),
),
SizedBox(
width: 90,
),
Container(
height: 65,
width: 180,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(15)),
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
children: [
Expanded(
flex: 2,
child: Container(
child: Text(
"\$ 260",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 30),
),
),
),
Expanded(
flex: 1,
child: Container(
child: Icon(
Icons.arrow_forward_sharp,
size: 35,
color: Colors.white,
),
),
),
],
),
),
)
],
),
],
),
),
),
),
],
),
backgroundColor: yellow,
);
}
}