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

fix: small ui fixes

Browse source
This commit is contained in:
mike doornenbal 2024-07-31 10:31:56 +02:00
parent c572e6cd8b
commit 1f629ddf1f
9 changed files with 315 additions and 283 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
packages/flutter_timeline_view/assets/Comment.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5 3.5C14.3587 3.5 17.5 6.64125 17.5 10.5C17.5 14.3587 14.3587 17.5 10.5 17.5C9.4675 17.5 8.4525 17.2725 7.49875 16.8175C7.2625 16.7037 7.00875 16.6513 6.74625 16.6513C6.58 16.6513 6.41375 16.6775 6.25625 16.7213L3.45625 17.5437L4.27875 14.7438C4.40125 14.3325 4.36625 13.8863 4.1825 13.5013C3.7275 12.5475 3.5 11.5325 3.5 10.5C3.5 6.64125 6.64125 3.5 10.5 3.5ZM10.5 1.75C5.67 1.75 1.75 5.67 1.75 10.5C1.75 11.8475 2.065 13.1075 2.59875 14.2538L0.875 20.125L6.74625 18.4013C7.8925 18.935 9.1525 19.25 10.5 19.25C15.33 19.25 19.25 15.33 19.25 10.5C19.25 5.67 15.33 1.75 10.5 1.75Z" fill="#212121"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 713 B

3
packages/flutter_timeline_view/assets/send.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.05813 12.3603L7.52523 16.4769L11.6405 22.944C12.0627 23.6073 12.7875 23.9999 13.5628 23.9999C13.6281 23.9999 13.6921 23.9974 13.7585 23.9913C14.6077 23.9186 15.3399 23.3858 15.6697 22.6006L23.8204 3.1673C24.1809 2.30831 23.989 1.3287 23.3318 0.6703C22.6734 0.0118984 21.6938 -0.181315 20.8348 0.179268L1.39902 8.33114C0.612628 8.66096 0.0797531 9.3932 0.008375 10.2424C-0.0642338 11.0915 0.339422 11.9037 1.05813 12.3603ZM2.1128 10.0331L21.5473 1.8825C21.6113 1.85542 21.6704 1.84435 21.7233 1.84435C21.8735 1.84435 21.9793 1.92926 22.0248 1.97603C22.0876 2.03756 22.2205 2.20862 22.1184 2.45352L13.9677 21.8881C13.8754 22.1084 13.6822 22.1465 13.6022 22.1539C13.5222 22.1588 13.3241 22.1539 13.1973 21.9533L9.36876 15.9378L14.4674 10.8392C14.828 10.4786 14.828 9.89408 14.4674 9.53349C14.1068 9.17291 13.5222 9.17291 13.1616 9.53349L8.06303 14.6321L2.04757 10.8035C1.85436 10.6805 1.83836 10.4971 1.84698 10.3986C1.85436 10.3199 1.89251 10.1254 2.1128 10.0331Z" fill="#212121"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

7
packages/flutter_timeline_view/lib/src/screens/timeline_post_creation_screen.dart
View file

@ -148,7 +148,7 @@ class _TimelinePostCreationScreenState
hintText: widget.options.translations.titleHintText, hintText: widget.options.translations.titleHintText,
textMaxLength: widget.options.maxTitleLength, textMaxLength: widget.options.maxTitleLength,
decoration: widget.options.titleInputDecoration, decoration: widget.options.titleInputDecoration,
textCapitalization: null, textCapitalization: TextCapitalization.sentences,
expands: null, expands: null,
minLines: null, minLines: null,
maxLines: 1, maxLines: 1,
@ -354,7 +354,9 @@ class _TimelinePostCreationScreenState
widget.options.translations.checkPost, widget.options.translations.checkPost,
enabled: editingDone, enabled: editingDone,
) ?? ) ??
DefaultFilledButton( Padding(
padding: const EdgeInsets.symmetric(horizontal: 48),
child: DefaultFilledButton(
onPressed: editingDone onPressed: editingDone
? () async { ? () async {
await onPostCreated(); await onPostCreated();
@ -368,6 +370,7 @@ class _TimelinePostCreationScreenState
), ),
), ),
), ),
),
], ],
), ),
), ),

16
packages/flutter_timeline_view/lib/src/screens/timeline_post_overview_screen.dart
View file

