fix(player): 修正评论面板键盘态布局重叠

This commit is contained in:
Zhou Weidong committed 2026-10-21 13:00:05 +08:00
1 parent a7c0576a03
commit bc4c84a4ae
2 files changed
+95 -73

No files matched your search

@@ -184,54 +184,67 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
final maxHeight = screenLimit < _maxSheetHeight
? screenLimit
: _maxSheetHeight;
final focused = _inputFocus.hasFocus;
final inputFocused = _inputFocus.hasFocus;
final keyboardHeight = _keyboardHeight(context);
final keyboardOpen = keyboardHeight > 0;
final expanded = inputFocused && keyboardOpen;
final availableHeight = math.max(0.0, screenLimit - keyboardHeight);
final keyboardPanelHeight = math.min(
_sheetHeightWithoutKeyboard ?? maxHeight,
availableHeight,
);
_measureSheetWithoutKeyboard(keyboardHeight);
return GestureDetector(
behavior: HitTestBehavior.translucent,
onTap: focused ? _inputFocus.unfocus : null,
child: SizedBox(
key: _sheetMeasureKey,
child: Container(
key: const Key('player-comments-sheet'),
decoration: const BoxDecoration(
color: AppColors.card,
borderRadius: BorderRadius.vertical(
top: Radius.circular(_sheetRadius),
return AnimatedPadding(
duration: const Duration(milliseconds: 200),
curve: Curves.easeOut,
padding: EdgeInsets.only(bottom: keyboardHeight),
child: GestureDetector(
behavior: HitTestBehavior.translucent,
onTap: inputFocused ? _inputFocus.unfocus : null,
child: SizedBox(
key: _sheetMeasureKey,
child: Container(
key: const Key('player-comments-sheet'),
decoration: const BoxDecoration(
color: AppColors.card,
borderRadius: BorderRadius.vertical(
top: Radius.circular(_sheetRadius),
),
),
),
child: SafeArea(
top: false,
child: ListenableBuilder(
listenable: _controller,
builder: (context, _) {
final minHeight = _controller.comments.isEmpty
? (_minSheetHeight < maxHeight
? _minSheetHeight
: maxHeight)
: 0.0;
final pinnedHeight =
keyboardHeight > 0 && _sheetHeightWithoutKeyboard != null
? math.min(_sheetHeightWithoutKeyboard!, maxHeight)
: null;
return ConstrainedBox(
key: const Key('comment-sheet-constraints'),
constraints: pinnedHeight == null
? BoxConstraints(
minHeight: minHeight,
maxHeight: maxHeight,
)
: BoxConstraints.tightFor(height: pinnedHeight),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: _content(
context,
focused: focused,
keyboardHeight: keyboardHeight,
child: SafeArea(
top: false,
child: ListenableBuilder(
listenable: _controller,
builder: (context, _) {
final minHeight = _controller.comments.isEmpty
? (_minSheetHeight < maxHeight
? _minSheetHeight
: maxHeight)
: 0.0;
return AnimatedSize(
duration: const Duration(milliseconds: 200),
curve: Curves.easeOut,
alignment: Alignment.bottomCenter,
child: ConstrainedBox(
key: const Key('comment-sheet-constraints'),
constraints: keyboardOpen
? BoxConstraints.tightFor(height: keyboardPanelHeight)
: BoxConstraints(
minHeight: minHeight,
maxHeight: maxHeight,
),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: _content(
context,
expanded: expanded,
keyboardHeight: keyboardHeight,
),
),
),
),
);
},
);
},
),
),
),
),
@@ -241,12 +254,12 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
Widget _content(
BuildContext context, {
required bool focused,
required bool expanded,
required double keyboardHeight,
}) {
final l10n = AppLocalizations.of(context)!;
final count = _serverCount ?? _controller.exactCount;
final composerReserve = focused
final composerReserve = expanded
? _expandedComposerReserve
: _composerHeight + _composerTopGap;
return Column(
@@ -299,18 +312,13 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
),
),
if (_replyTo != null) _replyBanner(l10n, _replyTo!),
AnimatedContainer(
key: const Key('comment-input-lift'),
duration: const Duration(milliseconds: 200),
curve: Curves.easeOut,
transform: Matrix4.translationValues(0, -keyboardHeight, 0),
child: Padding(
padding: EdgeInsets.only(
top: focused ? 12 : _composerTopGap,
bottom: focused ? 12 : 0,
),
child: _composer(l10n, focused: focused),
Padding(
key: const Key('comment-composer-area'),
padding: EdgeInsets.only(
top: expanded ? 12 : _composerTopGap,
bottom: expanded ? 12 : 0,
),
child: _composer(l10n, focused: expanded),
),
],
);