Skip to content

Commit

Permalink
feat: improved some todo preview styles, animations, and functionality
Browse files Browse the repository at this point in the history
- add close, full-screen, and windowed dialog previews
- add full-screen and windowed transformation animations!
- add window transformation state
  • Loading branch information
Khip01 committed Jan 28, 2025
1 parent 810af96 commit 760273f
Show file tree
Hide file tree
Showing 6 changed files with 436 additions and 114 deletions.
2 changes: 2 additions & 0 deletions lib/app.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
import 'package:todo_list_app/screens/home/blocs/dialog_builder/dialog_builder_bloc.dart';
import 'package:todo_list_app/screens/home/blocs/setting/setting_bloc.dart';
import 'package:todo_list_app/screens/home/blocs/todo/todo_bloc.dart';
import 'package:todo_list_app/screens/home/blocs/todo_list/todo_list_bloc.dart';
Expand Down Expand Up @@ -36,6 +37,7 @@ class MainApp extends StatelessWidget {
BlocProvider(create: (context) => TodoListBloc()),
BlocProvider(create: (context) => TodoBloc()),
BlocProvider(create: (context) => SettingBloc()),
BlocProvider(create: (context) => DialogBuilderBloc()),
],
child: MaterialApp.router(
routerConfig: _router,
Expand Down
15 changes: 15 additions & 0 deletions lib/screens/home/blocs/dialog_builder/dialog_builder_bloc.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import 'package:bloc/bloc.dart';
import 'package:meta/meta.dart';

part 'dialog_builder_event.dart';
part 'dialog_builder_state.dart';

class DialogBuilderBloc extends Bloc<DialogBuilderEvent, DialogBuilderState> {
DialogBuilderBloc() : super(DialogBuilderInitial()) {
on<UpdateDialogScreenSizeEvent>(_dialogUpdateScreenSize);
}

void _dialogUpdateScreenSize(UpdateDialogScreenSizeEvent event, Emitter<DialogBuilderState> emit) {
emit(DialogBuilderLoaded(isMinimized: event.isMinimized));
}
}
10 changes: 10 additions & 0 deletions lib/screens/home/blocs/dialog_builder/dialog_builder_event.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
part of 'dialog_builder_bloc.dart';

@immutable
sealed class DialogBuilderEvent {}

final class UpdateDialogScreenSizeEvent extends DialogBuilderEvent {
final bool isMinimized;

UpdateDialogScreenSizeEvent({required this.isMinimized});
}
18 changes: 18 additions & 0 deletions lib/screens/home/blocs/dialog_builder/dialog_builder_state.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
part of 'dialog_builder_bloc.dart';

@immutable
sealed class DialogBuilderState {
final bool isMinimized;

const DialogBuilderState({
required this.isMinimized,
});
}

final class DialogBuilderInitial extends DialogBuilderState {
const DialogBuilderInitial({super.isMinimized = true});
}

final class DialogBuilderLoaded extends DialogBuilderState {
const DialogBuilderLoaded({required super.isMinimized});
}
226 changes: 112 additions & 114 deletions lib/screens/home/views/home_screen.dart
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import 'package:todo_list_app/screens/home/blocs/setting/setting_bloc.dart';
import 'package:todo_list_app/utils/constants.dart';

import 'package:todo_list_app/utils/style_util.dart';
import 'package:todo_list_app/widgets/custom_dialog_builder.dart';
import 'package:todo_list_app/widgets/list_tile_item.dart';
import 'package:todo_list_app/widgets/modal_bottom_sheet.dart';

Expand Down Expand Up @@ -341,7 +342,7 @@ class ContentBody extends StatelessWidget {
todo: todo,
listItemIndex: index,
listKey: listKey,
onTap: (dateStr) => _dialogBuilder(
onTap: (dateStr) => customDialogBuilder(
context: context,
todo: todo,
eventDateStart: dateStr,
Expand Down Expand Up @@ -482,119 +483,116 @@ class ContentBody extends StatelessWidget {
);
}

Future<void> _dialogBuilder({
required BuildContext context,
required Todo todo,
required String? eventDateStart
}) {
return showDialog(
context: context,
builder: (context) {
return AlertDialog(
backgroundColor: StyleUtil.c13,
shape: RoundedRectangleBorder(
side: BorderSide(
color: StyleUtil.c89,
width: 0.3,
),
borderRadius: BorderRadius.circular(6),
),
title: Container(
constraints: const BoxConstraints(
maxHeight: 125,
),
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: StyleUtil.c89,
width: 0.3,
),
),
),
padding: EdgeInsets.only(bottom: 8),
child: SingleChildScrollView(
child: SelectableText.rich(
TextSpan(
children: [
if (todo.check)
TextSpan(
text: "[COMPLETED] ",
style: StyleUtil.textXLMedium.copyWith(
color: StyleUtil.c255,
),
),
TextSpan(
text: todo.title,
style: StyleUtil.textXLRegular.copyWith(
color: todo.check ? StyleUtil.c200 : StyleUtil.c255,
),
),
],
),
),
),
),
content: SelectionArea(
child: SizedBox(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 250,
width: double.maxFinite,
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
todo.desc,
style: StyleUtil.textBaseRegular.copyWith(
color: StyleUtil.c200,
),
),
],
),
),
),
eventDateStart != null && eventDateStart.isNotEmpty
? Container(
constraints: const BoxConstraints(
maxHeight: 125,
),
width: double.maxFinite,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
const SpacingWidget(vertical: 20),
Text(
"Scheduled on ",
style: StyleUtil.textBaseMedium.copyWith(
color: StyleUtil.c255,
),
),
const SpacingWidget(vertical: 5),
Text(
eventDateStart,
style: StyleUtil.textBaseRegular.copyWith(
color: StyleUtil.c200,
),
),
],
),
)
: const SizedBox(),
],
),
),
),
);
},
);
}

