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: post_creation_screen

Browse source
This commit is contained in:
mike doornenbal 2024-07-30 14:35:29 +02:00
parent a7fff5ae91
commit 32fe08a7af
4 changed files with 144 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -3,8 +3,7 @@ import 'package:flutter/material.dart';
/// This class contains the paddings used in the timeline options /// This class contains the paddings used in the timeline options
class TimelinePaddingOptions { class TimelinePaddingOptions {
const TimelinePaddingOptions({ const TimelinePaddingOptions({
this.mainPadding = this.mainPadding = const EdgeInsets.only(left: 32, top: 20, right: 32),
const EdgeInsets.only(left: 12.0, top: 24.0, right: 12.0, bottom: 12.0),
this.postPadding = this.postPadding =
const EdgeInsets.only(left: 12.0, top: 6, right: 12.0, bottom: 8), const EdgeInsets.only(left: 12.0, top: 6, right: 12.0, bottom: 8),
this.postOverviewButtonBottomPadding = 30.0, this.postOverviewButtonBottomPadding = 30.0,

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

@ -11,6 +11,7 @@ import 'package:flutter_image_picker/flutter_image_picker.dart';
import 'package:flutter_timeline_interface/flutter_timeline_interface.dart'; import 'package:flutter_timeline_interface/flutter_timeline_interface.dart';
import 'package:flutter_timeline_view/flutter_timeline_view.dart'; import 'package:flutter_timeline_view/flutter_timeline_view.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/post_creation_textfield.dart';
class TimelinePostCreationScreen extends StatefulWidget { class TimelinePostCreationScreen extends StatefulWidget {
const TimelinePostCreationScreen({ const TimelinePostCreationScreen({
@ -119,6 +120,7 @@ class _TimelinePostCreationScreenState
} }
var theme = Theme.of(context); var theme = Theme.of(context);
return GestureDetector( return GestureDetector(
onTap: () => FocusScope.of(context).unfocus(), onTap: () => FocusScope.of(context).unfocus(),
child: Padding( child: Padding(
@ -130,48 +132,47 @@ class _TimelinePostCreationScreenState
children: [ children: [
Text( Text(
widget.options.translations.title, widget.options.translations.title,
style: const TextStyle( style: theme.textTheme.titleMedium,
fontWeight: FontWeight.w800, ),
fontSize: 20, const SizedBox(
), height: 4,
), ),
widget.options.textInputBuilder?.call( widget.options.textInputBuilder?.call(
titleController, titleController,
null, null,
'', '',
) ?? ) ??
TextField( PostCreationTextfield(
maxLength: widget.options.maxTitleLength,
controller: titleController, controller: titleController,
decoration: widget.options.contentInputDecoration ?? hintText: widget.options.translations.titleHintText,
InputDecoration( textMaxLength: widget.options.maxTitleLength,
hintText: widget.options.translations.titleHintText, decoration: widget.options.titleInputDecoration,
), textCapitalization: null,
expands: null,
minLines: null,
maxLines: 1,
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
Text( Text(
widget.options.translations.content, widget.options.translations.content,
style: const TextStyle( style: theme.textTheme.titleMedium,
fontWeight: FontWeight.w800,
fontSize: 20,
),
), ),
const SizedBox(height: 4),
Text( Text(
widget.options.translations.contentDescription, widget.options.translations.contentDescription,
style: theme.textTheme.bodyMedium, style: theme.textTheme.bodySmall,
), ),
// input field for the content const SizedBox(
TextField( height: 4,
),
PostCreationTextfield(
controller: contentController, controller: contentController,
hintText: widget.options.translations.contentHintText,
textMaxLength: null,
decoration: widget.options.contentInputDecoration,
textCapitalization: TextCapitalization.sentences, textCapitalization: TextCapitalization.sentences,
expands: false, expands: false,
maxLines: null,
minLines: null, minLines: null,
decoration: widget.options.contentInputDecoration ?? maxLines: null,
InputDecoration(
hintText: widget.options.translations.contentHintText,
),
), ),
const SizedBox( const SizedBox(
height: 16, height: 16,
@ -179,14 +180,11 @@ class _TimelinePostCreationScreenState
// input field for the content // input field for the content
Text( Text(
widget.options.translations.uploadImage, widget.options.translations.uploadImage,
style: const TextStyle( style: theme.textTheme.titleMedium,
fontWeight: FontWeight.w800,
fontSize: 20,
),
), ),
Text( Text(
widget.options.translations.uploadImageDescription, widget.options.translations.uploadImageDescription,
style: theme.textTheme.bodyMedium, style: theme.textTheme.bodySmall,
), ),
// image picker field // image picker field
const SizedBox( const SizedBox(
@ -273,19 +271,22 @@ class _TimelinePostCreationScreenState
Text( Text(
widget.options.translations.commentsTitle, widget.options.translations.commentsTitle,
style: const TextStyle( style: theme.textTheme.titleMedium,
fontWeight: FontWeight.w800,
fontSize: 20,
),
), ),
Text( Text(
widget.options.translations.allowCommentsDescription, widget.options.translations.allowCommentsDescription,
style: theme.textTheme.bodyMedium, style: theme.textTheme.bodySmall,
),
const SizedBox(
height: 8,
), ),
Row( Row(
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[ children: <Widget>[
Checkbox( Checkbox(
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
visualDensity:
const VisualDensity(horizontal: -4, vertical: -4),
activeColor: theme.colorScheme.primary, activeColor: theme.colorScheme.primary,
value: allowComments, value: allowComments,
onChanged: (value) { onChanged: (value) {
@ -294,8 +295,17 @@ class _TimelinePostCreationScreenState
}); });
}, },
), ),
Text(widget.options.translations.yes), Text(
widget.options.translations.yes,
style: theme.textTheme.bodyMedium,
),
const SizedBox(
width: 32,
),
Checkbox( Checkbox(
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
visualDensity:
const VisualDensity(horizontal: -4, vertical: -4),
activeColor: theme.colorScheme.primary, activeColor: theme.colorScheme.primary,
value: !allowComments, value: !allowComments,
onChanged: (value) { onChanged: (value) {
@ -304,47 +314,49 @@ class _TimelinePostCreationScreenState
}); });
}, },
), ),
Text(widget.options.translations.no), Text(
widget.options.translations.no,
style: theme.textTheme.bodyMedium,
),
], ],
), ),
const SizedBox(height: 120), const SizedBox(height: 120),
Align( SafeArea(
alignment: Alignment.bottomCenter, bottom: true,
child: (widget.options.buttonBuilder != null) child: Align(
? widget.options.buttonBuilder!( alignment: Alignment.bottomCenter,
context, child: (widget.options.buttonBuilder != null)
onPostCreated, ? widget.options.buttonBuilder!(
widget.options.translations.checkPost, context,
enabled: editingDone, onPostCreated,
) widget.options.translations.checkPost,
: ElevatedButton( enabled: editingDone,
style: ButtonStyle( )
backgroundColor: WidgetStatePropertyAll( : FilledButton(
theme.colorScheme.primary, style: ButtonStyle(
backgroundColor: WidgetStatePropertyAll(
theme.colorScheme.primary,
),
), ),
), onPressed: editingDone
onPressed: editingDone ? () async {
? () async { await onPostCreated();
await onPostCreated(); await widget.service.postService
await widget.service.postService .fetchPosts(null);
.fetchPosts(null); }
} : null,
: null, child: Padding(
child: Padding( padding: const EdgeInsets.all(8),
padding: const EdgeInsets.all(12.0), child: Text(
child: Text( widget.enablePostOverviewScreen
widget.enablePostOverviewScreen ? widget.options.translations.checkPost
? widget.options.translations.checkPost : widget.options.translations.postCreation,
: widget.options.translations.postCreation, style: theme.textTheme.displayLarge,
style: const TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w800,
), ),
), ),
), ),
), ),
), ),
], ],
), ),

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

@ -169,7 +169,7 @@ class _TimelinePostScreenState extends State<TimelinePostScreen> {
}, },
child: SingleChildScrollView( child: SingleChildScrollView(
child: Padding( child: Padding(
padding: widget.options.paddings.mainPadding, padding: widget.options.paddings.postPadding,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [

63
packages/flutter_timeline_view/lib/src/widgets/post_creation_textfield.dart Normal file
View file

@ -0,0 +1,63 @@
import 'package:flutter/material.dart';
class PostCreationTextfield extends StatelessWidget {
const PostCreationTextfield({
required this.controller,
required this.hintText,
super.key,
this.textMaxLength,
this.decoration,
this.textCapitalization,
this.expands,
this.minLines,
this.maxLines,
});
final TextEditingController controller;
final String hintText;
final int? textMaxLength;
final InputDecoration? decoration;
final TextCapitalization? textCapitalization;
// ignore: avoid_positional_boolean_parameters
final bool? expands;
final int? minLines;
final int? maxLines;
@override
Widget build(BuildContext context) {
var theme = Theme.of(context);
return TextField(
style: theme.textTheme.bodySmall,
controller: controller,
maxLength: textMaxLength,
decoration: decoration ??
InputDecoration(
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none,
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none,
),
contentPadding: const EdgeInsets.symmetric(
vertical: 0,
horizontal: 16,
),
hintText: hintText,
hintStyle: theme.textTheme.bodySmall!.copyWith(
color: theme.textTheme.bodySmall!.color!.withOpacity(0.5),
),
fillColor: Colors.white,
filled: true,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none,
),
),
textCapitalization: textCapitalization ?? TextCapitalization.none,
expands: expands ?? false,
minLines: minLines,
maxLines: maxLines,
);
}
}