Make emoji search view look like other emoji picker tabs (#5756)

This commit is contained in:
Kelrap 2026-02-19 10:53:53 -05:00 committed by GitHub
parent e933df7e36
commit d4884e6215
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 108 additions and 1 deletions

View file

@ -4,6 +4,7 @@ import 'package:emoji_picker_flutter/emoji_picker_flutter.dart';
import 'package:fluffychat/config/themes.dart';
import 'package:fluffychat/l10n/l10n.dart';
import 'package:fluffychat/pangea/chat/widgets/pangea_emoji_search_view.dart';
import 'chat.dart';
class ChatEmojiPicker extends StatelessWidget {
@ -89,8 +90,19 @@ class ChatEmojiPicker extends StatelessWidget {
bottom: EmojiPickerItem.emojiView,
),
searchViewConfig: SearchViewConfig(
backgroundColor: theme.colorScheme.surface,
backgroundColor:
theme.colorScheme.surfaceContainer,
buttonIconColor: theme.colorScheme.onSurface,
customSearchView:
(
Config config,
EmojiViewState state,
VoidCallback showEmojiView,
) => PangeaEmojiSearchView(
config,
state,
showEmojiView,
),
),
// Pangea#
),

View file

@ -0,0 +1,95 @@
import 'package:flutter/material.dart';
import 'package:emoji_picker_flutter/emoji_picker_flutter.dart';
class PangeaEmojiSearchView extends SearchView {
const PangeaEmojiSearchView(
super.config,
super.state,
super.showEmojiView, {
super.key,
});
@override
PangeaEmojiSearchViewState createState() => PangeaEmojiSearchViewState();
}
class PangeaEmojiSearchViewState extends SearchViewState {
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (context, constraints) {
final emojiSize = widget.config.emojiViewConfig.getEmojiSize(
constraints.maxWidth,
);
final emojiBoxSize = widget.config.emojiViewConfig.getEmojiBoxSize(
constraints.maxWidth,
);
return Container(
color: widget.config.searchViewConfig.backgroundColor,
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Row(
children: [
IconButton(
onPressed: () {
widget.showEmojiView();
},
color: widget.config.searchViewConfig.buttonIconColor,
icon: const Icon(Icons.arrow_back),
),
Expanded(
child: TextField(
onChanged: onTextInputChanged,
focusNode: focusNode,
style: widget.config.searchViewConfig.inputTextStyle,
decoration: InputDecoration(
border: InputBorder.none,
hintText: widget.config.searchViewConfig.hintText,
hintStyle: widget.config.searchViewConfig.hintTextStyle,
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
),
),
),
),
],
),
Expanded(
child: Material(
color: Theme.of(context).colorScheme.onInverseSurface,
child: EmojiContainer(
color: widget.config.emojiViewConfig.backgroundColor,
buttonMode: widget.config.emojiViewConfig.buttonMode,
child: GridView.builder(
padding: const EdgeInsets.symmetric(vertical: 4.0),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
childAspectRatio: 1,
crossAxisCount: widget.config.emojiViewConfig.columns,
mainAxisSpacing:
widget.config.emojiViewConfig.verticalSpacing,
crossAxisSpacing:
widget.config.emojiViewConfig.horizontalSpacing,
),
scrollDirection: Axis.vertical,
itemCount: results.length,
itemBuilder: (context, index) {
return buildEmoji(
results[index],
emojiSize,
emojiBoxSize,
);
},
),
),
),
),
],
),
);
},
);
}
}