Skip to content

Commit 7fa464e

Browse files
path-yupath-yu
committed
添加微光背景效果
1 parent a47b27b commit 7fa464e

File tree

3 files changed

+91
-60
lines changed

3 files changed

+91
-60
lines changed

‎lib/page/count_down.dart

+83-60
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import 'package:simple_app/provider/current_theme.dart';
1515
import 'package:simple_app/utils/show_dialog.dart';
1616
import 'package:simple_app/utils/show_toast.dart';
1717
import 'package:vibration/vibration.dart';
18+
import 'package:shimmer/shimmer.dart';
1819

1920
class CountDownPage extends StatefulWidget {
2021
const CountDownPage({Key? key}) : super(key: key);
@@ -30,7 +31,7 @@ class _CountDownPageState extends State<CountDownPage> {
3031
// 是否显示倒计时看板
3132
bool show = false;
3233
// 圆形大小背景
33-
double size = ScreenUtil().setHeight(350);
34+
double size = ScreenUtil().setHeight(326);
3435
// 进度条宽高度
3536
double progressSize = ScreenUtil().setHeight(350);
3637
// 进度条大小
@@ -47,15 +48,14 @@ class _CountDownPageState extends State<CountDownPage> {
4748
Timer? timerId;
4849
// 计数器过渡动画
4950
final Duration _duration = const Duration(milliseconds: 250);
50-
5151
// 音频字节
5252
ByteData? bytes;
5353
FlutterSoundPlayer? _myPlayer = FlutterSoundPlayer();
5454
void handleStartClick() {
5555
if (pickerTime.inSeconds < 6) return;
5656
setState(() => show = true);
5757
const timeout = Duration(seconds: 1);
58-
// progressValue = 0;
58+
progressValue = 0;
5959
int startSecond = 0;
6060
int totalSecond = pickerTime.inSeconds;
6161
int h = pickerTime.inHours;
@@ -133,9 +133,12 @@ class _CountDownPageState extends State<CountDownPage> {
133133
}
134134

135135
TextStyle textStyle = TextStyle(
136-
height: 1.5,
137-
fontSize: ScreenUtil().setSp(35),
138-
textBaseline: TextBaseline.alphabetic);
136+
fontSize: ScreenUtil().setSp(50),
137+
foreground: Paint()
138+
..style = PaintingStyle.stroke
139+
..strokeWidth = 1
140+
..color = Colors.white,
141+
);
139142

140143
@override
141144
void dispose() {
@@ -172,10 +175,7 @@ class _CountDownPageState extends State<CountDownPage> {
172175
key: ValueKey<bool>(show),
173176
child: show
174177
? ClipOval(
175-
child: AnimatedContainer(
176-
duration: const Duration(milliseconds: 100),
177-
width: size,
178-
height: size,
178+
child: Container(
179179
child: Stack(
180180
children: [
181181
Positioned(
@@ -186,7 +186,7 @@ class _CountDownPageState extends State<CountDownPage> {
186186
lineWidth: strokeWidth,
187187
animateFromLastPercent: true,
188188
backgroundColor: Colors.grey,
189-
circularStrokeCap: CircularStrokeCap.butt,
189+
circularStrokeCap: CircularStrokeCap.round,
190190
linearGradient: const LinearGradient(
191191
colors: [
192192
Color.fromRGBO(179, 217, 200, 0.7),
@@ -198,59 +198,82 @@ class _CountDownPageState extends State<CountDownPage> {
198198
),
199199
),
200200
),
201-
Row(
202-
mainAxisAlignment: MainAxisAlignment.center,
203-
children: [
204-
Visibility(
205-
visible: hour != null,
206-
child: Center(
207-
child: AnimatedFlipCounter(
208-
value: hour ??= 0,
209-
duration: _duration,
210-
textStyle: textStyle,
211-
),
212-
)),
213-
Visibility(
214-
visible: hour != 0,
215-
child: Text(
216-
':',
217-
style: textStyle,
218-
),
219-
),
220-
Visibility(
221-
visible: minutes != null,
222-
child: Center(
223-
child: AnimatedFlipCounter(
224-
value: minutes ??= 0,
225-
duration: _duration,
226-
textStyle: textStyle,
201+
Positioned(
202+
top: strokeWidth,
203+
left: strokeWidth,
204+
child: ClipOval(
205+
child: Shimmer.fromColors(
206+
child: Container(
207+
width: size,
208+
height: size,
209+
decoration: const BoxDecoration(
210+
gradient: LinearGradient(
211+
begin: Alignment.centerLeft,
212+
end: Alignment.centerRight,
213+
colors: [
214+
Color.fromRGBO(
215+
152, 203, 179, 0.5),
216+
themeColor
217+
]),
218+
),
219+
child: Row(
220+
mainAxisAlignment:
221+
MainAxisAlignment.center,
222+
children: [
223+
Visibility(
224+
visible: hour != null,
225+
child: Center(
226+
child: AnimatedFlipCounter(
227+
value: hour ??= 0,
228+
duration: _duration,
229+
textStyle: textStyle,
230+
),
231+
)),
232+
Visibility(
233+
visible: hour != 0,
234+
child: Text(
235+
':',
236+
style: textStyle,
237+
),
238+
),
239+
Visibility(
240+
visible: minutes != null,
241+
child: Center(
242+
child: AnimatedFlipCounter(
243+
value: minutes ??= 0,
244+
duration: _duration,
245+
textStyle: textStyle,
246+
),
247+
)),
248+
Visibility(
249+
visible: hour == 0
250+
? minutes != 0
251+
: true,
252+
child: Text(
253+
':',
254+
style: textStyle,
255+
),
256+
),
257+
Visibility(
258+
visible: second != null,
259+
child: Center(
260+
child: AnimatedFlipCounter(
261+
value: second ??= 0,
262+
duration: _duration,
263+
textStyle: textStyle,
264+
),
265+
))
266+
],
267+
),
227268
),
228-
)),
229-
Visibility(
230-
visible: minutes != 0,
231-
child: Text(
232-
':',
233-
style: textStyle,
234-
),
235-
),
236-
Visibility(
237-
visible: second != null,
238-
child: Center(
239-
child: AnimatedFlipCounter(
240-
value: second ??= 0,
241-
duration: _duration,
242-
textStyle: textStyle,
269+
baseColor:
270+
const Color.fromRGBO(179, 217, 200, 0.7),
271+
highlightColor: themeColor,
272+
period: const Duration(seconds: 1),
243273
),
244-
))
245-
],
246-
)
274+
))
247275
],
248276
),
249-
decoration: const BoxDecoration(
250-
gradient: LinearGradient(
251-
begin: Alignment.topLeft,
252-
end: Alignment.bottomRight,
253-
colors: [Colors.white, themeColor])),
254277
),
255278
)
256279
: Column(

‎pubspec.lock

+7
Original file line numberDiff line numberDiff line change
@@ -588,6 +588,13 @@ packages:
588588
url: "https://pub.flutter-io.cn"
589589
source: hosted
590590
version: "2.0.4"
591+
shimmer:
592+
dependency: "direct main"
593+
description:
594+
name: shimmer
595+
url: "https://pub.flutter-io.cn"
596+
source: hosted
597+
version: "2.0.0"
591598
sky_engine:
592599
dependency: transitive
593600
description: flutter

‎pubspec.yaml

+1
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ dependencies:
3232
percent_indicator: ^3.4.0
3333
vibration: ^1.7.4-nullsafety.0
3434
flutter_sound: ^9.1.3
35+
shimmer: ^2.0.0
3536
flutter_localizations:
3637
sdk: flutter
3738

0 commit comments

Comments
 (0)