章文轩
4 years ago
parent
6a036667bd
commit
dae2ff4fdc
@ -0,0 +1,110 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_countdown_timer/countdown_timer_controller.dart';
|
||||
import 'package:flutter_countdown_timer/current_remaining_time.dart';
|
||||
import 'package:flutter_countdown_timer/flutter_countdown_timer.dart';
|
||||
import 'package:recook/constants/header.dart';
|
||||
|
||||
class CutDownTimeWidget extends StatefulWidget {
|
||||
CutDownTimeWidget({
|
||||
Key key,
|
||||
}) : super(key: key);
|
||||
|
||||
@override
|
||||
_CutDownTimeWidgetState createState() => _CutDownTimeWidgetState();
|
||||
}
|
||||
|
||||
class _CutDownTimeWidgetState extends State<CutDownTimeWidget> {
|
||||
CountdownTimerController controller;
|
||||
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 600;
|
||||
|
||||
void onEnd() {
|
||||
print('onEnd');
|
||||
}
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
controller = CountdownTimerController(endTime: endTime, onEnd: onEnd);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: 70.rw,
|
||||
height: 20.rw,
|
||||
child: CountdownTimer(
|
||||
controller: controller,
|
||||
onEnd: onEnd,
|
||||
endTime: endTime,
|
||||
widgetBuilder: (_, CurrentRemainingTime time) {
|
||||
if (time == null) {
|
||||
return Container(
|
||||
width: 70.rw,
|
||||
height: 20.rw,
|
||||
child: Row(
|
||||
children: [
|
||||
_time('00'),
|
||||
Text(
|
||||
':',
|
||||
style:
|
||||
TextStyle(color: Color(0xFFC92219), fontSize: 14.rsp),
|
||||
),
|
||||
_time('00'),
|
||||
Text(
|
||||
':',
|
||||
style:
|
||||
TextStyle(color: Color(0xFFC92219), fontSize: 14.rsp),
|
||||
),
|
||||
_time('00'),
|
||||
],
|
||||
),
|
||||
);
|
||||
} else
|
||||
return Container(
|
||||
width: 70.rw,
|
||||
height: 20.rw,
|
||||
child: Row(
|
||||
children: [
|
||||
_time(time.hours != null ? time.hours.toString() : '00'),
|
||||
Text(
|
||||
':',
|
||||
style:
|
||||
TextStyle(color: Color(0xFFC92219), fontSize: 14.rsp),
|
||||
),
|
||||
_time(time.min != null ? time.min.toString() : '00'),
|
||||
Text(
|
||||
':',
|
||||
style:
|
||||
TextStyle(color: Color(0xFFC92219), fontSize: 14.rsp),
|
||||
),
|
||||
_time(time.sec != null ? time.sec.toString() : '00'),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
_time(String time) {
|
||||
return Container(
|
||||
alignment: Alignment.center,
|
||||
width: 20.rw,
|
||||
height: 20.rw,
|
||||
decoration: BoxDecoration(
|
||||
color: Color(0xFFC92219),
|
||||
borderRadius: BorderRadius.all(Radius.circular(1.rw)),
|
||||
),
|
||||
child: Text(
|
||||
time.length == 1 ? '0' + time : time,
|
||||
style: TextStyle(color: Colors.white, fontSize: 14.rsp),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,135 @@
|
||||
import 'package:flustars/flustars.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/rendering.dart';
|
||||
import 'package:recook/utils/date/date_utils.dart';
|
||||
import 'package:recook/widgets/alert.dart';
|
||||
import 'package:recook/widgets/custom_app_bar.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:recook/constants/styles.dart';
|
||||
import 'package:recook/constants/header.dart';
|
||||
import 'package:recook/widgets/recook_back_button.dart';
|
||||
import 'package:velocity_x/velocity_x.dart';
|
||||
|
||||
import 'cut_down_time_widget.dart';
|
||||
|
||||
class SeckillActivityPage extends StatefulWidget {
|
||||
SeckillActivityPage({
|
||||
Key key,
|
||||
}) : super(key: key);
|
||||
|
||||
@override
|
||||
_SeckillActivityPageState createState() => _SeckillActivityPageState();
|
||||
}
|
||||
|
||||
class _SeckillActivityPageState extends State<SeckillActivityPage> {
|
||||
DateTime _dateNow = DateTime(
|
||||
DateTime.now().year, DateTime.now().month, DateTime.now().day, 0, 0);
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppColor.frenchColor,
|
||||
resizeToAvoidBottomInset: false,
|
||||
appBar: CustomAppBar(
|
||||
appBackground: Colors.transparent,
|
||||
flexibleSpace: Container(
|
||||
width: double.infinity,
|
||||
height: 124.rw,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
BorderRadius.only(bottomRight: Radius.circular(104.rw)),
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.centerLeft,
|
||||
end: Alignment.centerRight,
|
||||
colors: [
|
||||
Color(0xFFD9332D),
|
||||
Color(0xFFE44f37),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
leading: RecookBackButton(
|
||||
white: true,
|
||||
),
|
||||
elevation: 0,
|
||||
title: Text(
|
||||
"限时秒杀",
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 28.rsp,
|
||||
fontWeight: FontWeight.bold),
|
||||
),
|
||||
bottom: _bottomWidgt(),
|
||||
),
|
||||
|
||||
// CustomAppBar(
|
||||
// appBackground: Color(0xFFF9F9FB),
|
||||
|
||||
// elevation: 0,
|
||||
// title: '限时秒杀'.text.bold.size(16.rsp).color(Colors.white).make(),
|
||||
// themeData: AppThemes.themeDataGrey.appBarTheme,
|
||||
// bottom: _bottomWidgt()
|
||||
// ),
|
||||
body: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
Color(0xFFD5101A),
|
||||
Color(0x03FE2E39),
|
||||
],
|
||||
stops: [0.0, 0.5],
|
||||
)),
|
||||
child: _bodyWidget(),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
_bodyWidget() {
|
||||
return Container(
|
||||
child: Column(
|
||||
children: [],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _bottomWidgt() {
|
||||
return PreferredSize(
|
||||
preferredSize: Size.fromHeight(30.rw),
|
||||
child: (Container(
|
||||
margin: EdgeInsets.only(bottom: 10.rw),
|
||||
width: double.infinity,
|
||||
height: 30.rw,
|
||||
color: Color(0xFFFCEEED),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
'还差',
|
||||
style: TextStyle(color: Color(0xFFC92219), fontSize: 14.rw),
|
||||
),
|
||||
16.wb,
|
||||
CutDownTimeWidget(),
|
||||
16.wb,
|
||||
Text(
|
||||
'活动开始',
|
||||
style: TextStyle(color: Color(0xFFC92219), fontSize: 14.rw),
|
||||
),
|
||||
],
|
||||
),
|
||||
)),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,65 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'live_animate_Icon.dart';
|
||||
|
||||
class LiveAnimate extends StatefulWidget {
|
||||
final double size;
|
||||
final double strokeWidth;
|
||||
final int place;
|
||||
final Duration delay;
|
||||
final Duration duration;
|
||||
|
||||
const LiveAnimate(
|
||||
{Key key,
|
||||
@required this.size,
|
||||
@required this.strokeWidth,
|
||||
@required this.place,
|
||||
@required this.delay,
|
||||
@required this.duration})
|
||||
: super(key: key);
|
||||
|
||||
@override
|
||||
_LiveAnimateState createState() => _LiveAnimateState();
|
||||
}
|
||||
|
||||
class _LiveAnimateState extends State<LiveAnimate>
|
||||
with TickerProviderStateMixin {
|
||||
AnimationController _controller;
|
||||
Animation _animation;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_controller = AnimationController(vsync: this, duration: widget.duration);
|
||||
|
||||
_animation = CurveTween(curve: Curves.easeInOut).animate(_controller);
|
||||
Future.delayed(widget.delay, () async {
|
||||
try {
|
||||
await _controller.forward().orCancel;
|
||||
await _controller.reverse().orCancel;
|
||||
await _controller.repeat(reverse: true).orCancel;
|
||||
} on TickerCanceled {
|
||||
print('animate stopped ${widget.place}');
|
||||
}
|
||||
});
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return AnimatedBuilder(
|
||||
animation: _animation,
|
||||
builder: (context, child) {
|
||||
return CustomPaint(
|
||||
painter: LiveAnimateIcon(
|
||||
_animation.value, widget.strokeWidth, widget.place),
|
||||
size: Size(widget.size / 3, widget.size * 0.5),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,50 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class LiveAnimateIcon extends CustomPainter {
|
||||
final double strokeWidth;
|
||||
final double value;
|
||||
final int palce;
|
||||
|
||||
LiveAnimateIcon(
|
||||
this.value,
|
||||
this.strokeWidth,
|
||||
this.palce,
|
||||
);
|
||||
|
||||
@override
|
||||
void paint(Canvas canvas, Size size) {
|
||||
double offset = size.height * (value * 0.3 + 0.2);
|
||||
Paint paint = Paint()
|
||||
..strokeWidth = this.strokeWidth
|
||||
..style = PaintingStyle.stroke
|
||||
..strokeCap = StrokeCap.round
|
||||
..color = Colors.white;
|
||||
Path path = Path();
|
||||
path.moveTo(
|
||||
this.palce == 0
|
||||
? size.width * 0.8
|
||||
: this.palce == 2
|
||||
? size.width * 0.2
|
||||
: size.width / 2,
|
||||
offset);
|
||||
path.lineTo(
|
||||
this.palce == 0
|
||||
? size.width * 0.8
|
||||
: this.palce == 2
|
||||
? size.width * 0.2
|
||||
: size.width / 2,
|
||||
size.height - offset);
|
||||
canvas.drawPath(path, paint);
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRepaint(covariant CustomPainter oldDelegate) {
|
||||
return true;
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRebuildSemantics(covariant CustomPainter oldDelegate) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,51 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
||||
|
||||
import 'live_animate.dart';
|
||||
|
||||
class LiveAnimateWidget extends StatefulWidget {
|
||||
final double size;
|
||||
final double strokeWidth;
|
||||
|
||||
const LiveAnimateWidget({Key key, this.size, this.strokeWidth})
|
||||
: super(key: key);
|
||||
|
||||
@override
|
||||
_LiveAnimateWidgetState createState() => _LiveAnimateWidgetState();
|
||||
}
|
||||
|
||||
class _LiveAnimateWidgetState extends State<LiveAnimateWidget> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: widget.size ?? 50.w,
|
||||
height: widget.size ?? 50.w,
|
||||
color: Colors.transparent,
|
||||
// decoration: BoxDecoration(
|
||||
// color: Colors.red,
|
||||
// borderRadius: BorderRadius.circular((widget.size ?? 50.w) / 2),
|
||||
// ),
|
||||
child: Row(
|
||||
children: [
|
||||
LiveAnimate(
|
||||
size: widget.size ?? 50.w,
|
||||
duration: Duration(milliseconds: 800),
|
||||
strokeWidth: widget.strokeWidth ?? 5.w,
|
||||
place: 0,
|
||||
delay: Duration(milliseconds: 0)),
|
||||
LiveAnimate(
|
||||
size: widget.size ?? 50.w,
|
||||
duration: Duration(milliseconds: 800),
|
||||
strokeWidth: widget.strokeWidth ?? 5.w,
|
||||
place: 1,
|
||||
delay: Duration(milliseconds: 200)),
|
||||
LiveAnimate(
|
||||
size: widget.size ?? 50.w,
|
||||
duration: Duration(milliseconds: 800),
|
||||
strokeWidth: widget.strokeWidth ?? 5.w,
|
||||
place: 2,
|
||||
delay: Duration(milliseconds: 400)),
|
||||
],
|
||||
));
|
||||
}
|
||||
}
|
||||
Loading…
Reference in new issue