feat(flutter): 重设计播放页与操作面板

lib/pages/player/widgets/drama_comments_sheet.dart

@@ -23,6 +23,7 @@ const double _minSheetHeight = 280;
 const double _maxSheetHeight = 520;
 const int _maxCommentLength = 300;
 const double _composerRadius = 22;
+const double _sheetRadius = 20;
 
 /// 服务端评论底部弹窗：匿名列表、游标翻页、回复、点赞和本人删除。
 class DramaCommentsSheet extends StatefulWidget {
@@ -160,15 +161,24 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
         24;
     return Padding(
       padding: EdgeInsets.only(bottom: MediaQuery.viewInsetsOf(context).bottom),
-      child: SizedBox(
-        height: available.clamp(_minSheetHeight, _maxSheetHeight),
-        child: SafeArea(
-          top: false,
-          child: Padding(
-            padding: const EdgeInsets.fromLTRB(20, 4, 20, 12),
-            child: ListenableBuilder(
-              listenable: _controller,
-              builder: (context, _) => _content(context),
+      child: Container(
+        key: const Key('player-comments-sheet'),
+        decoration: const BoxDecoration(
+          color: AppColors.card,
+          borderRadius: BorderRadius.vertical(
+            top: Radius.circular(_sheetRadius),
+          ),
+        ),
+        child: SizedBox(
+          height: available.clamp(_minSheetHeight, _maxSheetHeight),
+          child: SafeArea(
+            top: false,
+            child: Padding(
+              padding: const EdgeInsets.fromLTRB(20, 4, 20, 12),
+              child: ListenableBuilder(
+                listenable: _controller,
+                builder: (context, _) => _content(context),
+              ),
             ),
           ),
         ),
@@ -182,13 +192,35 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
+        Row(
+          children: [
+            Expanded(
+              child: Text(
+                count == null ? l10n.comments : l10n.commentsWithCount(count),
+                key: count == null ? null : const Key('comment-count-label'),
+                style: const TextStyle(
+                  color: AppColors.onSurface,
+                  fontSize: 20,
+                  fontWeight: FontWeight.w800,
+                ),
+              ),
+            ),
+            IconButton(
+              key: const Key('player-comments-close'),
+              tooltip: l10n.close,
+              onPressed: () => Navigator.pop(context),
+              icon: const Icon(Icons.close_rounded),
+            ),
+          ],
+        ),
         Text(
-          count == null ? l10n.comments : '${l10n.comments} · $count',
-          key: count == null ? null : const Key('comment-count-label'),
+          widget.drama.title,
+          maxLines: 1,
+          overflow: TextOverflow.ellipsis,
           style: const TextStyle(
-            color: AppColors.cream,
-            fontSize: 18,
-            fontWeight: FontWeight.w700,
+            color: AppColors.muted,
+            fontSize: 12,
+            fontWeight: FontWeight.w500,
           ),
         ),
         const SizedBox(height: 12),
@@ -312,7 +344,7 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
           maxLength: _maxCommentLength,
           maxLines: 1,
           style: const TextStyle(color: AppColors.cream, fontSize: 14),
-          cursorColor: AppColors.gold,
+          cursorColor: AppColors.blue,
           decoration: _composerDecoration(l10n.writeComment),
           onSubmitted: (_) => _post(),
         ),