mirror of
https://github.com/twonlyapp/twonly-app.git
synced 2026-01-15 11:18:41 +00:00
starting with #2 animated emoji
This commit is contained in:
parent
1b249e494e
commit
baae1b04c0
11 changed files with 83 additions and 33 deletions
1
assets/animated_icons/red_heart.json
Normal file
1
assets/animated_icons/red_heart.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/💪.json
Normal file
1
assets/animated_icons/💪.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/🔥.json
Normal file
1
assets/animated_icons/🔥.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/😂.json
Normal file
1
assets/animated_icons/😂.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/😭.json
Normal file
1
assets/animated_icons/😭.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/🤠.json
Normal file
1
assets/animated_icons/🤠.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/🤯.json
Normal file
1
assets/animated_icons/🤯.json
Normal file
File diff suppressed because one or more lines are too long
1
assets/animated_icons/🥰.json
Normal file
1
assets/animated_icons/🥰.json
Normal file
File diff suppressed because one or more lines are too long
41
lib/src/components/animate_icon.dart
Normal file
41
lib/src/components/animate_icon.dart
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
import 'package:cv/cv.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lottie/lottie.dart';
|
||||
|
||||
// animations from: https://googlefonts.github.io/noto-emoji-animation/
|
||||
|
||||
class EmojiAnimation extends StatelessWidget {
|
||||
final String emoji;
|
||||
static final Map<String, String> animatedIcons = {
|
||||
"❤": "red_heart.json",
|
||||
"💪": "💪.json",
|
||||
"🔥": "🔥.json",
|
||||
"🤠": "🤠.json",
|
||||
"🤯": "🤯.json",
|
||||
"🥰": "🥰.json",
|
||||
"😂": "😂.json",
|
||||
"😭": "😭.json",
|
||||
};
|
||||
|
||||
const EmojiAnimation({super.key, required this.emoji});
|
||||
|
||||
static bool supported(String emoji) {
|
||||
return animatedIcons.containsKey(emoji);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// List of emojis and their corresponding Lottie file names
|
||||
|
||||
// Check if the emoji has a corresponding Lottie animation
|
||||
if (animatedIcons.containsKey(emoji)) {
|
||||
return Lottie.asset(
|
||||
"assets/animated_icons/${animatedIcons.getValue(emoji)}");
|
||||
} else {
|
||||
return Text(
|
||||
emoji,
|
||||
style: TextStyle(fontSize: 100), // Adjust the size as needed
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2,6 +2,7 @@ import 'dart:collection';
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:twonly/src/components/animate_icon.dart';
|
||||
import 'package:twonly/src/components/initialsavatar.dart';
|
||||
import 'package:twonly/src/components/message_send_state_icon.dart';
|
||||
import 'package:twonly/src/components/verified_shield.dart';
|
||||
|
|
@ -46,28 +47,39 @@ class ChatListEntry extends StatelessWidget {
|
|||
Widget child = Container();
|
||||
|
||||
if (content is TextMessageContent) {
|
||||
child = Container(
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: MediaQuery.of(context).size.width * 0.8,
|
||||
),
|
||||
padding: EdgeInsets.symmetric(
|
||||
vertical: 4, horizontal: 10), // Add some padding around the text
|
||||
decoration: BoxDecoration(
|
||||
color: right
|
||||
? const Color.fromARGB(107, 124, 77, 255)
|
||||
: const Color.fromARGB(
|
||||
83, 68, 137, 255), // Set the background color
|
||||
borderRadius: BorderRadius.circular(12.0), // Set border radius
|
||||
),
|
||||
child: SelectableText(
|
||||
content.text,
|
||||
style: TextStyle(
|
||||
color: Colors.white, // Set text color for contrast
|
||||
fontSize: 17,
|
||||
if (EmojiAnimation.supported(content.text)) {
|
||||
child = child = Container(
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: 100,
|
||||
),
|
||||
textAlign: TextAlign.left, // Center the text
|
||||
),
|
||||
);
|
||||
padding: EdgeInsets.symmetric(
|
||||
vertical: 4, horizontal: 10), // Add some padding around the text
|
||||
child: EmojiAnimation(emoji: content.text),
|
||||
);
|
||||
} else {
|
||||
child = Container(
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: MediaQuery.of(context).size.width * 0.8,
|
||||
),
|
||||
padding: EdgeInsets.symmetric(
|
||||
vertical: 4, horizontal: 10), // Add some padding around the text
|
||||
decoration: BoxDecoration(
|
||||
color: right
|
||||
? const Color.fromARGB(107, 124, 77, 255)
|
||||
: const Color.fromARGB(
|
||||
83, 68, 137, 255), // Set the background color
|
||||
borderRadius: BorderRadius.circular(12.0), // Set border radius
|
||||
),
|
||||
child: SelectableText(
|
||||
content.text,
|
||||
style: TextStyle(
|
||||
color: Colors.white, // Set text color for contrast
|
||||
fontSize: 17,
|
||||
),
|
||||
textAlign: TextAlign.left, // Center the text
|
||||
),
|
||||
);
|
||||
}
|
||||
} else if (content is MediaMessageContent && !content.isVideo) {
|
||||
Color color = message.messageContent
|
||||
.getColor(Theme.of(context).colorScheme.primary);
|
||||
|
|
|
|||
13
pubspec.yaml
13
pubspec.yaml
|
|
@ -82,18 +82,7 @@ flutter:
|
|||
|
||||
assets:
|
||||
# Add assets from the images directory to the application.
|
||||
- assets/images/logo.jpg
|
||||
- assets/
|
||||
- assets/images/
|
||||
- assets/images/onboarding/ricky_the_greedy_racoon.png
|
||||
- assets/animations/present.lottie.json
|
||||
- assets/animations/selfie2.json
|
||||
- assets/animations/selfie.json
|
||||
- assets/animations/takephoto.json
|
||||
- assets/animations/local.json
|
||||
- assets/animations/test.json
|
||||
- assets/animations/product.json
|
||||
- assets/animations/twonlies.json
|
||||
- assets/animations/rocket.json
|
||||
- assets/animations/e2e.json
|
||||
- assets/animated_icons/
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue