Skip to content

Commit 12188b8

Browse files
canxin121canxin121
committed
[Fix] adjust lyric ui
1 parent 999391e commit 12188b8

File tree

3 files changed

+85
-147
lines changed

3 files changed

+85
-147
lines changed

‎lib/desktop/comps/popup_comp/lyric.dart

Lines changed: 12 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'dart:async';
2+
import 'package:app_rhyme/types/lyric_ui.dart';
23
import 'package:chinese_font_library/chinese_font_library.dart';
34
import 'package:app_rhyme/types/music_container.dart';
45
import 'package:app_rhyme/utils/global_vars.dart';
@@ -8,76 +9,12 @@ import 'package:flutter/material.dart';
89
import 'package:flutter_lyric/lyrics_reader.dart';
910
import 'package:get/get.dart';
1011

11-
class AppleMusicLyricUi extends LyricUI {
12-
final bool isDarkMode;
13-
14-
AppleMusicLyricUi({this.isDarkMode = false});
15-
16-
@override
17-
TextStyle getPlayingMainTextStyle() {
18-
return TextStyle(
19-
color: isDarkMode ? Colors.white : Colors.black,
20-
fontSize: 30,
21-
fontWeight: FontWeight.bold,
22-
).useSystemChineseFont();
23-
}
24-
25-
@override
26-
TextStyle getPlayingExtTextStyle() {
27-
return TextStyle(
28-
color: isDarkMode ? Colors.white : Colors.black,
29-
fontSize: 22,
30-
fontWeight: FontWeight.bold)
31-
.useSystemChineseFont();
32-
}
33-
34-
@override
35-
TextStyle getOtherMainTextStyle() {
36-
return TextStyle(
37-
color: isDarkMode ? Colors.white70 : Colors.black54,
38-
fontSize: 18,
39-
fontWeight: FontWeight.bold,
40-
).useSystemChineseFont();
41-
}
42-
43-
@override
44-
TextStyle getOtherExtTextStyle() {
45-
return TextStyle(
46-
color: isDarkMode ? Colors.white70 : Colors.black54,
47-
fontSize: 14,
48-
).useSystemChineseFont();
49-
}
50-
51-
@override
52-
double getBlankLineHeight() => 16;
53-
54-
@override
55-
double getLineSpace() => 26;
56-
57-
@override
58-
double getInlineSpace() => 8;
59-
60-
@override
61-
double getPlayingLineBias() => 0.4;
62-
63-
@override
64-
LyricAlign getLyricHorizontalAlign() => LyricAlign.LEFT;
65-
66-
@override
67-
bool enableLineAnimation() => true;
68-
69-
@override
70-
bool enableHighlight() => false;
71-
72-
@override
73-
bool initAnimation() => true;
74-
}
75-
7612
class LyricComp extends StatefulWidget {
7713
final double maxHeight;
78-
final bool isDarkMode;
79-
const LyricComp(
80-
{super.key, required this.maxHeight, required this.isDarkMode});
14+
const LyricComp({
15+
super.key,
16+
required this.maxHeight,
17+
});
8118

8219
@override
8320
LyricCompState createState() => LyricCompState();
@@ -92,7 +29,7 @@ class LyricCompState extends State<LyricComp> {
9229
@override
9330
void initState() {
9431
super.initState();
95-
lyricUI = AppleMusicLyricUi(isDarkMode: widget.isDarkMode);
32+
lyricUI = AppleMusicLyricUi();
9633
lyricModel = LyricsModelBuilder.create()
9734
.bindLyricToMain(globalAudioHandler.playingMusic.value?.info.lyric ??
9835
"[00:00.00]无歌词")
@@ -114,10 +51,8 @@ class LyricCompState extends State<LyricComp> {
11451

11552
@override
11653
Widget build(BuildContext context) {
117-
Color decorationColor =
118-
widget.isDarkMode ? CupertinoColors.white : CupertinoColors.black;
119-
Color iconColor =
120-
widget.isDarkMode ? CupertinoColors.white : CupertinoColors.black;
54+
Color decorationColor = CupertinoColors.white;
55+
Color iconColor = CupertinoColors.white;
12156
return Obx(() => LyricsReader(
12257
playing: globalAudioHandler.playingMusic.value != null,
12358
padding: const EdgeInsets.symmetric(horizontal: 20),
@@ -168,9 +103,7 @@ class LyricCompState extends State<LyricComp> {
168103

169104
class LyricPopupRoute extends PopupRoute<void> {
170105
final double maxHeight;
171-
final bool isDarkMode;
172-
LyricPopupRoute(
173-
this.isDarkMode, {
106+
LyricPopupRoute({
174107
required this.maxHeight,
175108
});
176109

@@ -192,7 +125,7 @@ class LyricPopupRoute extends PopupRoute<void> {
192125
Animation<double> animation,
193126
Animation<double> secondaryAnimation,
194127
) {
195-
const containerWidth = 350.0;
128+
const containerWidth = 450.0;
196129

197130
return FadeTransition(
198131
opacity: animation,
@@ -201,7 +134,6 @@ class LyricPopupRoute extends PopupRoute<void> {
201134
child: LyricContainer(
202135
maxHeight: maxHeight,
203136
width: containerWidth,
204-
isDarkMode: isDarkMode,
205137
),
206138
),
207139
);
@@ -211,24 +143,18 @@ class LyricPopupRoute extends PopupRoute<void> {
211143
class LyricContainer extends StatelessWidget {
212144
final double maxHeight;
213145
final double width;
214-
final bool isDarkMode;
215146

216147
const LyricContainer({
217148
super.key,
218149
required this.maxHeight,
219150
required this.width,
220-
required this.isDarkMode,
221151
});
222152

223153
@override
224154
Widget build(BuildContext context) {
225-
Color backgroundColor = isDarkMode
226-
? const Color.fromARGB(255, 46, 46, 46)
227-
: const Color.fromARGB(255, 249, 249, 249);
155+
Color backgroundColor = const Color.fromARGB(255, 46, 46, 46);
228156

229-
Color borderColor = isDarkMode
230-
? const Color.fromARGB(255, 62, 62, 62)
231-
: const Color.fromARGB(255, 237, 237, 237);
157+
Color borderColor = const Color.fromARGB(255, 62, 62, 62);
232158

233159
return Container(
234160
height: maxHeight,
@@ -243,7 +169,6 @@ class LyricContainer extends StatelessWidget {
243169
),
244170
child: LyricComp(
245171
maxHeight: maxHeight,
246-
isDarkMode: isDarkMode,
247172
),
248173
);
249174
}
@@ -253,7 +178,6 @@ void showLyricPopup(BuildContext context, bool isDarkMode) {
253178
Navigator.push(
254179
context,
255180
LyricPopupRoute(
256-
isDarkMode,
257181
maxHeight: MediaQuery.of(context).size.height,
258182
),
259183
);

‎lib/mobile/comps/play_display_comp/lyric.dart

Lines changed: 1 addition & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'dart:async';
2+
import 'package:app_rhyme/types/lyric_ui.dart';
23
import 'package:chinese_font_library/chinese_font_library.dart';
34
import 'package:app_rhyme/types/music_container.dart';
45
import 'package:app_rhyme/utils/global_vars.dart';
@@ -8,65 +9,6 @@ import 'package:flutter/material.dart';
89
import 'package:flutter_lyric/lyrics_reader.dart';
910
import 'package:get/get.dart';
1011

11-
class AppleMusicLyricUi extends LyricUI {
12-
@override
13-
TextStyle getPlayingMainTextStyle() {
14-
return const TextStyle(
15-
color: Colors.white,
16-
fontSize: 30,
17-
fontWeight: FontWeight.bold,
18-
).useSystemChineseFont();
19-
}
20-
21-
@override
22-
TextStyle getPlayingExtTextStyle() {
23-
return const TextStyle(
24-
color: Colors.white, fontSize: 22, fontWeight: FontWeight.bold)
25-
.useSystemChineseFont();
26-
}
27-
28-
@override
29-
TextStyle getOtherMainTextStyle() {
30-
return const TextStyle(
31-
color: CupertinoColors.systemGrey,
32-
fontSize: 18,
33-
fontWeight: FontWeight.bold,
34-
).useSystemChineseFont();
35-
}
36-
37-
@override
38-
TextStyle getOtherExtTextStyle() {
39-
return const TextStyle(
40-
color: CupertinoColors.systemGrey,
41-
fontSize: 14,
42-
).useSystemChineseFont();
43-
}
44-
45-
@override
46-
double getBlankLineHeight() => 16;
47-
48-
@override
49-
double getLineSpace() => 26;
50-
51-
@override
52-
double getInlineSpace() => 8;
53-
54-
@override
55-
double getPlayingLineBias() => 0.4;
56-
57-
@override
58-
LyricAlign getLyricHorizontalAlign() => LyricAlign.LEFT;
59-
60-
@override
61-
bool enableLineAnimation() => true;
62-
63-
@override
64-
bool enableHighlight() => false;
65-
66-
@override
67-
bool initAnimation() => true;
68-
}
69-
7012
class LyricDisplay extends StatefulWidget {
7113
final double maxHeight;
7214
final bool isDarkMode;

‎lib/types/lyric_ui.dart

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import 'package:chinese_font_library/chinese_font_library.dart';
2+
import 'package:flutter/cupertino.dart';
3+
import 'package:flutter/material.dart';
4+
import 'package:flutter_lyric/lyric_ui/lyric_ui.dart';
5+
6+
class AppleMusicLyricUi extends LyricUI {
7+
AppleMusicLyricUi();
8+
9+
@override
10+
TextStyle getPlayingMainTextStyle() {
11+
return const TextStyle(
12+
color: Color.fromARGB(255, 120, 119, 118),
13+
fontSize: 36,
14+
fontWeight: FontWeight.bold,
15+
).useSystemChineseFont();
16+
}
17+
18+
// 不起作用
19+
@override
20+
TextStyle getPlayingExtTextStyle() {
21+
return const TextStyle(
22+
color: Colors.white, fontSize: 22, fontWeight: FontWeight.bold)
23+
.useSystemChineseFont();
24+
}
25+
26+
@override
27+
TextStyle getOtherMainTextStyle() {
28+
return const TextStyle(
29+
color: Color.fromARGB(200, 120, 119, 118),
30+
fontSize: 22,
31+
fontWeight: FontWeight.bold,
32+
).useSystemChineseFont();
33+
}
34+
35+
// 不起作用
36+
@override
37+
TextStyle getOtherExtTextStyle() {
38+
return const TextStyle(
39+
color: CupertinoColors.systemGrey3,
40+
fontSize: 14,
41+
).useSystemChineseFont();
42+
}
43+
44+
@override
45+
double getBlankLineHeight() => 16;
46+
47+
@override
48+
double getLineSpace() => 26;
49+
50+
@override
51+
double getInlineSpace() => 8;
52+
53+
@override
54+
double getPlayingLineBias() => 0.4;
55+
56+
@override
57+
LyricAlign getLyricHorizontalAlign() => LyricAlign.LEFT;
58+
59+
@override
60+
bool enableLineAnimation() => true;
61+
62+
@override
63+
bool enableHighlight() => true;
64+
65+
@override
66+
Color getLyricHightlightColor() {
67+
return const Color.fromARGB(255, 255, 255, 255);
68+
}
69+
70+
@override
71+
bool initAnimation() => true;
72+
}

0 commit comments

Comments
 (0)