internal/flutter_timeline
5
0
Fork 0
mirror of https://github.com/Iconica-Development/flutter_timeline.git synced 2025-05-19 02:23:46 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: timeline_screen

Browse source
This commit is contained in:
mike doornenbal 2024-07-29 16:39:56 +02:00
parent c99ecffa64
commit 38dd43ab39
10 changed files with 134 additions and 141 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
packages/flutter_timeline/lib/src/flutter_timeline_gorouter_userstory.dart
View file

@ -45,13 +45,13 @@ List<GoRoute> getTimelineStoryRoutes({
filterEnabled: config.filterEnabled, filterEnabled: config.filterEnabled,
postWidgetBuilder: config.postWidgetBuilder, postWidgetBuilder: config.postWidgetBuilder,
); );
var theme = Theme.of(context);
var button = FloatingActionButton( var button = FloatingActionButton(
backgroundColor: config backgroundColor: config
.optionsBuilder(context) .optionsBuilder(context)
.theme .theme
.postCreationFloatingActionButtonColor ?? .postCreationFloatingActionButtonColor ??
Theme.of(context).primaryColor, theme.colorScheme.primary,
onPressed: () async => context.push( onPressed: () async => context.push(
TimelineUserStoryRoutes.timelineCategorySelection, TimelineUserStoryRoutes.timelineCategorySelection,
), ),
@ -59,7 +59,7 @@ List<GoRoute> getTimelineStoryRoutes({
child: const Icon( child: const Icon(
Icons.add, Icons.add,
color: Colors.white, color: Colors.white,
size: 30, size: 24,
), ),
); );
@ -70,17 +70,12 @@ List<GoRoute> getTimelineStoryRoutes({
?.call(context, timelineScreen, button) ?? ?.call(context, timelineScreen, button) ??
Scaffold( Scaffold(
appBar: AppBar( appBar: AppBar(
backgroundColor: const Color(0xff212121),
title: Text( title: Text(
config config
.optionsBuilder(context) .optionsBuilder(context)
.translations .translations
.timeLineScreenTitle, .timeLineScreenTitle,
style: TextStyle( style: theme.textTheme.headlineLarge,
color: Theme.of(context).primaryColor,
fontSize: 24,
fontWeight: FontWeight.w800,
),
), ),
), ),
body: timelineScreen, body: timelineScreen,

13
packages/flutter_timeline/lib/src/flutter_timeline_navigator_userstory.dart
View file

@ -65,13 +65,13 @@ Widget _timelineScreenRoute({
filterEnabled: config.filterEnabled, filterEnabled: config.filterEnabled,
postWidgetBuilder: config.postWidgetBuilder, postWidgetBuilder: config.postWidgetBuilder,
); );
var theme = Theme.of(context);
var button = FloatingActionButton( var button = FloatingActionButton(
backgroundColor: config backgroundColor: config
.optionsBuilder(context) .optionsBuilder(context)
.theme .theme
.postCreationFloatingActionButtonColor ?? .postCreationFloatingActionButtonColor ??
Theme.of(context).primaryColor, theme.colorScheme.primary,
onPressed: () async => Navigator.of(context).push( onPressed: () async => Navigator.of(context).push(
MaterialPageRoute( MaterialPageRoute(
builder: (context) => _postCategorySelectionScreen( builder: (context) => _postCategorySelectionScreen(
@ -84,21 +84,16 @@ Widget _timelineScreenRoute({
child: const Icon( child: const Icon(
Icons.add, Icons.add,
color: Colors.white, color: Colors.white,
size: 30, size: 24,
), ),
); );
return config.homeOpenPageBuilder?.call(context, timelineScreen, button) ?? return config.homeOpenPageBuilder?.call(context, timelineScreen, button) ??
Scaffold( Scaffold(
appBar: AppBar( appBar: AppBar(
backgroundColor: const Color(0xff212121),
title: Text( title: Text(
config.optionsBuilder(context).translations.timeLineScreenTitle, config.optionsBuilder(context).translations.timeLineScreenTitle,
style: TextStyle( style: theme.textTheme.headlineLarge,
color: Theme.of(context).primaryColor,
fontSize: 24,
fontWeight: FontWeight.w800,
),
), ),
), ),
body: timelineScreen, body: timelineScreen,

4
packages/flutter_timeline_interface/lib/src/model/timeline_category.dart
View file

@ -5,13 +5,13 @@ class TimelineCategory {
const TimelineCategory({ const TimelineCategory({
required this.key, required this.key,
required this.title, required this.title,
required this.icon, this.icon,
this.canCreate = true, this.canCreate = true,
this.canView = true, this.canView = true,
}); });
final String? key; final String? key;
final String title; final String title;
final Widget icon; final Widget? icon;
final bool canCreate; final bool canCreate;
final bool canView; final bool canView;
} }

25
packages/flutter_timeline_view/lib/src/config/timeline_options.dart
View file

@ -19,7 +19,7 @@ class TimelineOptions {
this.imagePickerTheme = const ImagePickerTheme(), this.imagePickerTheme = const ImagePickerTheme(),
this.timelinePostHeight, this.timelinePostHeight,
this.sortCommentsAscending = true, this.sortCommentsAscending = true,
this.sortPostsAscending, this.sortPostsAscending = false,
this.doubleTapTolike = false, this.doubleTapTolike = false,
this.iconsWithValues = false, this.iconsWithValues = false,
this.likeAndDislikeIconsForDoubleTap = const ( this.likeAndDislikeIconsForDoubleTap = const (
@ -38,7 +38,7 @@ class TimelineOptions {
this.userAvatarBuilder, this.userAvatarBuilder,
this.anonymousAvatarBuilder, this.anonymousAvatarBuilder,
this.nameBuilder, this.nameBuilder,
this.iconSize = 26, this.iconSize = 24,
this.postWidgetHeight, this.postWidgetHeight,
this.filterOptions = const FilterOptions(), this.filterOptions = const FilterOptions(),
this.categoriesOptions = const CategoriesOptions(), this.categoriesOptions = const CategoriesOptions(),
@ -178,35 +178,14 @@ List<TimelineCategory> _getDefaultCategories(context) => [
const TimelineCategory( const TimelineCategory(
key: null, key: null,
title: 'All', title: 'All',
icon: Padding(
padding: EdgeInsets.only(right: 8.0),
child: Icon(
Icons.apps,
color: Colors.black,
),
),
), ),
const TimelineCategory( const TimelineCategory(
key: 'Category', key: 'Category',
title: 'Category', title: 'Category',
icon: Padding(
padding: EdgeInsets.only(right: 8.0),
child: Icon(
Icons.category,
color: Colors.black,
),
),
), ),
const TimelineCategory( const TimelineCategory(
key: 'Category with two lines', key: 'Category with two lines',
title: 'Category with two lines', title: 'Category with two lines',
icon: Padding(
padding: EdgeInsets.only(right: 8.0),
child: Icon(
Icons.category,
color: Colors.black,
),
),
), ),
]; ];

2
packages/flutter_timeline_view/lib/src/config/timeline_paddings.dart
View file

@ -6,7 +6,7 @@ class TimelinePaddingOptions {
this.mainPadding = this.mainPadding =
const EdgeInsets.only(left: 12.0, top: 24.0, right: 12.0, bottom: 12.0), const EdgeInsets.only(left: 12.0, top: 24.0, right: 12.0, bottom: 12.0),
this.postPadding = this.postPadding =
const EdgeInsets.symmetric(vertical: 12.0, horizontal: 12.0), const EdgeInsets.only(left: 12.0, top: 6, right: 12.0, bottom: 8),
this.postOverviewButtonBottomPadding = 30.0, this.postOverviewButtonBottomPadding = 30.0,
this.categoryButtonTextPadding, this.categoryButtonTextPadding,
}); });

2
packages/flutter_timeline_view/lib/src/config/timeline_translations.dart
View file

@ -76,7 +76,7 @@ class TimelineTranslations {
this.deleteCancelButton = 'Cancel', this.deleteCancelButton = 'Cancel',
this.deleteReaction = 'Delete Reaction', this.deleteReaction = 'Delete Reaction',
this.viewPost = 'View post', this.viewPost = 'View post',
this.likesTitle = 'Likes', this.likesTitle = 'likes',
this.commentsTitle = 'Are people allowed to comment?', this.commentsTitle = 'Are people allowed to comment?',
this.firstComment = 'Be the first to comment', this.firstComment = 'Be the first to comment',
this.writeComment = 'Write your comment here...', this.writeComment = 'Write your comment here...',

61
packages/flutter_timeline_view/lib/src/widgets/category_selector.dart
View file

@ -32,37 +32,40 @@ class _CategorySelectorState extends State<CategorySelector> {
widget.options.categoriesOptions.categoriesBuilder!(context); widget.options.categoriesOptions.categoriesBuilder!(context);
return SingleChildScrollView( return SingleChildScrollView(
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
child: Row( child: Padding(
children: [ padding: const EdgeInsets.symmetric(horizontal: 16),
SizedBox( child: Row(
width: widget.options.categoriesOptions children: [
.categorySelectorHorizontalPadding ?? SizedBox(
max(widget.options.paddings.mainPadding.left - 20, 0), width: widget.options.categoriesOptions
), .categorySelectorHorizontalPadding ??
for (var category in categories) ...[ max(widget.options.paddings.mainPadding.left - 20, 0),
widget.options.categoriesOptions.categoryButtonBuilder?.call( ),
category, for (var category in categories) ...[
() => widget.onTapCategory(category.key), widget.options.categoriesOptions.categoryButtonBuilder?.call(
widget.filter == category.key, category,
widget.isOnTop, () => widget.onTapCategory(category.key),
) ?? widget.filter == category.key,
Padding( widget.isOnTop,
padding: const EdgeInsets.symmetric(horizontal: 4), ) ??
child: CategorySelectorButton( Padding(
isOnTop: widget.isOnTop, padding: const EdgeInsets.symmetric(horizontal: 4),
category: category, child: CategorySelectorButton(
selected: widget.filter == category.key, isOnTop: widget.isOnTop,
onTap: () => widget.onTapCategory(category.key), category: category,
options: widget.options, selected: widget.filter == category.key,
onTap: () => widget.onTapCategory(category.key),
options: widget.options,
),
), ),
), ],
SizedBox(
width: widget.options.categoriesOptions
.categorySelectorHorizontalPadding ??
max(widget.options.paddings.mainPadding.right - 4, 0),
),
], ],
SizedBox( ),
width: widget.options.categoriesOptions
.categorySelectorHorizontalPadding ??
max(widget.options.paddings.mainPadding.right - 4, 0),
),
],
), ),
); );
} }

19
packages/flutter_timeline_view/lib/src/widgets/category_selector_button.dart
View file

@ -23,7 +23,8 @@ class CategorySelectorButton extends StatelessWidget {
var theme = Theme.of(context); var theme = Theme.of(context);
var size = MediaQuery.of(context).size; var size = MediaQuery.of(context).size;
return SizedBox( return AnimatedContainer(
duration: const Duration(milliseconds: 100),
height: isOnTop ? 140 : 40, height: isOnTop ? 140 : 40,
child: TextButton( child: TextButton(
onPressed: onTap, onPressed: onTap,
@ -81,11 +82,13 @@ class CategorySelectorButton extends StatelessWidget {
Flexible( Flexible(
child: Row( child: Row(
children: [ children: [
category.icon, if (category.icon != null) ...[
SizedBox( category.icon!,
width: SizedBox(
options.paddings.categoryButtonTextPadding ?? 8, width:
), options.paddings.categoryButtonTextPadding ?? 8,
),
],
Expanded( Expanded(
child: _CategoryButtonText( child: _CategoryButtonText(
category: category, category: category,
@ -124,7 +127,9 @@ class _CategoryButtonText extends StatelessWidget {
Widget build(BuildContext context) => Text( Widget build(BuildContext context) => Text(
category.title, category.title,
style: (options.theme.textStyles.categoryTitleStyle ?? style: (options.theme.textStyles.categoryTitleStyle ??
theme.textTheme.labelLarge) (selected
? theme.textTheme.titleMedium
: theme.textTheme.bodyMedium))
?.copyWith( ?.copyWith(
color: selected color: selected
? options.theme.categorySelectionButtonSelectedTextColor ?? ? options.theme.categorySelectionButtonSelectedTextColor ??

119
packages/flutter_timeline_view/lib/src/widgets/timeline_post_widget.dart
View file

@ -52,6 +52,7 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
var theme = Theme.of(context); var theme = Theme.of(context);
var isLikedByUser = widget.post.likedBy?.contains(widget.userId) ?? false;
return InkWell( return InkWell(
onTap: widget.onTap, onTap: widget.onTap,
child: SizedBox( child: SizedBox(
@ -103,7 +104,9 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
widget.options.translations.anonymousUser, widget.options.translations.anonymousUser,
style: widget.options.theme.textStyles style: widget.options.theme.textStyles
.postCreatorTitleStyle ?? .postCreatorTitleStyle ??
theme.textTheme.titleMedium, theme.textTheme.titleSmall!.copyWith(
color: Colors.black,
),
), ),
], ],
), ),
@ -204,17 +207,16 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
height: 8, height: 8,
), ),
// post information // post information
if (widget.options.iconsWithValues) if (widget.options.iconsWithValues) ...[
Row( Row(
children: [ children: [
TextButton.icon( IconButton(
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
onPressed: () async { onPressed: () async {
var userId = widget.userId; var userId = widget.userId;
var liked = if (!isLikedByUser) {
widget.post.likedBy?.contains(userId) ?? false;
if (!liked) {
await widget.service.postService.likePost( await widget.service.postService.likePost(
userId, userId,
widget.post, widget.post,
@ -228,61 +230,67 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
}, },
icon: widget.options.theme.likeIcon ?? icon: widget.options.theme.likeIcon ??
Icon( Icon(
widget.post.likedBy?.contains(widget.userId) ?? false isLikedByUser
? Icons.favorite_rounded ? Icons.favorite_rounded
: Icons.favorite_outline_outlined, : Icons.favorite_outline_outlined,
color: widget.options.theme.iconColor,
size: widget.options.iconSize,
), ),
label: Text('${widget.post.likes}'),
), ),
if (widget.post.reactionEnabled) const SizedBox(
TextButton.icon( width: 4,
),
Text('${widget.post.likes}'),
if (widget.post.reactionEnabled) ...[
const SizedBox(
width: 8,
),
IconButton(
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
onPressed: widget.onTap, onPressed: widget.onTap,
icon: widget.options.theme.commentIcon ?? icon: widget.options.theme.commentIcon ??
const Icon( Icon(
Icons.chat_bubble_outline_outlined, Icons.chat_bubble_outline_outlined,
color: widget.options.theme.iconColor,
size: widget.options.iconSize,
), ),
label: Text('${widget.post.reaction}'),
), ),
const SizedBox(
width: 4,
),
Text('${widget.post.reaction}'),
],
], ],
) ),
else ] else ...[
Row( Row(
children: [ children: [
if (widget.post.likedBy?.contains(widget.userId) ?? IconButton(
false) ...[ padding: EdgeInsets.zero,
InkWell( constraints: const BoxConstraints(),
onTap: widget.onTapUnlike, onPressed:
child: Container( isLikedByUser ? widget.onTapUnlike : widget.onTapLike,
color: Colors.transparent, icon: (isLikedByUser
child: widget.options.theme.likedIcon ?? ? widget.options.theme.likedIcon
Icon( : widget.options.theme.likeIcon) ??
Icons.favorite_rounded, Icon(
color: widget.options.theme.iconColor, isLikedByUser
size: widget.options.iconSize, ? Icons.favorite_rounded
), : Icons.favorite_outline,
), color: widget.options.theme.iconColor,
), size: widget.options.iconSize,
] else ...[ ),
InkWell( ),
onTap: widget.onTapLike,
child: Container(
color: Colors.transparent,
child: widget.options.theme.likeIcon ??
Icon(
Icons.favorite_outline,
color: widget.options.theme.iconColor,
size: widget.options.iconSize,
),
),
),
],
const SizedBox(width: 8), const SizedBox(width: 8),
if (widget.post.reactionEnabled) ...[ if (widget.post.reactionEnabled) ...[
Container( IconButton(
color: Colors.transparent, padding: EdgeInsets.zero,
child: widget.options.theme.commentIcon ?? constraints: const BoxConstraints(),
onPressed: widget.onTap,
icon: widget.options.theme.commentIcon ??
Icon( Icon(
Icons.chat_bubble_outline_rounded, Icons.chat_bubble_outline_outlined,
color: widget.options.theme.iconColor, color: widget.options.theme.iconColor,
size: widget.options.iconSize, size: widget.options.iconSize,
), ),
@ -290,6 +298,7 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
], ],
], ],
), ),
],
const SizedBox( const SizedBox(
height: 8, height: 8,
@ -305,23 +314,25 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
'${widget.options.translations.likesTitle}', '${widget.options.translations.likesTitle}',
style: widget style: widget
.options.theme.textStyles.listPostLikeTitleAndAmount ?? .options.theme.textStyles.listPostLikeTitleAndAmount ??
theme.textTheme.titleSmall, theme.textTheme.titleSmall!.copyWith(
color: Colors.black,
),
), ),
const SizedBox(height: 4),
Text.rich( Text.rich(
TextSpan( TextSpan(
text: widget.options.nameBuilder?.call(widget.post.creator) ?? text: widget.options.nameBuilder?.call(widget.post.creator) ??
widget.post.creator?.fullName ?? widget.post.creator?.fullName ??
widget.options.translations.anonymousUser, widget.options.translations.anonymousUser,
style: widget.options.theme.textStyles.listCreatorNameStyle ?? style: widget.options.theme.textStyles.listCreatorNameStyle ??
theme.textTheme.titleSmall, theme.textTheme.titleSmall!.copyWith(
color: Colors.black,
),
children: [ children: [
const TextSpan(text: ' '),
TextSpan( TextSpan(
text: widget.post.title, text: widget.post.title,
style: style:
widget.options.theme.textStyles.listPostTitleStyle ?? widget.options.theme.textStyles.listPostTitleStyle ??
theme.textTheme.bodyMedium, theme.textTheme.bodySmall,
), ),
], ],
), ),
@ -330,7 +341,9 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
Text( Text(
widget.options.translations.viewPost, widget.options.translations.viewPost,
style: widget.options.theme.textStyles.viewPostStyle ?? style: widget.options.theme.textStyles.viewPostStyle ??
theme.textTheme.bodySmall, theme.textTheme.titleSmall!.copyWith(
color: const Color(0xFF8D8D8D),
),
), ),
], ],
if (widget.options.dividerBuilder != null) if (widget.options.dividerBuilder != null)

13
packages/flutter_timeline_view/pubspec.yaml
View file

@ -9,7 +9,7 @@ version: 4.1.0
publish_to: none publish_to: none
environment: environment:
sdk: '>=3.1.3 <4.0.0' sdk: ">=3.1.3 <4.0.0"
dependencies: dependencies:
flutter: flutter:
@ -21,15 +21,19 @@ dependencies:
flutter_timeline_interface: flutter_timeline_interface:
git: git:
url: https://github.com/Iconica-Development/flutter_timeline url: https://github.com/Iconica-Development/flutter_timeline
path: packages/flutter_timeline_interface path: packages/flutter_timeline_interface
ref: 4.1.0 ref: 4.1.0
flutter_image_picker: flutter_image_picker:
git: git:
url: https://github.com/Iconica-Development/flutter_image_picker url: https://github.com/Iconica-Development/flutter_image_picker
ref: 1.0.5 ref: 1.0.5
collection: any collection: any
dependency_overrides:
flutter_timeline_interface:
path: packages/flutter_timeline_interface
dev_dependencies: dev_dependencies:
flutter_lints: ^2.0.0 flutter_lints: ^2.0.0
flutter_iconica_analysis: flutter_iconica_analysis:
@ -38,4 +42,3 @@ dev_dependencies:
ref: 6.0.0 ref: 6.0.0
flutter: flutter: