From 6127ec88db3fdecc31cccb46c61ac8377332a232 Mon Sep 17 00:00:00 2001 From: Lucas Delanier Date: Tue, 11 Oct 2022 17:11:34 +0200 Subject: [PATCH] nouvelle page de swipe plus propre avec bouton 'infos' implementation des boutons --- .../assets/images/default_background.png | Bin 0 -> 2875 bytes daflmusic/assets/images/icon_discovery.png | Bin 0 -> 5984 bytes daflmusic/assets/images/icon_dislike.png | Bin 0 -> 1935 bytes daflmusic/assets/images/icon_like.png | Bin 0 -> 1367 bytes daflmusic/lib/homePage/main_homepage.dart | 2 + daflmusic/lib/main.dart | 196 +++++++++++-- daflmusic/lib/mainPage/main_mainpage.dart | 36 ++- .../lib/signUpPage/main_signUp_page.dart | 2 + daflmusic/lib/widgets/DaflCard.dart | 159 ++++++++++ daflmusic/lib/widgets/spots.dart | 271 ++++++++++-------- 10 files changed, 507 insertions(+), 159 deletions(-) create mode 100644 daflmusic/assets/images/default_background.png create mode 100644 daflmusic/assets/images/icon_discovery.png create mode 100644 daflmusic/assets/images/icon_dislike.png create mode 100644 daflmusic/assets/images/icon_like.png create mode 100644 daflmusic/lib/widgets/DaflCard.dart diff --git a/daflmusic/assets/images/default_background.png b/daflmusic/assets/images/default_background.png new file mode 100644 index 0000000000000000000000000000000000000000..c27ecceba6c7fe001df45bd7ed6acb33ad38fddd GIT binary patch literal 2875 zcmeAS@N?(olHy`uVBq!ia0y~yU@T`~VAkPa1B$E{d-NDcaTa()7Bet#3xhBt!>l*8o|0J?9FmPS)ba4!+V0?RpQIJ7_hhbr6+t>B0 zZ2u{+q?g}km{7#tAhVO1<)o~F$2$hcB6f~R)(#WyFg88m6HqB{P#BdO4UN&XF`6Al u3y0D2aI|(9tq@0>2cs>bfo&1JV7?#5KKa3xzOTTxE`z75pUXO@geCxXAF?O_ literal 0 HcmV?d00001 diff --git a/daflmusic/assets/images/icon_discovery.png b/daflmusic/assets/images/icon_discovery.png new file mode 100644 index 0000000000000000000000000000000000000000..d3dc70c5905afaa8ac94a67fc6d2526d0e5d803d GIT binary patch literal 5984 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 Lqx(%-PVxT((4>Xc literal 0 HcmV?d00001 diff --git a/daflmusic/assets/images/icon_dislike.png b/daflmusic/assets/images/icon_dislike.png new file mode 100644 index 0000000000000000000000000000000000000000..7196a46d7e63357be66e446d16c96d02b2075962 GIT binary patch literal 1935 zcmV;A2XOd_P)EK~#7F?VXKv z+cpr#q4zp~x&g9*GeOx2q7AG}Aaw#O6Ihu*&IEQRpgV!x38)R6PVg@-JeWraAR&pC zMEid4!4%0OaKPc4fH^Tr767L1aOE5wpC^;a)+p~2XKd?Sg$DXv7-cwIg3g>PoqKX_ zLy2zAK*ZRd7cTY6vABesM-sR?wb46_?J10MJY1@APNP%l?a)IFJ|tXS;+#g$Fm`2> zVL;t>cR?BA%DfS%`wTdDru#6UzwPu~n}KnD-l(z9z#c|lnt{kL_M6r$AD%soeq)X# z!`M(`pMX;s-95X=@PBTU(}27o5^-zx1oZ?@A1kAr9+&WU8OGTla|X=GU7>pjsK!1w z&H!ul^VDZ_)J=sNdkl~v&`*WL@CkYSg0)dDheM5?Y3zHWTprFaOYC8E)SbVoN4~c? zP|gVAZ`NW)FOV@muErh#$m?zAWD0APae({@8a4KN;XtFmsIf=Po<`S~A@6}bjJ`3- z_;H53Mm}ovF@w6tzAq(oI5s|T-0+OX=+-FX0LKl>Je3-K1Y{bUUacPW(nYxdGL8Kt zk)Y~tA~oM|bvasU`$vj9%GDpolH47gc9 zjegYeOq&IeKP#t3 z9}1j#vp}ZNS4KG=T*zht^e=@jjdDEbpYuN1W&zeERnt5e<#>8Z*2z0eNcSalzI_N# zZybnG;Y=MR)XhxEI?%B&%5Y$}(?khvjdCy(bK$Uo3+J|z$>h-}ilQirq9}@@D2k#e zilQirqA1ExT>RTIWqDf5L#zvo!dJ1rx_Ex z^5q^USp1LnI=Yn^A!v5zL>G%pSg3FZzb$sk&O?<$nxK1w#q08Gbnj**U5mia)Vlc!Vc!S+2A{|7qc&hHpp6U!-TT8j_gtf$&;?&x z1rdrtVcNt!2>)-9<|(0vWX|_1`5fAXgzilv{!l!8r}Xt&B+b_xmw7_BD&prV^m8AB z%S{36h(i7w-&HISah;9}c2c%5X@jpqIqVvIj@^XwdfMPR$xS2iuEce@dvqBwlnm3? zaIttVBmPu;E)7OHZrH`bvw@#0G#MjlJ2W-KOSZwWTLoPU&t9&@yH}{kN zRR-lUU)832k!h@XJBq~hoXH+3vlYL8vLpVbKOEOjoOWM0TzZ}g0cEP+oy?kLsr0Ue zoR_6%t*K|xc1^&DazaojT60)*`b&SDReenqVxaa3BcE4j*vg}&KV;S+Ii0CN|@q%WTspkvJ z$&6mHK61$FJH-XsRDs+&hHz>OZg1yoYfj@vs{>{_YqlZ1~53^+ldF_TaSy3 z#HtYQ9DRxCN&ehL{GfO)JL1$OM}C$Oot7Qp%h6Mb*pL^889esCN-MN;deNb{m!I{7 zGZ(VHl+4hKA{K#s$!;C-rxXcs6}f+pCi7lL;yY(&JM^`zpPzZ0Cgi9f6zn=jEohp> zoDO6selDFnTA8{NQ{}!HL$j5ajx@NZ=lq;B(VCNHdEa4sPQJ}i6h%=KMNyQG%>Tef V2{`Be^pF4m002ovPDHLkV1hVVtSbNj literal 0 HcmV?d00001 diff --git a/daflmusic/assets/images/icon_like.png b/daflmusic/assets/images/icon_like.png new file mode 100644 index 0000000000000000000000000000000000000000..d5297d9756a078744f9f1a541083e95f823999f5 GIT binary patch literal 1367 zcmV-d1*rOoP)Y}_hkN;cn+lE&;#3e)!R=LGUj^}1U^-Y|1$HWkQvu!z>{NhL!8#R8G|Pw#LV&=+ zW;go1r)MLikw$-p5l9hu0uf{NGgIM?qfQi}C^|t;lq{0-L4~(0@2tX+t%X6W80ZWI?;PuLF0o5L+&MY<|zR(9DS>%ONfEiZ-vM9>pe5DmAD3irmXatQKu z4AtSTS*s!XpOCjwKdD95PKEC(JV7zc->HyToLcEebGu`*2IevA*~jXQhQz&y2X(qZ(KbQ(=GZXG4MJO6dWv2=%B@zW>!#L&2uv zE4TuxoS9MXb*GqNLIH1^+HflV^cbMs zc}Z|;?xk-misP$RSYsK^dbr2%nlTL5bQTa}!$bYkZ=-M^5C{YUfj}S-2n0-cO}rSg z_~&in*r&7#mj`|cI z$0wY0YdhVC#fJjg1|mD=(fK4GR=+^%V?{JC*QOCe`{A^MOlQpLOvGz;SU<%>G83$S zDIw-Y9p-31)Rv>``#7wAZ{D<|TN#zijqBJ^Y0Uxcl|PuW8yb}IQpao!#k)TjxhRd* z;{>H(E>yGZp>!`M0zg z>RQT^`_E&e43hQ8jYdQIB+@=NTyH~W!bD=Vp65l%XXasd^VApe&0U}rBzxOh(1T{!k&Lmw)khIdA{gM?p%%pXn0Pgd`ZfFWaTK{ z{~qiDTm7hP-P`}P>7eH{_0)!gH0`nY|D!>MO#f9B)@>>4xaP4b^i}-Ngn=VN`ydVR z8<9a*exnl5`R2b=SPDTquyYds=lJU}BJ;kriYlE zq2kuav6-~3G_3C}K||g_q%H4@xH4^v+*rid9z#Nprn;2rB9VcFrcjuEYAJ1ywk{{p zv2aiI^YI%LEiY}wn&*1T*W{+IId7Rx#chSmgySjg-l%KLmq&B{V&N;yL^($Y1OkEA Z#80_gfeJ||4Iuyk002ovPDHLkV1iOanxy~$ literal 0 HcmV?d00001 diff --git a/daflmusic/lib/homePage/main_homepage.dart b/daflmusic/lib/homePage/main_homepage.dart index 1779a50..d17bc80 100644 --- a/daflmusic/lib/homePage/main_homepage.dart +++ b/daflmusic/lib/homePage/main_homepage.dart @@ -97,6 +97,8 @@ class _MainHomePage extends State { onTap: (){ Navigator.of(context).push( PageTransition( + duration: Duration(milliseconds: 300), + reverseDuration: Duration(milliseconds: 300), type: PageTransitionType.rightToLeftJoined, childCurrent: widget, child: MainSignInPage()), diff --git a/daflmusic/lib/main.dart b/daflmusic/lib/main.dart index 22445f2..d8746bf 100644 --- a/daflmusic/lib/main.dart +++ b/daflmusic/lib/main.dart @@ -1,40 +1,194 @@ +import 'dart:math'; + import 'package:daflmusic/mainPage/main_mainpage.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:daflmusic/signInPage/main_signIn_page.dart'; import 'package:daflmusic/homePage/main_homepage.dart'; import 'package:daflmusic/signUpPage/main_signUp_page.dart'; +import 'package:fluttertoast/fluttertoast.dart'; +import 'package:provider/provider.dart'; void main() { - runApp(const MyApp()); + runApp(MyApp()); } class MyApp extends StatelessWidget { - const MyApp({super.key}); // This widget is the root of your application. @override - Widget build(BuildContext context) { - SystemChrome.setEnabledSystemUIMode( - SystemUiMode.immersiveSticky - ); - return MaterialApp( - debugShowCheckedModeBanner: false, - title: 'Flutter Demo', - theme: ThemeData( - // This is the theme of your application. - // - // Try running your application with "flutter run". You'll see the - // application has a blue toolbar. Then, without quitting the app, try - // changing the primarySwatch below to Colors.green and then invoke - // "hot reload" (press "r" in the console where you ran "flutter run", - // or simply save your changes to "hot reload" in a Flutter IDE). - // Notice that the counter didn't reset back to zero; the application - // is not restarted. - primarySwatch: Colors.blue, + Widget build(BuildContext context){ + SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky); + return ChangeNotifierProvider( + create: (context) => CardProvider(), + child: MaterialApp( + debugShowCheckedModeBanner: false, + title: 'Flutter Demo', + home: MainHomePage(), ), - home: MainHomePage(), ); } +} + +enum CardStatus { like, disLike, discovery} + +class CardProvider extends ChangeNotifier{ + List _urlImages = []; + bool _isDragging = false; + double _angle = 0; + Offset _position = Offset.zero; + Size _screenSize = Size.zero; + + List get urlImages => _urlImages; + bool get isDragging => _isDragging; + Offset get position => _position; + double get angle => _angle; + + CardProvider() { + resetUsers(); + } + + void resetUsers() { + _urlImages = [ + 'https://khaligidilit.com/assets/images/cover-LAI%CC%88LA-Khali.jpeg', + 'https://m.media-amazon.com/images/I/61aUOMzwS8L._SL1440_.jpg', + 'https://pbs.twimg.com/media/ExJ-My-XMAE3Ko2.jpg', + 'https://cdns-images.dzcdn.net/images/cover/2818a661c6d533155ce6dffc256b1f51/500x500.jpg', + 'https://cdns-images.dzcdn.net/images/cover/b351f0e935c9c3901f8d893b92ab952a/500x500.jpg', + 'https://cdns-images.dzcdn.net/images/cover/65147b581f2ace9e0f0723ee76e70fda/500x500.jpg', + 'https://images.genius.com/a8b6d39d8b10d7441527e2f5cf6b6ca5.1000x1000x1.jpg', + 'https://cdns-images.dzcdn.net/images/cover/17a9747927ac3e5ea56f92f635d9180c/500x500.jpg', + ].reversed.toList(); + + notifyListeners(); + } + + void setScreenSize(Size screenSize) => _screenSize = screenSize; + + void startPosition(DragStartDetails details) { + _isDragging = true; + + notifyListeners(); + } + + void updatePosition(DragUpdateDetails details) { + _position += details.delta; + + final x = _position.dx; + _angle = 45 * x / _screenSize.width; + notifyListeners(); + } + + void endPosition() { + _isDragging = false; + notifyListeners(); + + final status = getStatus(force: true); + + + switch (status) { + case CardStatus.like: + like(); + break; + case CardStatus.disLike: + dislike(); + break; + case CardStatus.discovery: + discovery(); + break; + default: + resetPosition(); + } + } + void resetPosition() { + _isDragging = false; + _position = Offset.zero; + _angle = 0; + + notifyListeners(); + } + + double getStatusOpacity() { + final delta = 100; + final pos = max(_position.dx.abs(), _position.dy.abs()); + final opacity = pos / delta; + + return min(opacity, 1); + } + + CardStatus? getStatus({bool force = false}) { + final x = _position.dx; + final y = _position.dy; + final forceDiscovery = x.abs() < 20; + + if(force) { + final delta = 100; + + if (x >= delta) { + return CardStatus.like; + } else if ( x <= -delta){ + return CardStatus.disLike; + } else if ( y <= -delta / 2 && forceDiscovery){ + return CardStatus.discovery; + } + } else{ + final delta = 20; + + if(y <= -delta * 2 && forceDiscovery) { + return CardStatus.discovery; + } else if ( x >= delta) { + return CardStatus.like; + } else if ( x <= -delta) { + return CardStatus.disLike; + } + } + } + void dislike() { + print("dislike"); + _angle = -20; + _position -= Offset(2 * _screenSize.width, 0); + _nextCard(); + + notifyListeners(); + } + + void discovery() { + print("discovery"); + _angle = 0; + _position -= Offset(0, _screenSize.height); + _discovery_card(); + Fluttertoast.showToast( + msg: 'Ajouté', + toastLength: Toast.LENGTH_SHORT, + gravity: ToastGravity.TOP, + timeInSecForIosWeb: 2, + backgroundColor: Colors.deepPurple, + textColor: Colors.white + ); + + notifyListeners(); + } + + void like() { + print("like"); + _angle = 20; + _position += Offset(2 * _screenSize.width, 0); + _nextCard(); + + notifyListeners(); + } + + Future _nextCard() async { + if ( _urlImages.isEmpty) return; + + await Future.delayed(Duration(milliseconds: 200)); + _urlImages.removeLast(); + resetPosition(); + } + + Future _discovery_card() async { + await Future.delayed(Duration(milliseconds: 200)); + resetPosition(); + } } \ No newline at end of file diff --git a/daflmusic/lib/mainPage/main_mainpage.dart b/daflmusic/lib/mainPage/main_mainpage.dart index b22bd17..a47dbb9 100644 --- a/daflmusic/lib/mainPage/main_mainpage.dart +++ b/daflmusic/lib/mainPage/main_mainpage.dart @@ -27,6 +27,7 @@ class _MainMainPageState extends State { ]; @override Widget build(BuildContext context) { + double height = MediaQuery.of(context).size.height; return Scaffold( body: screens[index], bottomNavigationBar: NavigationBarTheme( @@ -36,20 +37,27 @@ class _MainMainPageState extends State { TextStyle(fontSize: 12, fontWeight: FontWeight.w400, color: Colors.grey) ), ), - child: NavigationBar( - animationDuration: Duration(seconds: 1), - selectedIndex: index, - onDestinationSelected: (index) => - setState(() => this.index = index), - backgroundColor: Color(0xFF232123), - destinations: [ - NavigationDestination(icon: Icon(Icons.person_outline, color: Colors.grey,), label: 'Profil', selectedIcon: Icon(Icons.person, color: Colors.white,),), - NavigationDestination(icon: Icon(Icons.bookmark_border, color: Colors.grey,), selectedIcon: Icon(Icons.bookmark, color: Colors.white,), label: 'Discovery'), - NavigationDestination(icon: Icon(MyFlutterApp.Spots_outline, color: Colors.grey), selectedIcon: Icon(MyFlutterApp.Spots, color: Colors.white), label: 'Spots',), - NavigationDestination(icon: Icon(MyFlutterApp.podium_outine, color: Colors.grey,), label: 'Tops', selectedIcon: Icon(MyFlutterApp.podium, color: Colors.white,),), - NavigationDestination(icon: Icon(Icons.mail_outline, color: Colors.grey,), label: 'Messages', selectedIcon: Icon(Icons.email, color: Colors.white,),), - ], - ), + child: ConstrainedBox( + constraints: BoxConstraints( + minHeight: height*0.1, + maxHeight: 100, + ), + child: NavigationBar( + animationDuration: Duration(seconds: 1), + selectedIndex: index, + height: height*0.1, + onDestinationSelected: (index) => + setState(() => this.index = index), + backgroundColor: Color(0xFF232123), + destinations: [ + NavigationDestination(icon: Icon(Icons.person_outline, color: Colors.grey,), label: 'Profil', selectedIcon: Icon(Icons.person, color: Colors.white,),), + NavigationDestination(icon: Icon(Icons.bookmark_border, color: Colors.grey,), selectedIcon: Icon(Icons.bookmark, color: Colors.white,), label: 'Discovery'), + NavigationDestination(icon: Icon(MyFlutterApp.Spots_outline, color: Colors.grey), selectedIcon: Icon(MyFlutterApp.Spots, color: Colors.white), label: 'Spots',), + NavigationDestination(icon: Icon(MyFlutterApp.podium_outine, color: Colors.grey,), label: 'Tops', selectedIcon: Icon(MyFlutterApp.podium, color: Colors.white,),), + NavigationDestination(icon: Icon(Icons.mail_outline, color: Colors.grey,), label: 'Messages', selectedIcon: Icon(Icons.email, color: Colors.white,),), + ], + ), + ), ), ); } diff --git a/daflmusic/lib/signUpPage/main_signUp_page.dart b/daflmusic/lib/signUpPage/main_signUp_page.dart index 526ed87..bcd641c 100644 --- a/daflmusic/lib/signUpPage/main_signUp_page.dart +++ b/daflmusic/lib/signUpPage/main_signUp_page.dart @@ -238,6 +238,8 @@ class _MainSignUpPageState extends State { }); Navigator.of(context).push( PageTransition( + duration: Duration(milliseconds: 300), + reverseDuration: Duration(milliseconds: 300), type: PageTransitionType.leftToRightJoined, childCurrent: widget, child: MainHomePage()), diff --git a/daflmusic/lib/widgets/DaflCard.dart b/daflmusic/lib/widgets/DaflCard.dart new file mode 100644 index 0000000..2d3b914 --- /dev/null +++ b/daflmusic/lib/widgets/DaflCard.dart @@ -0,0 +1,159 @@ +import 'dart:math'; + +import 'package:daflmusic/dafl_card.dart'; +import 'package:daflmusic/main.dart'; +import 'package:flutter/material.dart'; +import 'package:provider/provider.dart'; +class User{ + final String chanteur; + final String titre; + final String urlImage; + + const User({ + required this.chanteur, + required this.titre, + required this.urlImage, +}); +} + + + +class DaflCard extends StatefulWidget { + final String urlImage; + final bool isFront; + + const DaflCard({ + Key? key, + required this.urlImage, + required this.isFront, + }) : super(key: key); + + @override + State createState() => _DaflCardState(); +} +class _DaflCardState extends State{ + @override + void initState() { + super.initState(); + + WidgetsBinding.instance!.addPostFrameCallback((_) { + final size = MediaQuery.of(context).size; + + final provider = Provider.of(context, listen: false); + provider.setScreenSize(size); + }); + } + @override + Widget build(BuildContext context) => SizedBox.expand( + child: widget.isFront ? buildFrontCard() : buildCard(), + ); + + Widget buildCard() => ClipRRect( + borderRadius: BorderRadius.circular(20), + child: Container( + decoration: BoxDecoration( + image: DecorationImage( + image: NetworkImage(widget.urlImage), + fit: BoxFit.cover, + alignment: Alignment(0,0), + ), + + borderRadius: BorderRadius.all(Radius.circular(20)) + ), + ), + ); + + Widget buildStamps() { + final provider = Provider.of(context); + final status = provider.getStatus(); + final opacity = provider.getStatusOpacity(); + + switch (status) { + case CardStatus.like: + final child = buildStamp(image: 'assets/images/icon_like.png', opacity: opacity); + return child; + case CardStatus.disLike: + final child = buildStamp(image: 'assets/images/icon_dislike.png', opacity: opacity); + return child; + case CardStatus.discovery: + final child = buildStamp(image: 'assets/images/icon_discovery.png', opacity: opacity); + return child; + default: + return Container(); + + } + } + + Widget buildStamp({ + double angle = 0, + required String image, + required double opacity, +}) { + return Opacity(opacity: opacity, + child: ClipRRect( + borderRadius: BorderRadius.circular(20), + child: Container( + decoration: BoxDecoration( + color: Colors.black.withOpacity(0.7), + border: Border.all(color: Color(0xFF3F1DC3), width: 6), + + borderRadius: BorderRadius.all(Radius.circular(20)) + ), + child: Center( + child: Image.asset( + image, + width: 100, + ), + + ), + ), + ),); + } + + Widget buildFrontCard() => GestureDetector( + child: LayoutBuilder( + builder: (context, constraints) { + final provider = Provider.of(context); + final position = provider.position; + final milliseconds = provider.isDragging ? 0 : 400; + + final center = constraints.smallest.center(Offset.zero); + final angle = provider.angle * pi / 180; + final rotatedMatrix = Matrix4.identity() + ..translate(center.dx, center.dy) + ..rotateZ(angle) + ..translate(-center.dx, -center.dy); + + return AnimatedContainer( + curve: Curves.easeInOut, + duration: Duration(milliseconds: milliseconds), + transform: rotatedMatrix..translate(position.dx, position.dy), + child: Stack( + children: [ + buildCard(), + buildStamps(), + ], + ), + ); + }, + ), + onPanStart: (details) { + final provider = Provider.of(context, listen: false); + + provider.startPosition(details); + }, + onPanUpdate: (details) { + final provider = Provider.of(context, listen: false); + + provider.updatePosition(details); + }, + onPanEnd: (details) { + final provider = Provider.of(context, listen: false); + + provider.endPosition(); + }, + + + + ); +} \ No newline at end of file diff --git a/daflmusic/lib/widgets/spots.dart b/daflmusic/lib/widgets/spots.dart index ba73bf3..79f373c 100644 --- a/daflmusic/lib/widgets/spots.dart +++ b/daflmusic/lib/widgets/spots.dart @@ -1,8 +1,15 @@ +import 'dart:ui'; + import 'package:animations/animations.dart'; -import 'package:daflmusic/dafl_card.dart'; +import 'package:daflmusic/homePage/main_homepage.dart'; +import 'package:daflmusic/main.dart'; +import 'package:daflmusic/mainPage/main_mainpage.dart'; +import 'package:daflmusic/widgets/DaflCard.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; -import 'package:flutter_swipable/flutter_swipable.dart'; +import 'package:provider/provider.dart'; +import 'package:fluttertoast/fluttertoast.dart'; + class Spots extends StatefulWidget { const Spots({Key? key}) : super(key: key); @@ -13,20 +20,16 @@ class Spots extends StatefulWidget { class _SpotsState extends State { - List pileCarte = [ - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - DaflCard(color: Colors.red), - ]; + final user = User( + chanteur: 'Khali', + titre: 'COULEURS', + urlImage: 'https://khaligidilit.com/assets/images/cover-LAI%CC%88LA-Khali.jpeg', + ); @override Widget build(BuildContext context) { double height = MediaQuery.of(context).size.height; double width = MediaQuery.of(context).size.width; + final provider = Provider.of(context); return Scaffold( resizeToAvoidBottomInset: false, @@ -35,129 +38,149 @@ class _SpotsState extends State { height: double.maxFinite, child: Stack( children: [ - Image.asset( - 'assets/images/image_blur.png', - height: double.infinity, - width: double.infinity, - fit: BoxFit.cover, - ), - Column( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - - Stack( - children: [ - Center( - child: Container( - decoration: BoxDecoration( - boxShadow: [ - BoxShadow( - color: Colors.black.withOpacity(0.25), - spreadRadius: 0, - blurRadius: 10, - offset: Offset(0, 3), // changes position of shadow - ), - ], - - borderRadius: BorderRadius.all(Radius.circular(20)) - ), - margin: EdgeInsets.fromLTRB(34, height*0.1, 34, 0), - height: height*0.66, - width: 565, - child: Stack(children: - pileCarte, - ), - ), - ), - IgnorePointer(child: Container(height: 200, - decoration: BoxDecoration( - gradient: LinearGradient( - colors: [Colors.black, Colors.transparent], - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - ) - - ),),), - Padding(padding: EdgeInsets.fromLTRB(20, 60, 0, 0), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text('COULEURS',style: TextStyle(fontFamily: 'DMSans', color: Colors.white.withOpacity(1) ,fontSize: 20, fontWeight: FontWeight.w800),), - Text('Khali',style: TextStyle(fontFamily: 'DMSans', color: Colors.white.withOpacity(1) ,fontSize: 17, fontWeight: FontWeight.w200),), - ], - ),), - - ], - ), - Padding( - padding: EdgeInsets.fromLTRB(0, height*0.03, 0,0), - child: Align( - alignment: FractionalOffset.bottomCenter, - child: OpenContainer( - - closedColor: Colors.transparent, - closedElevation: 0, - transitionDuration: Duration(milliseconds: 400), - closedBuilder: (context, openWidget){ - return PreviewInfo(); - }, - openBuilder: (context, closeWidget){ - return Destination(); - }, - ), - ), - ), - - ], - ), - Positioned( - top: height*0.71, - width: width, - child: Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - GestureDetector( - onTap: () { - pileCarte.remove(0); - print("remove"); - }, - child: Image.asset( - 'assets/images/bouton_dislike.png', - height: 70, - width: 70, + Transform.scale(scale: 1.1, + child: Container( + decoration: BoxDecoration( + image: DecorationImage( + image: NetworkImage(provider.urlImages.isEmpty != true + ?provider.urlImages.last + :"https://www.colorhexa.com/141414.png"), fit: BoxFit.cover, + ), ), - SizedBox( - width: width*0.1, - ), - GestureDetector( - child: Image.asset( - 'assets/images/bouton_discovery.png', - height: 70, - width: 70, - fit: BoxFit.cover, + child: BackdropFilter(filter: ImageFilter.blur(sigmaX: 20.0, sigmaY: 20.0), + child: Container( + decoration: BoxDecoration(color: Colors.black.withOpacity(0.4)), + ),), + ),), + Padding( + padding: EdgeInsets.fromLTRB(0, 0, 0,height*0.03), + child: Align( + alignment: FractionalOffset.bottomCenter, + child: OpenContainer( + + closedColor: Colors.transparent, + closedElevation: 0, + transitionDuration: Duration(milliseconds: 400), + closedBuilder: (context, openWidget){ + return PreviewInfo(); + }, + openBuilder: (context, closeWidget){ + return Destination(); + }, ), ), - SizedBox( - width: width*0.1, + ), + Positioned( + top: height*0.65, + width: width, + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + GestureDetector( + onTap: () { + final provider = Provider.of(context, listen: false); + provider.dislike(); + }, + child: Image.asset( + 'assets/images/bouton_dislike.png', + height: 90, + width: 90, + fit: BoxFit.cover, + ), + ), + SizedBox( + width: width*0.1, + ), + GestureDetector( + onTap: () { + final provider = Provider.of(context, listen: false); + provider.discovery(); + }, + child: Image.asset( + 'assets/images/bouton_discovery.png', + height: 90, + width: 90, + fit: BoxFit.cover, + ), + ), + SizedBox( + width: width*0.1, + ), + GestureDetector( + onTap: () { + final provider = Provider.of(context, listen: false); + provider.like(); + }, + child: Image.asset( + 'assets/images/bouton_like.png', + height: 90, + width: 90, + fit: BoxFit.cover, + ), + ), + ], ), - GestureDetector( - child: Image.asset( - 'assets/images/bouton_like.png', - height: 70, - width: 70, - fit: BoxFit.cover, + ), + Align( + child:Container( + width: 400, + height: height*0.8, + margin: EdgeInsets.fromLTRB(width*0.09,height/5,width*0.09,height/3.7), + + child: Container( + decoration: BoxDecoration( + boxShadow: [ + BoxShadow( + color: Colors.black.withOpacity(0.25), + spreadRadius: 2, + blurRadius: 10, + offset: Offset(0, 3), // changes position of shadow + ), + ], + ), + child: buildCards(), + ) + ) , ), - ), - ], - ), - ), + IgnorePointer(child: Container(height: 200, + decoration: BoxDecoration( + gradient: LinearGradient( + colors: [Colors.black, Colors.transparent], + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + ) + + ),),), + Padding(padding: EdgeInsets.fromLTRB(20, 60, 0, 0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text('COULEURS',style: TextStyle(fontFamily: 'DMSans', color: Colors.white.withOpacity(1) ,fontSize: 20, fontWeight: FontWeight.w800),), + Text('Khali',style: TextStyle(fontFamily: 'DMSans', color: Colors.white.withOpacity(1) ,fontSize: 17, fontWeight: FontWeight.w200),), + ], + ),), ], ), ) ); } + + Widget buildCards() { + final provider = Provider.of(context); + final urlImages = provider.urlImages; + + return Stack( + children: urlImages + .map((urlImage) => DaflCard( + urlImage: urlImage, + isFront: urlImages.last == urlImage, + )) + .toList(), + ); + } + } class Destination extends StatelessWidget{ @@ -641,7 +664,7 @@ class PreviewInfo extends StatelessWidget{ double height = MediaQuery.of(context).size.height; return Container( width: 200, - height: height*0.10, + height: height*0.08, decoration: BoxDecoration( color: Color(0xFF24243A).withOpacity(0.24), border: Border.all(width: 0, color: Colors.grey.withOpacity(0)),