@ -27,6 +27,7 @@ class TimelinePostOverviewScreen extends StatelessWidget {
?.title ?? ?.title ??
timelinePost.category; timelinePost.category;
var buttonText = '${options.translations.postIn} $timelineCategoryName'; var buttonText = '${options.translations.postIn} $timelineCategoryName';
var isSubmitted = false;
return Column( return Column(
mainAxisSize: MainAxisSize.max, mainAxisSize: MainAxisSize.max,
children: [ children: [
@ -55,11 +56,20 @@ class TimelinePostOverviewScreen extends StatelessWidget {
buttonText, buttonText,
enabled: true, enabled: true,
) ?? ) ??
DefaultFilledButton( SafeArea(
onPressed: () async => onPostSubmit(timelinePost), bottom: true,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 80),
child: DefaultFilledButton(
onPressed: () async {
if (isSubmitted) return;
isSubmitted = true;
onPostSubmit(timelinePost);
},
buttonText: buttonText, buttonText: buttonText,
), ),
SizedBox(height: options.paddings.postOverviewButtonBottomPadding), ),
),
], ],
); );
} }

14
packages/flutter_timeline_view/lib/src/screens/timeline_post_screen.dart
View file

@ -6,6 +6,7 @@ import 'dart:async';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:flutter_timeline_interface/flutter_timeline_interface.dart'; import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
import 'package:flutter_timeline_view/src/config/timeline_options.dart'; import 'package:flutter_timeline_view/src/config/timeline_options.dart';
import 'package:flutter_timeline_view/src/widgets/reaction_bottom.dart'; import 'package:flutter_timeline_view/src/widgets/reaction_bottom.dart';
@ -355,10 +356,13 @@ class _TimelinePostScreenState extends State<TimelinePostScreen> {
const SizedBox(width: 8), const SizedBox(width: 8),
if (post.reactionEnabled) if (post.reactionEnabled)
widget.options.theme.commentIcon ?? widget.options.theme.commentIcon ??
Icon( SvgPicture.asset(
Icons.chat_bubble_outline_rounded, 'assets/Comment.svg',
package: 'flutter_timeline_view',
// ignore: deprecated_member_use
color: widget.options.theme.iconColor, color: widget.options.theme.iconColor,
size: widget.options.iconSize, width: widget.options.iconSize,
height: widget.options.iconSize,
), ),
], ],
), ),
@ -454,9 +458,7 @@ class _TimelinePostScreenState extends State<TimelinePostScreen> {
} }
}, },
child: Row( child: Row(
crossAxisAlignment: reaction.imageUrl != null crossAxisAlignment: CrossAxisAlignment.start,
? CrossAxisAlignment.start
: CrossAxisAlignment.center,
children: [ children: [
if (reaction.creator?.imageUrl != null && if (reaction.creator?.imageUrl != null &&
reaction.creator!.imageUrl!.isNotEmpty) ...[ reaction.creator!.imageUrl!.isNotEmpty) ...[

1
packages/flutter_timeline_view/lib/src/widgets/default_filled_button.dart
View file

@ -24,6 +24,7 @@ class DefaultFilledButton extends StatelessWidget {
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(8),
child: Text( child: Text(
buttonText, buttonText,
overflow: TextOverflow.ellipsis,
style: theme.textTheme.displayLarge, style: theme.textTheme.displayLarge,
), ),
), ),

7
packages/flutter_timeline_view/lib/src/widgets/reaction_bottom.dart
View file

@ -3,6 +3,7 @@
// SPDX-License-Identifier: BSD-3-Clause // SPDX-License-Identifier: BSD-3-Clause
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_timeline_view/src/config/timeline_options.dart'; import 'package:flutter_timeline_view/src/config/timeline_options.dart';
import 'package:flutter_timeline_view/src/config/timeline_translations.dart'; import 'package:flutter_timeline_view/src/config/timeline_translations.dart';
@ -43,8 +44,10 @@ class _ReactionBottomState extends State<ReactionBottom> {
_textEditingController.clear(); _textEditingController.clear();
} }
}, },
icon: Icon( icon: SvgPicture.asset(
Icons.send, 'assets/send.svg',
package: 'flutter_timeline_view',
// ignore: deprecated_member_use
color: widget.iconColor, color: widget.iconColor,
), ),
), ),

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

