SolarNetwork/App
3
3
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Introduce cuite reaction

Browse Source
This commit is contained in:
LittleSheep
2025-09-23 23:39:58 +08:00
parent 866674ddde
commit 4293daaa2f
7 changed files with 167 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/stickers/angry.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 621 KiB

BIN
assets/images/stickers/clap.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 643 KiB

BIN
assets/images/stickers/confuse.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 671 KiB

BIN
assets/images/stickers/pray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 668 KiB

BIN
assets/images/stickers/thumb_up.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 625 KiB

136
lib/widgets/post/post_item.dart
View File

@@ -31,6 +31,29 @@ import 'package:share_plus/share_plus.dart';
import 'package:styled_widget/styled_widget.dart'; import 'package:styled_widget/styled_widget.dart';
import 'package:super_context_menu/super_context_menu.dart'; import 'package:super_context_menu/super_context_menu.dart';
const kAvailableStickers = {'angry', 'clap', 'confuse', 'pray', 'thumb_up'};
bool _getReactionImageAvailable(String symbol) {
return kAvailableStickers.contains(symbol);
}
Widget _buildReactionIcon(String symbol, double size, {double iconSize = 24}) {
if (_getReactionImageAvailable(symbol)) {
return Image.asset(
'assets/images/stickers/$symbol.png',
width: size,
height: size,
fit: BoxFit.contain,
alignment: Alignment.bottomCenter,
);
} else {
return Text(
kReactionTemplates[symbol]?.icon ?? '',
style: TextStyle(fontSize: iconSize),
);
}
}
class PostActionableItem extends HookConsumerWidget { class PostActionableItem extends HookConsumerWidget {
final SnPost item; final SnPost item;
final EdgeInsets? padding; final EdgeInsets? padding;
@@ -490,7 +513,10 @@ class PostItem extends HookConsumerWidget {
trailing: trailing:
isCompact isCompact
? null ? null
: IconButton( : SizedBox(
width: 36,
height: 36,
child: IconButton(
icon: icon:
mostReaction == null mostReaction == null
? const Icon(Symbols.add_reaction) ? const Icon(Symbols.add_reaction)
@@ -508,10 +534,10 @@ class PostItem extends HookConsumerWidget {
).colorScheme.primary.withOpacity(0.75), ).colorScheme.primary.withOpacity(0.75),
textColor: textColor:
Theme.of(context).colorScheme.onPrimary, Theme.of(context).colorScheme.onPrimary,
child: Text( child: _buildReactionIcon(
kReactionTemplates[mostReaction]?.icon ?? '', mostReaction,
style: const TextStyle(fontSize: 20), 32,
), ).padding(bottom: 2),
), ),
style: ButtonStyle( style: ButtonStyle(
backgroundColor: WidgetStatePropertyAll( backgroundColor: WidgetStatePropertyAll(
@@ -544,6 +570,7 @@ class PostItem extends HookConsumerWidget {
), ),
), ),
), ),
),
PostBody( PostBody(
item: item, item: item,
isFullPost: isFullPost, isFullPost: isFullPost,
@@ -611,7 +638,7 @@ class PostReactionList extends HookConsumerWidget {
} }
return SizedBox( return SizedBox(
height: 28, height: 40,
child: ListView( child: ListView(
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
padding: padding ?? EdgeInsets.zero, padding: padding ?? EdgeInsets.zero,
@@ -649,7 +676,7 @@ class PostReactionList extends HookConsumerWidget {
Padding( Padding(
padding: const EdgeInsets.only(right: 8), padding: const EdgeInsets.only(right: 8),
child: ActionChip( child: ActionChip(
avatar: Text(kReactionTemplates[symbol]?.icon ?? '?'), avatar: _buildReactionIcon(symbol, 24),
label: Row( label: Row(
spacing: 4, spacing: 4,
children: [ children: [
@@ -786,38 +813,97 @@ class _PostReactionSheet extends StatelessWidget {
itemBuilder: (context, index) { itemBuilder: (context, index) {
final symbol = allReactions[index]; final symbol = allReactions[index];
final count = reactionsCount[symbol] ?? 0; final count = reactionsCount[symbol] ?? 0;
return Card( final hasImage = _getReactionImageAvailable(symbol);
return Badge(
label: Text('x$count'),
isLabelVisible: count > 0,
textColor: Theme.of(context).colorScheme.onPrimary,
backgroundColor: Theme.of(context).colorScheme.primary,
offset: Offset(0, 0),
child: Card(
margin: const EdgeInsets.symmetric(vertical: 4), margin: const EdgeInsets.symmetric(vertical: 4),
color: color: Theme.of(context).colorScheme.surfaceContainerLowest,
(reactionsMade[symbol] ?? false)
? Theme.of(context).colorScheme.primaryContainer
: Theme.of(context).colorScheme.surfaceContainerLowest,
child: InkWell( child: InkWell(
borderRadius: const BorderRadius.all(Radius.circular(8)), borderRadius: const BorderRadius.all(Radius.circular(8)),
onTap: () { onTap: () {
onReact(symbol, attitude); onReact(symbol, attitude);
Navigator.pop(context); Navigator.pop(context);
}, },
child: Column( child: Container(
mainAxisAlignment: MainAxisAlignment.center, decoration:
hasImage
? BoxDecoration(
borderRadius: BorderRadius.circular(8),
image: DecorationImage(
image: AssetImage(
'assets/images/stickers/$symbol.png',
),
fit: BoxFit.cover,
colorFilter:
(reactionsMade[symbol] ?? false)
? ColorFilter.mode(
Theme.of(context)
.colorScheme
.primaryContainer
.withOpacity(0.7),
BlendMode.srcATop,
)
: null,
),
)
: null,
child: Stack(
fit: StackFit.expand,
children: [ children: [
Text( if (hasImage)
kReactionTemplates[symbol]?.icon ?? '', Container(
textAlign: TextAlign.center, decoration: BoxDecoration(
).fontSize(24), borderRadius: BorderRadius.circular(8),
gradient: LinearGradient(
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
colors: [
Theme.of(context)
.colorScheme
.surfaceContainerHighest
.withOpacity(0.7),
Colors.transparent,
],
stops: [0.0, 0.3],
),
),
),
Column(
mainAxisAlignment:
hasImage
? MainAxisAlignment.end
: MainAxisAlignment.center,
children: [
if (!hasImage) _buildReactionIcon(symbol, 36),
Text( Text(
ReactInfo.getTranslationKey(symbol), ReactInfo.getTranslationKey(symbol),
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle(
color: hasImage ? Colors.white : null,
shadows:
hasImage
? [
const Shadow(
blurRadius: 4,
offset: Offset(0.5, 0.5),
color: Colors.black,
),
]
: null,
),
).tr(), ).tr(),
if (count > 0) if (hasImage) const Gap(4),
Text(
'x$count',
textAlign: TextAlign.center,
).bold().padding(bottom: 4)
else
const Gap(20),
], ],
), ),
],
),
),
),
), ),
); );
}, },

1
pubspec.yaml
View File

@@ -189,6 +189,7 @@ flutter:
- assets/i18n/ - assets/i18n/
- assets/images/ - assets/images/
- assets/images/oidc/ - assets/images/oidc/
- assets/images/stickers/
- assets/icons/ - assets/icons/
# An image asset can refer to one or more resolution-specific "variants", see # An image asset can refer to one or more resolution-specific "variants", see