// OLD Dialog Builder
// Future<void> _dialogBuilder(
// {required BuildContext context,
// required Todo todo,
// required String? eventDateStart}) {
// return showDialog(
// context: context,
// builder: (context) {
// return AlertDialog(
// backgroundColor: StyleUtil.c13,
// shape: RoundedRectangleBorder(
// side: BorderSide(
// color: StyleUtil.c89,
// width: 0.3,
// ),
// borderRadius: BorderRadius.circular(6),
// ),
// title: Container(
// constraints: const BoxConstraints(
// maxHeight: 125,
// ),
// decoration: BoxDecoration(
// border: Border(
// bottom: BorderSide(
// color: StyleUtil.c89,
// width: 0.3,
// ),
// ),
// ),
// padding: EdgeInsets.only(bottom: 8),
// child: SingleChildScrollView(
// child: SelectableText.rich(
// TextSpan(
// children: [
// if (todo.check)
// TextSpan(
// text: "[COMPLETED] ",
// style: StyleUtil.textXLMedium.copyWith(
// color: StyleUtil.c255,
// ),
// ),
// TextSpan(
// text: todo.title,
// style: StyleUtil.textXLRegular.copyWith(
// color: todo.check ? StyleUtil.c200 : StyleUtil.c255,
// ),
// ),
// ],
// ),
// ),
// ),
// ),
// content: SelectionArea(
// child: Column(
// mainAxisSize: MainAxisSize.min,
// crossAxisAlignment: CrossAxisAlignment.start,
// children: [
// SizedBox(
// height: 250,
// width: double.maxFinite,
// child: SingleChildScrollView(
// child: Column(
// mainAxisSize: MainAxisSize.min,
// crossAxisAlignment: CrossAxisAlignment.start,
// children: [
// Text(
// todo.desc,
// style: StyleUtil.textBaseRegular.copyWith(
// color: StyleUtil.c200,
// ),
// ),
// ],
// ),
// ),
// ),
// eventDateStart != null && eventDateStart.isNotEmpty
// ? Container(
// constraints: const BoxConstraints(
// maxHeight: 125,
// ),
// width: double.maxFinite,
// child: Column(
// crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisSize: MainAxisSize.min,
// children: [
// const SpacingWidget(vertical: 20),
// Text(
// "Scheduled on ",
// style: StyleUtil.textBaseMedium.copyWith(
// color: StyleUtil.c255,
// ),
// ),
// const SpacingWidget(vertical: 5),
// Text(
// eventDateStart,
// style: StyleUtil.textBaseRegular.copyWith(
// color: StyleUtil.c200,
// ),
// ),
// ],
// ),
// )
// : const SizedBox(),
// ],
// ),
// ),
// );
// },
// );
// }
}

class CustomAnimatedSettingIcon extends StatefulWidget {
Expand Down
Loading

0 comments on commit 760273f

Please sign in to comment.