@ -4,6 +4,7 @@
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_timeline_interface/flutter_timeline_interface.dart'; import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
import 'package:flutter_timeline_view/src/config/timeline_options.dart'; import 'package:flutter_timeline_view/src/config/timeline_options.dart';
import 'package:flutter_timeline_view/src/widgets/tappable_image.dart'; import 'package:flutter_timeline_view/src/widgets/tappable_image.dart';
@ -53,9 +54,7 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
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; var isLikedByUser = widget.post.likedBy?.contains(widget.userId) ?? false;
return InkWell( return SizedBox(
onTap: widget.onTap,
child: SizedBox(
height: widget.post.imageUrl != null || widget.post.image != null height: widget.post.imageUrl != null || widget.post.image != null
? widget.options.postWidgetHeight ? widget.options.postWidgetHeight
: null, : null,
@ -98,8 +97,7 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
], ],
const SizedBox(width: 10), const SizedBox(width: 10),
Text( Text(
widget.options.nameBuilder widget.options.nameBuilder?.call(widget.post.creator) ??
?.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 style: widget.options.theme.textStyles
@ -132,8 +130,8 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
children: [ children: [
Text( Text(
widget.options.translations.deletePost, widget.options.translations.deletePost,
style: widget.options.theme.textStyles style: widget
.deletePostStyle ?? .options.theme.textStyles.deletePostStyle ??
theme.textTheme.bodyMedium, theme.textTheme.bodyMedium,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
@ -173,8 +171,7 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
late TimelinePost result; late TimelinePost result;
if (!liked) { if (!liked) {
result = result = await widget.service.postService.likePost(
await widget.service.postService.likePost(
userId, userId,
widget.post, widget.post,
); );
@ -250,10 +247,13 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
constraints: const BoxConstraints(), constraints: const BoxConstraints(),
onPressed: widget.onTap, onPressed: widget.onTap,
icon: widget.options.theme.commentIcon ?? icon: widget.options.theme.commentIcon ??
Icon( SvgPicture.asset(
Icons.chat_bubble_outline_outlined, 'assets/Comment.svg',
package: 'flutter_timeline_view',
// ignore: deprecated_member_use
color: widget.options.theme.iconColor, color: widget.options.theme.iconColor,
size: widget.options.iconSize, width: widget.options.iconSize,
height: widget.options.iconSize,
), ),
), ),
const SizedBox( const SizedBox(
@ -289,10 +289,13 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
constraints: const BoxConstraints(), constraints: const BoxConstraints(),
onPressed: widget.onTap, onPressed: widget.onTap,
icon: widget.options.theme.commentIcon ?? icon: widget.options.theme.commentIcon ??
Icon( SvgPicture.asset(
Icons.chat_bubble_outline_outlined, 'assets/Comment.svg',
package: 'flutter_timeline_view',
// ignore: deprecated_member_use
color: widget.options.theme.iconColor, color: widget.options.theme.iconColor,
size: widget.options.iconSize, width: widget.options.iconSize,
height: widget.options.iconSize,
), ),
), ),
], ],
@ -312,8 +315,8 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
Text( Text(
'${widget.post.likes} ' '${widget.post.likes} '
'${widget.options.translations.likesTitle}', '${widget.options.translations.likesTitle}',
style: widget style:
.options.theme.textStyles.listPostLikeTitleAndAmount ?? widget.options.theme.textStyles.listPostLikeTitleAndAmount ??
theme.textTheme.titleSmall!.copyWith( theme.textTheme.titleSmall!.copyWith(
color: Colors.black, color: Colors.black,
), ),
@ -330,27 +333,28 @@ class _TimelinePostWidgetState extends State<TimelinePostWidget> {
children: [ children: [
TextSpan( TextSpan(
text: widget.post.title, text: widget.post.title,
style: style: widget.options.theme.textStyles.listPostTitleStyle ??
widget.options.theme.textStyles.listPostTitleStyle ??
theme.textTheme.bodySmall, theme.textTheme.bodySmall,
), ),
], ],
), ),
), ),
const SizedBox(height: 4), const SizedBox(height: 4),
Text( InkWell(
onTap: widget.onTap,
child: Text(
widget.options.translations.viewPost, widget.options.translations.viewPost,
style: widget.options.theme.textStyles.viewPostStyle ?? style: widget.options.theme.textStyles.viewPostStyle ??
theme.textTheme.titleSmall!.copyWith( theme.textTheme.titleSmall!.copyWith(
color: const Color(0xFF8D8D8D), color: const Color(0xFF8D8D8D),
), ),
), ),
),
], ],
if (widget.options.dividerBuilder != null) if (widget.options.dividerBuilder != null)
widget.options.dividerBuilder!(), widget.options.dividerBuilder!(),
], ],
), ),
),
); );
} }
} }

5
packages/flutter_timeline_view/pubspec.yaml
View file

@ -17,7 +17,6 @@ dependencies:
intl: any intl: any
cached_network_image: ^3.2.2 cached_network_image: ^3.2.2
dotted_border: ^2.1.0 dotted_border: ^2.1.0
flutter_html: ^3.0.0-beta.2
flutter_timeline_interface: flutter_timeline_interface:
git: git:
@ -29,6 +28,7 @@ dependencies:
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
flutter_svg: ^2.0.10+1
dependency_overrides: dependency_overrides:
flutter_timeline_interface: flutter_timeline_interface:
@ -42,3 +42,6 @@ dev_dependencies:
ref: 6.0.0 ref: 6.0.0
flutter: flutter:
assets:
- assets/