feat(post_creatin): fixed animation widget for profile feed

This commit is contained in:
misha
2026-08-05 15:21:23 +03:00
parent 04de956769
commit 478a53674a
6 changed files with 727 additions and 162 deletions

View File

@@ -24,7 +24,11 @@ class ProfileBlogPostWidget extends StatefulWidget {
final int index;
final ProfileCubit profileCubit;
const ProfileBlogPostWidget({super.key, required this.index, required this.profileCubit});
const ProfileBlogPostWidget({
super.key,
required this.index,
required this.profileCubit,
});
@override
State<ProfileBlogPostWidget> createState() => _ProfileBlogPostWidgetState();
@@ -35,8 +39,11 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
late int totalLikes;
int currentGalleryIndex = 0;
void _openGallery(List<String> imageUrls, int index) {
context.pushTransparentRoute(rootNavigator: true, PhotoViewScreen(imageUrls: imageUrls, index: index));
void _openGallery(List<String> imageUrls, int index, {Object? heroTag}) {
context.pushTransparentRoute(
rootNavigator: true,
PhotoViewScreen(imageUrls: imageUrls, index: index, heroTag: heroTag),
);
}
@override
@@ -56,9 +63,13 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
return InkWell(
borderRadius: BorderRadius.circular(12),
onTap: () => GoRouter.of(context).pushNamed('blogPostScreen', extra: post.id),
onTap: () =>
GoRouter.of(context).pushNamed('blogPostScreen', extra: post.id),
child: Ink(
decoration: BoxDecoration(borderRadius: BorderRadius.circular(12), color: Colors.white),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
color: Colors.white,
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
@@ -74,9 +85,12 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
foregroundImage: NetworkImage(
post.author.authorProfileIcon.contains('https')
? post.author.authorProfileIcon
: sl<AppConfig>().baseUrl + post.author.authorProfileIcon,
: sl<AppConfig>().baseUrl +
post.author.authorProfileIcon,
),
backgroundImage: const AssetImage(
'assets/images/no_avatar.png',
),
backgroundImage: const AssetImage('assets/images/no_avatar.png'),
),
const SizedBox(width: 8),
Column(
@@ -84,12 +98,19 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
children: [
Text(
post.author.authorName,
style: const TextStyle(height: 1, color: Colors.black87, fontWeight: FontWeight.w500),
style: const TextStyle(
height: 1,
color: Colors.black87,
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 4),
Text(
'${calculateDifference(post.createdAt)} в ${post.createdAt.hour.toString().padLeft(2, '0')}:${post.createdAt.minute.toString().padLeft(2, '0')}',
style: const TextStyle(height: 1, color: Colors.black45),
style: const TextStyle(
height: 1,
color: Colors.black45,
),
),
],
),
@@ -112,12 +133,17 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Text(
post.title,
style: const TextStyle(fontWeight: FontWeight.w600, fontSize: 18, color: Colors.black87),
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18,
color: Colors.black87,
),
),
),
],
if (post.title.isEmpty) const SizedBox(height: 8),
if (post.title.isNotEmpty && post.description.isNotEmpty) const SizedBox(height: 8),
if (post.title.isNotEmpty && post.description.isNotEmpty)
const SizedBox(height: 8),
if (post.description.isNotEmpty)
Padding(
padding: const EdgeInsets.symmetric(horizontal: 12),
@@ -132,17 +158,34 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
padding: EdgeInsets.symmetric(horizontal: 12),
child: Text(
'Показать ещё',
style: TextStyle(height: 1, color: Color(0xFF8B8B8B), fontSize: 14, fontWeight: FontWeight.w600),
style: TextStyle(
height: 1,
color: Color(0xFF8B8B8B),
fontSize: 14,
fontWeight: FontWeight.w600,
),
),
),
if (post.title.isNotEmpty || post.description.isNotEmpty) const SizedBox(height: 8),
if (post.title.isNotEmpty || post.description.isNotEmpty)
const SizedBox(height: 8),
BlogPostMediaContent(
galleryImages: post.images,
imageUrl: imageUrl,
videoEmbedUrl: embedUrl != null && embedUrl.isNotEmpty ? embedUrl : null,
videoUrlThumb: post.videoUrlThumb != null ? PostFeedMapper.resolveMediaUrl(post.videoUrlThumb) : null,
videoEmbedUrl: embedUrl != null && embedUrl.isNotEmpty
? embedUrl
: null,
videoUrlThumb: post.videoUrlThumb != null
? PostFeedMapper.resolveMediaUrl(post.videoUrlThumb)
: null,
currentGalleryIndex: currentGalleryIndex,
onOpenGallery: _openGallery,
heroTag: 'profile-blog-post-${post.id}-cover',
onOpenGallery: (urls, index) => _openGallery(
urls,
index,
heroTag: urls.length == 1
? 'profile-blog-post-${post.id}-cover'
: null,
),
onGalleryChanged: (index) {
setState(() {
currentGalleryIndex = index;
@@ -155,18 +198,35 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
child: Row(
children: [
FeedIconButton(
icon: isLiked ? Icons.favorite_rounded : Icons.favorite_border_rounded,
icon: isLiked
? Icons.favorite_rounded
: Icons.favorite_border_rounded,
text: totalLikes.toString(),
iconColor: isLiked ? Colors.red.withValues(alpha: 0.8) : null,
backgroundColor: isLiked ? Colors.red.withValues(alpha: 0.1) : null,
textColor: isLiked ? Colors.red.withValues(alpha: 0.8) : null,
iconColor: isLiked
? Colors.red.withValues(alpha: 0.8)
: null,
backgroundColor: isLiked
? Colors.red.withValues(alpha: 0.1)
: null,
textColor: isLiked
? Colors.red.withValues(alpha: 0.8)
: null,
onTap: () async {
setState(() {
isLiked = !isLiked;
isLiked ? totalLikes++ : totalLikes--;
});
isLiked ? await context.read<FeedCubit>().likePost(post.id) : await context.read<FeedCubit>().unlikedPost(post.id);
widget.profileCubit.updateFeedBlogPostList(post, isLiked ? false : true);
isLiked
? await context.read<FeedCubit>().likePost(
post.id,
)
: await context.read<FeedCubit>().unlikedPost(
post.id,
);
widget.profileCubit.updateFeedBlogPostList(
post,
isLiked ? false : true,
);
},
),
const SizedBox(width: 8),
@@ -175,10 +235,15 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
'assets/icons/comment.svg',
height: 20,
width: 20,
colorFilter: ColorFilter.mode(appTheme.gray600, BlendMode.srcIn),
colorFilter: ColorFilter.mode(
appTheme.gray600,
BlendMode.srcIn,
),
),
text: post.totalComments.toString(),
onTap: () => GoRouter.of(context).pushNamed('blogPostScreen', extra: post.id),
onTap: () => GoRouter.of(
context,
).pushNamed('blogPostScreen', extra: post.id),
),
const SizedBox(width: 8),
FeedIconButton(
@@ -186,24 +251,38 @@ class _ProfileBlogPostWidgetState extends State<ProfileBlogPostWidget> {
height: 20,
width: 20,
'assets/icons/share.svg',
colorFilter: ColorFilter.mode(appTheme.gray600, BlendMode.srcIn),
colorFilter: ColorFilter.mode(
appTheme.gray600,
BlendMode.srcIn,
),
),
onTap: () {
final box = context.findRenderObject() as RenderBox?;
SharePlus.instance.share(
ShareParams(
uri: Uri.parse('${sl<AppConfig>().baseUrl}/ru/blog_post/${post.id}'),
sharePositionOrigin: box!.localToGlobal(Offset.zero) & box.size,
uri: Uri.parse(
'${sl<AppConfig>().baseUrl}/ru/blog_post/${post.id}',
),
sharePositionOrigin:
box!.localToGlobal(Offset.zero) & box.size,
),
);
},
),
const Spacer(),
Icon(Icons.visibility_rounded, size: 16, color: appTheme.gray500),
Icon(
Icons.visibility_rounded,
size: 16,
color: appTheme.gray500,
),
const SizedBox(width: 4),
Text(
post.totalViews.toString(),
style: TextStyle(fontSize: 12, color: appTheme.gray500, fontWeight: FontWeight.w400),
style: TextStyle(
fontSize: 12,
color: appTheme.gray500,
fontWeight: FontWeight.w400,
),
),
],
),