Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 7190bff

Browse files
Add furnitures example
1 parent 5a4834d commit 7190bff

File tree

1 file changed

+174
-0
lines changed

1 file changed

+174
-0
lines changed

‎lib/pages/furnitures.dart

Lines changed: 174 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
import 'package:animate_do/animate_do.dart';
2+
import 'package:flutter/material.dart';
3+
4+
class Furnitures extends StatefulWidget {
5+
const Furnitures({ Key? key }) : super(key: key);
6+
7+
@override
8+
_FurnituresState createState() => _FurnituresState();
9+
}
10+
11+
class _FurnituresState extends State<Furnitures> with TickerProviderStateMixin {
12+
List<dynamic> _furnitures = [
13+
{
14+
'title': 'Modern \nFurnitures',
15+
'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.',
16+
'image': 'https://images.unsplash.com/photo-1612015900986-4c4d017d1648?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NTJ8fGZ1cm5pdHVyZXN8ZW58MHx8MHxibGFja3w%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'
17+
},
18+
{
19+
'title': 'Modern \nFurniture',
20+
'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.',
21+
'image': 'https://images.unsplash.com/photo-1583847268964-b28dc8f51f92?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8ZnVybml0dXJlc3xlbnwwfDF8MHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'
22+
},
23+
{
24+
'title': 'Modern \nFurniture',
25+
'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.',
26+
'image': 'https://images.unsplash.com/photo-1532499012374-fdfae50e73e9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Nnx8ZnVybml0dXJlc3xlbnwwfDF8MHxibGFja3w%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'
27+
},
28+
{
29+
'title': 'Modern \nFurniture',
30+
'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.',
31+
'image': 'https://images.unsplash.com/photo-1633555715049-0c2777ee516e?ixid=MnwxMjA3fDB8MHxzZWFyY2h8OTl8fGZ1cm5pdHVyZXN8ZW58MHwxfDB8YmxhY2t8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'
32+
}
33+
];
34+
35+
late final AnimationController _controller = AnimationController(
36+
duration: const Duration(seconds: 20),
37+
vsync: this
38+
)..repeat(reverse: true);
39+
40+
late final Animation<double> _animation = Tween<double>(
41+
begin: 1.0,
42+
end: 1.5
43+
).animate(CurvedAnimation(
44+
parent: _controller,
45+
curve: Curves.linear
46+
));
47+
48+
@override
49+
void dispose() {
50+
super.dispose();
51+
_controller.dispose();
52+
}
53+
54+
@override
55+
Widget build(BuildContext context) {
56+
return Scaffold(
57+
body: PageView.builder(
58+
onPageChanged: (int index) {
59+
_controller.value = 0.0;
60+
_controller.forward();
61+
},
62+
itemBuilder: (context, index) {
63+
return Container(
64+
child: Stack(
65+
children: [
66+
Container(
67+
height: MediaQuery.of(context).size.height,
68+
width: MediaQuery.of(context).size.width,
69+
clipBehavior: Clip.hardEdge,
70+
decoration: BoxDecoration(),
71+
child: ScaleTransition(
72+
scale: _animation,
73+
child: Image.network(
74+
_furnitures[index]['image'],
75+
fit: BoxFit.cover,
76+
),
77+
),
78+
),
79+
Positioned(
80+
bottom: 0,
81+
child: Container(
82+
padding: EdgeInsets.all(20),
83+
width: MediaQuery.of(context).size.width,
84+
height: MediaQuery.of(context).size.height,
85+
decoration: BoxDecoration(
86+
gradient: LinearGradient(
87+
begin: Alignment.bottomRight,
88+
colors: [
89+
Colors.black.withOpacity(0.9),
90+
Colors.black.withOpacity(0.8),
91+
Colors.black.withOpacity(0.2),
92+
Colors.black.withOpacity(0.1)
93+
]
94+
)
95+
),
96+
child: Column(
97+
mainAxisAlignment: MainAxisAlignment.end,
98+
crossAxisAlignment: CrossAxisAlignment.start,
99+
children: [
100+
FadeInDown(
101+
duration: Duration(milliseconds: 500),
102+
child: Text(_furnitures[index]['title'],
103+
style: TextStyle(
104+
color: Colors.white,
105+
fontSize: 42,
106+
fontWeight: FontWeight.bold
107+
),
108+
),
109+
),
110+
SizedBox(height: 10,),
111+
FadeInDown(
112+
delay: Duration(milliseconds: 100),
113+
duration: Duration(milliseconds: 800),
114+
child: Text(_furnitures[index]['sub_title'],
115+
style: TextStyle(
116+
color: Colors.grey.shade400,
117+
fontSize: 18,
118+
),
119+
)
120+
),
121+
SizedBox(height: 50,),
122+
FadeInLeft(
123+
delay: Duration(milliseconds: 100),
124+
duration: Duration(milliseconds: 1000),
125+
child: Align(
126+
alignment: Alignment.bottomRight,
127+
child: MaterialButton(
128+
shape: RoundedRectangleBorder(
129+
borderRadius: BorderRadius.circular(40)
130+
),
131+
onPressed: () {},
132+
color: Colors.orange,
133+
padding: EdgeInsets.only(right: 5, left: 30, top: 5, bottom: 5),
134+
child: Container(
135+
height: 40,
136+
width: MediaQuery.of(context).size.width * 0.4,
137+
child: Row(
138+
children: [
139+
Text('Get Started',
140+
style: TextStyle(
141+
color: Colors.orange.shade50,
142+
fontSize: 16,
143+
),
144+
),
145+
Spacer(),
146+
Container(
147+
padding: EdgeInsets.all(8),
148+
decoration: BoxDecoration(
149+
color: Colors.orange.shade300,
150+
borderRadius: BorderRadius.circular(40)
151+
),
152+
child: Icon(Icons.arrow_forward, color: Colors.orange.shade100,)
153+
),
154+
],
155+
),
156+
)
157+
),
158+
),
159+
),
160+
SizedBox(height: 50),
161+
]
162+
)
163+
),
164+
)
165+
],
166+
),
167+
);
168+
},
169+
itemCount: _furnitures.length,
170+
controller: PageController(viewportFraction: 1.0),
171+
),
172+
);
173+
}
174+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /