Flutter基督教歌词查询插件christian_lyrics的使用
Flutter基督教歌词查询插件christian_lyrics的使用
Flutter插件christian_lyrics允许您构建类似字幕类型的歌曲歌词。
开始使用
首先，确保您已经添加了christian_lyrics到您的pubspec.yaml文件中：
dependencies:
christian_lyrics: ^版本号
然后运行以下命令以获取依赖项：
flutter pub get
SRT 文件格式
SRT 文件格式是一种常见的字幕文件格式。其基本结构如下：
1
00:00:00,000 --> 00:00:05,000
这是第一行歌词。
2
00:00:05,000 --> 00:00:10,000
这是第二行歌词。
如何使用
以下是使用christian_lyrics的基本步骤：
final christianLyrics = ChristianLyrics();
christianLyrics.setLyricContent(lyricText);
// 构建歌词小部件
christianLyrics.getLyric(context, isPlaying: true);
完整示例代码
以下是一个完整的示例代码，展示了如何在Flutter应用程序中使用christian_lyrics插件来显示歌词。
import 'package:christian_lyrics/lyric.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:path_provider/path_provider.dart';
import 'package:flutter/services.dart';
import 'package:christian_lyrics/christian_lyrics.dart';
import 'package:audio_session/audio_session.dart';
import 'package:just_audio/just_audio.dart';
import 'package:rxdart/rxdart.dart';
import 'common.dart';
const lyricText = "1\r\n00:00:01,000 --> 00:00:29,950\r\n* * *\r\n\r\n2\r\n00:00:30,000 --> 00:00:33,350\r\nOh holy night!\r\n\r\n3\r\n00:00:33,400 --> 00:00:37,950\r\nThe stars are brightly shining\r\n\r\n..."; // 省略部分内容
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
[@override](/user/override)
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
final _player = AudioPlayer();
final christianLyrics = ChristianLyrics();
[@override](/user/override)
void initState() {
super.initState();
WidgetsBinding.instance?.addObserver(this);
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: Colors.black,
));
_init();
christianLyrics.setLyricContent(lyricText);
}
Future<void> _init() async {
// 配置音频会话
final session = await AudioSession.instance;
await session.configure(AudioSessionConfiguration.speech());
// 监听播放错误
_player.playbackEventStream.listen((event) {},
onError: (Object e, StackTrace stackTrace) {
print('A stream error occurred: $e');
});
// 加载音频源
try {
await _player.setAudioSource(AudioSource.uri(Uri.parse(
"asset:///assets/OHolyNight_Christmas2016.mp3")));
} catch (e) {
print("Error loading audio source: $e");
}
}
[@override](/user/override)
void dispose() {
WidgetsBinding.instance?.removeObserver(this);
_player.dispose();
super.dispose();
}
[@override](/user/override)
void didChangeAppLifecycleState(AppLifecycleState state) {
if (state == AppLifecycleState.paused) {
_player.stop();
}
}
Stream<PositionData> get _positionDataStream =>
Rx.combineLatest3<Duration, Duration, Duration?, PositionData>(
_player.positionStream,
_player.bufferedPositionStream,
_player.durationStream,
(position, bufferedPosition, duration) =>
PositionData(position, bufferedPosition, duration ?? Duration.zero));
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Expanded(child: Container(child: StreamBuilder<PlayerState>(
stream: _player.playerStateStream,
builder: (context, snapshot) {
final playerState = snapshot.data;
final playing = playerState?.playing ?? false;
return christianLyrics.getLyric(context, isPlaying: playing);
}), color: Colors.brown)),
// 播放/暂停按钮和音量/速度滑块
ControlButtons(_player, christianLyrics),
// 求进度条
StreamBuilder<PositionData>(
stream: _positionDataStream,
builder: (context, snapshot) {
final positionData = snapshot.data;
if (positionData != null) {
christianLyrics.setPositionWithOffset(position: positionData.position.inMilliseconds, duration: positionData.duration.inMilliseconds);
}
return SeekBar(
duration: positionData?.duration ?? Duration.zero,
position: positionData?.position ?? Duration.zero,
bufferedPosition: positionData?.bufferedPosition ?? Duration.zero,
onChangeEnd: (Duration d) {
christianLyrics.resetLyric();
christianLyrics.setPositionWithOffset(position: d.inMilliseconds, duration: positionData!.duration.inMilliseconds);
_player.seek(d);
},
);
}
),
],
),
),
),
);
}
}
/// 显示播放/暂停按钮和音量/速度滑块。
class ControlButtons extends StatelessWidget {
final AudioPlayer player;
final ChristianLyrics christianLyrics;
ControlButtons(this.player, this.christianLyrics);
[@override](/user/override)
Widget build(BuildContext context) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
// 打开音量滑块对话框
IconButton(
icon: Icon(Icons.volume_up),
onPressed: () {
showSliderDialog(
context: context,
title: "Adjust volume",
divisions: 10,
min: 0.0,
max: 1.0,
value: player.volume,
stream: player.volumeStream,
onChanged: player.setVolume,
);
},
),
StreamBuilder<PlayerState>(
stream: player.playerStateStream,
builder: (context, snapshot) {
final playerState = snapshot.data;
final processingState = playerState?.processingState;
final playing = playerState?.playing;
if (processingState == ProcessingState.loading ||
processingState == ProcessingState.buffering) {
return Container(
margin: EdgeInsets.all(8.0),
width: 64.0,
height: 64.0,
child: CircularProgressIndicator(),
);
} else if (playing != true) {
return IconButton(
icon: Icon(Icons.play_arrow),
iconSize: 64.0,
onPressed: () {
christianLyrics.resetLyric();
player.play();
},
);
} else if (processingState != ProcessingState.completed) {
return IconButton(
icon: Icon(Icons.pause),
iconSize: 64.0,
onPressed: player.pause,
);
} else {
return IconButton(
icon: Icon(Icons.replay),
iconSize: 64.0,
onPressed: () => player.seek(Duration.zero),
);
}
},
),
// 打开速度滑块对话框
StreamBuilder<double>(
stream: player.speedStream,
builder: (context, snapshot) => IconButton(
icon: Text("${snapshot.data?.toStringAsFixed(1)}x",
style: TextStyle(fontWeight: FontWeight.bold)),
onPressed: () {
showSliderDialog(
context: context,
title: "Adjust speed",
divisions: 10,
min: 0.5,
max: 1.5,
value: player.speed,
stream: player.speedStream,
onChanged: player.setSpeed,
);
},
),
),
],
);
}
}
更多关于Flutter基督教歌词查询插件christian_lyrics的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
