Description:

ym lyric

Display lrc lyrics in flutter app.
Features #
TODO: Display other app lyrics in flutter app.
TODO: Optimize animations, widgets.
Getting started #
dependencies:
ym_lyric: ^0.0.4
copied to clipboard
Usage #
Krc lyrics are displayed in a KrcLyricView widget. The KrcLyricView widget requires a KrcModel
object as input. The KrcModel object contains a list of KrcLine objects. The KrcLine object
contains the text of the lyrics and the time at which the lyrics should be displayed.
The KrcLyricView widget also requires an onSeekTo callback function that is called when the user
seeks to a specific time in the lyrics. The onSeekTo callback function should update the time
variable in the parent widget.
class _MyHomePageState extends State<MyHomePage> {
KrcLyricModel? _krc;

late LyricModel _lrc;

int time = 0;

final _player = AudioPlayer();

late KrcLyricView lyricView;
var _krcKey = UniqueKey();

void readFile() async {
// String filePath = 'assets/Around the World.krc';
// String filePath = 'assets/ATC - Around The World.krc';
// String filePath = 'assets/m.o.v.e - around the world.krc';
String filePath = 'assets/挪威的森林.krc';
try {
var content = await rootBundle.load(filePath);
var model = KrcLyricUtil.parseLyrics(content.buffer.asUint8List());
// var model = LrcLyricUtil.parseLyrics(String.fromCharCodes(content.buffer.asUint8List()));

setState(() {
_krcKey = UniqueKey();
_krc = model;
// 重新创建lyricView
// 放在这里是为了在 窗口创建等情况调用build方法后更新lyricView
lyricView = KrcLyricView(
key: _krcKey,
lyrics: _krc,
showLanguageLyric: -1,
onSeekTo: (int time) {
this.time = time;
_player.seek(Duration(milliseconds: time));
},
);
});
} catch (e) {
print(e);
}
}

@override
void initState() {
super.initState();
readFile();
_init();
// 创建lyricView
lyricView = KrcLyricView(
key: _krcKey,
lyrics: _krc,
showLanguageLyric: -1,
onSeekTo: (int time) {
this.time = time;
_player.seek(Duration(milliseconds: time));
},
);
}

Future<void> _init() async {
_player
.createPositionStream(
steps: 10,
minPeriod: const Duration(milliseconds: 10),
maxPeriod: const Duration(milliseconds: 10),
)
.listen((event) {
time = event.inMilliseconds;
lyricView.setTime(time);
});
// test
// _player.setSpeed(0.8);
_player.setLoopMode(LoopMode.one);
// await _player.setAsset('assets/world.mp3');
await _player.setAsset('assets/挪威的森林.mp3');
_player.play();
}

@override
void dispose() {
super.dispose();
_player.dispose();
}

@override
Widget build(BuildContext context) {
double screenWidth = MediaQuery.of(context).size.width;
double targetWidth = screenWidth * 0.8;

return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: Text(widget.title),
),
body: SizedBox(
width: targetWidth,
child: lyricView,
),
);
}
}
copied to clipboard
Contributing #
Feel free to contribute to this project. If you find any issues or have suggestions, please create
an issue or pull request.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter