import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:ysairplane/code/YSComment.dart'; import 'package:ysairplane/tools/YSTools.dart'; class YSSightseeingPlaneDetail extends StatefulWidget { @override _YSSightseeingPlaneDetailState createState() => _YSSightseeingPlaneDetailState(); } class _YSSightseeingPlaneDetailState extends State { @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Color(0xFFF1F2F3), body: SingleChildScrollView( padding: EdgeInsets.all(0), child: Stack( children: [ Container( height: MediaQuery.of(context).padding.top+hsp(370), width: MediaQuery.of(context).size.width, color: Colors.lightGreen, ), GestureDetector( onTap: (){ Navigator.pop(context); }, child: Container( margin: EdgeInsets.only(left: hsp(30),right: wsp(30),top: MediaQuery.of(context).padding.top+hsp(50)), child: Icon(Icons.arrow_back_ios,color: Colors.white,size: hsp(50),), ), ), Container( margin: EdgeInsets.only(left: MediaQuery.of(context).size.width-hsp(150),top: MediaQuery.of(context).padding.top+hsp(50)), child: Row( children: [ GestureDetector( child: Icon(Icons.star_half,size: zsp(50),color: Colors.white,), onTap: (){ showModalBottomSheet( backgroundColor: Colors.transparent, isScrollControlled: true, context: context, builder: (context){ return Container( height: MediaQuery.of(context).size.height, child: Column( children: [ Container( margin: EdgeInsets.only(top: hsp(100),left: hsp(75),right: hsp(75),bottom: hsp(50)), decoration: BoxDecoration( color: Colors.lightGreen, borderRadius: BorderRadius.all(Radius.circular(10)) ), height: MediaQuery.of(context).size.height-hsp(450), ), Container( height: hsp(300), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.only(topLeft: Radius.circular(10),topRight: Radius.circular(10)) ), child: Column( children: [ Container( height: hsp(100), padding: EdgeInsets.only(left: 15,right: 15), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Container(), Text('分享到',style: TextStyle(fontSize: 15,color: Color(0xFF000000),decoration: TextDecoration.none,fontWeight: FontWeight.bold),), GestureDetector(child: Icon(Icons.close,size: 20,color: Color(0xFF000000),),onTap: (){Navigator.pop(context);},) ], ), ), Divider(height: 0.5,thickness: 0.5,color: Color(0x1A000000),), Container( height: hsp(200)-0.5, child: Row( children: [ GestureDetector( child: Container( width: MediaQuery.of(context).size.width/2-0.25, height: hsp(150), child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Image( image: AssetImage('lib/images/wexinLogo.png'), height: 30, width: 30 ), Text('微信好友',style: TextStyle(fontSize: 15,color: Color(0xFF81858C),decoration: TextDecoration.none),), ], ), ), onTap: (){ Navigator.pop(context); }, ), Container( height: hsp(100), width: 0.5, color: Color(0x1A000000) ), GestureDetector( onTap: (){ Navigator.pop(context); }, child: Container( width: MediaQuery.of(context).size.width/2-0.25, height: hsp(150), child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Image( image: AssetImage('lib/images/aliLogo.png'), height: 30, width: 30 ), Text('生成海报',style: TextStyle(fontSize: 15,color: Color(0xFF81858C),decoration: TextDecoration.none),), ], ), ), ) ], ), ), ], ), ) ], ), ); } ); }, ), Icon(Icons.star_half,size: zsp(50),color: Colors.white,), ], ), ), Container( margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top+hsp(350)), height: MediaQuery.of(context).size.height-MediaQuery.of(context).padding.top-hsp(460), width: MediaQuery.of(context).size.width, decoration: BoxDecoration( color: Color(0xFFF1F2F4), borderRadius: BorderRadius.only(topRight: Radius.circular(10),topLeft: Radius.circular(10)) ), child: SingleChildScrollView( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( padding: EdgeInsets.only(left: hsp(30),top: hsp(30),bottom: hsp(20),right: hsp(30)), child: Text('周年特惠 | 成都固定翼飞行体验480元/人',style: TextStyle(fontSize: zsp(36),color: Color(0xFF343434),fontWeight: FontWeight.bold),), color: Colors.white, width: MediaQuery.of(context).size.width, ), Container( color: Colors.white, width: MediaQuery.of(context).size.width, child: Row( children: [ Container( width: wsp(70), height: hsp(40), margin: EdgeInsets.only(left: hsp(30)), child: Text('5.0',style: TextStyle(fontSize: zsp(25),color: Colors.white),), alignment: Alignment.center, decoration: BoxDecoration( color: Color(0xFFED5E58), borderRadius: BorderRadius.only(topLeft: Radius.circular(50),bottomLeft: Radius.circular(50)) ), ), GestureDetector( onTap: (){ Navigator.of(context).push( CupertinoPageRoute( builder: (context){ return YSComment(); } ) ); }, child: Container( width: wsp(150), height: hsp(40), child: Text('99条点评 >',style: TextStyle(fontSize: zsp(20),color: Colors.white),), alignment: Alignment.center, decoration: BoxDecoration( color: Color(0xFFFD8B86), borderRadius: BorderRadius.only(bottomRight: Radius.circular(50),topRight: Radius.circular(50)) ), ), ) ], ), ), Container( padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20)), color: Colors.white, width: MediaQuery.of(context).size.width, child: Row( children: [ Icon(Icons.location_on,color: Color(0xFF5E5E5E),size: hsp(35),), Text(' 成都市双流县龙阳山景区',style: TextStyle(fontSize: zsp(23),color: Color(0xFF5E5E5E)),), ], ), ), Divider(height: 0.5,thickness: 0.5,color: Color(0xFFE4E6E7),indent: hsp(30),endIndent: hsp(30),), Container( padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20),right: hsp(30)), color: Colors.white, width: MediaQuery.of(context).size.width, height: hsp(80), child: Row( children: [ RichText( text: TextSpan( text: '明珠航空 ', style: TextStyle(fontSize: zsp(26),color: Color(0xFF3283D9)), children: [ TextSpan( text: '>', style: TextStyle(color: Color(0xFFC1C1C1)), ) ] ), ), Container(width: wsp(40),), RichText( text: TextSpan( text: 'R144 ', style: TextStyle(fontSize: zsp(26),color: Color(0xFF3283D9)), children: [ TextSpan( text: '>', style: TextStyle(color: Color(0xFFC1C1C1)), ) ] ), ) ], ), ), Divider(height: 0.5,thickness: 0.5,color: Color(0xFFE4E6E7),indent: hsp(30),endIndent: hsp(30),), Container( padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20),right: hsp(30)), child: Text('选择套餐',style: TextStyle(fontSize: zsp(30),color: Color(0xFF222222)),), color: Colors.white, width: MediaQuery.of(context).size.width, ), ListView.separated( itemBuilder: (context,index){ return Container( padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20),right: hsp(30)), width: MediaQuery.of(context).size.width, color: Colors.white, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text('直升机体验(最大载客3人, 飞行时长3分钟)',style: TextStyle(fontSize: zsp(24),color: Color(0xFF888888)),), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text('¥599',style: TextStyle(fontSize: zsp(32),color: Color(0xFFEB423B),fontWeight: FontWeight.bold),), Container( height: hsp(40), width: hsp(100), decoration: BoxDecoration( color: Color(0xFFEA4D45), borderRadius: BorderRadius.all(Radius.circular(3)) ), alignment: Alignment.center, child: Text('预订',style: TextStyle(fontSize: zsp(20),color: Colors.white),), ) ], ) ], ), ); }, separatorBuilder: (context,index){ return Divider(height: 0.5,thickness: 0.5,color: Color(0xFFE4E6E7),); }, itemCount: 2, padding: EdgeInsets.all(0), physics: NeverScrollableScrollPhysics(), shrinkWrap: true, ), Container( margin: EdgeInsets.only(top: hsp(10)), width: MediaQuery.of(context).size.width, color: Colors.white, padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20),right: hsp(30)), child: Text('详情',style: TextStyle(fontSize: zsp(30),color: Color(0xFF343434),fontWeight: FontWeight.bold),), ), Container( padding: EdgeInsets.all(hsp(30)), width: MediaQuery.of(context).size.width, color: Colors.white, ), Container( margin: EdgeInsets.only(top: hsp(10)), width: MediaQuery.of(context).size.width, color: Colors.white, padding: EdgeInsets.only(left: hsp(30),bottom: hsp(20),top: hsp(20),right: hsp(30)), child: Text('相关推荐',style: TextStyle(fontSize: zsp(30),color: Color(0xFF343434),fontWeight: FontWeight.bold),), ), Container( padding: EdgeInsets.all(hsp(30)), width: MediaQuery.of(context).size.width, color: Colors.white, ) ], ), ), ), Container( margin: EdgeInsets.only(top: MediaQuery.of(context).size.height-hsp(110)), height: hsp(110), color: Colors.white, padding: EdgeInsets.only(left: wsp(40),right: wsp(40)), alignment: Alignment.center, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Column( mainAxisSize: MainAxisSize.min, children: [ Icon(Icons.headset,color: Color(0xFF666666),size: zsp(40),), Text('咨询',style: TextStyle(fontSize: zsp(22),color: Color(0xFF767676)),) ], ), Column( mainAxisSize: MainAxisSize.min, children: [ Icon(Icons.star_border,color: Color(0xFF666666),size: zsp(40),), Text('加入收藏',style: TextStyle(fontSize: zsp(22),color: Color(0xFF767676)),) ], ), Container( height: hsp(80), width: MediaQuery.of(context).size.width*0.6, decoration: BoxDecoration( color: Color(0xFF007EFF), borderRadius: BorderRadius.all(Radius.circular(50)) ), alignment: Alignment.center, child: Text('立即预订',style: TextStyle(fontSize: zsp(36),color: Colors.white,fontWeight: FontWeight.bold),), ) ], ), ) ], ), ), ); } }