我正在学习这个速度代码教程(https://www.youtube.com/watch?v=KO_PYJKHglo),现在遇到了一些问题,它是从youtube视频中2:42开始的。
这是我的主.dart文件。
import 'package:flutter/material.dart';
void main() {
runApp(
const MaterialApp(
debugShowCheckedModeBanner: false,
home: PlayerApp(),
),
);
}
class PlayerApp extends StatefulWidget {
const PlayerApp({super.key});
@override
State<PlayerApp> createState() => _PlayerAppState();
}
class _PlayerAppState extends State<PlayerApp> {
@override
Widget build(BuildContext context) {
final height = MediaQuery.of(context).size.height;
final width = MediaQuery.of(context).size.width;
return Scaffold(
body: Stack(
children: <Widget>[
Positioned(
height: height,
width: width,
child: Material(
elevation: 16,
color: const Color(0xFFd6dde5), //Background Color
borderRadius: BorderRadius.circular(20),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 30.0,
),
child: Column(
children: <Widget>[
const SizedBox(
height: 90,
),
const Text(
'Music title',
),
const SizedBox(
height: 15,
),
const Text(
'Music artist',
),
const SizedBox(
height: 75,
),
buildRecordPlayer(),
const SizedBox(
height: 60,
),
Row(
children: <Widget>[
const Text('time'),
const SizedBox(
width: 8,
),
buildWave(),
const SizedBox(
width: 8,
),
const Text('end'),
],
)
],
),
),
),
)
],
),
);
}
Widget buildRecordPlayer() {
return Container(
height: 190,
width: 190,
alignment: Alignment.center,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/vinyl.png'),
fit: BoxFit.fitHeight,
colorFilter: ColorFilter.mode(
Colors.blue,
BlendMode.color,
),
),
shape: BoxShape.circle,
),
child: ClipOval(
child: Image.asset(
'assets/images/SL.png',
height: 150,
width: 150,
fit: BoxFit.fill,
),
),
);
}
Widget buildWave() {
return SizedBox(
width: 260,
height: 40,
child: CustomPaint(
painter: WaveBasePainter(),
),
);
}
}
这是我的wave_base_painter.dart文件
import 'package:flutter/material.dart';
import 'dart:math';
class WaveBasePainter extends CustomPainter {
Paint? _paint; //4:03
@override
void paint(Canvas canvas, Size size) {
_paint = Paint()
..color = Colors.grey.withOpacity(0.3)
..style = PaintingStyle.stroke
..strokeWidth = 1.5;
canvas.translate(0, size.height / 2);
canvas.scale(1, -1);
for (int i = 0; i < size.width.toInt(); i++) {
double x = i.toDouble();
double r = 2 * sin(i) - 2 * cos(4 * i) + sin(2 * i - pi * 24);
r = r * 5;
canvas.drawLine(Offset(x, r), Offset(x, -r), _paint!);
}
@override
bool shouldRepaint(WaveBasePainter oldDelegate) => false;
}
}
这是它的结果,我不知道为什么我下面的速度代码视频没有显示任何错误,我的.
1条答案
按热度按时间eh57zj3b1#
shouldRepaint
函数定义不正确。你可以看到这个文件,我已经更新了它: