feat: Refactor NoteEditorScreen for improved mobile layout handling and UI consistency

This commit is contained in:
2026-05-19 17:55:16 +02:00
parent c6994b9355
commit 59a5229e46
+16 -21
View File
@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
import 'package:notas/models/note.dart'; import 'package:notas/models/note.dart';
import 'package:notas/platform/app_platform.dart';
// NoteEditorScreen: unified UI for creating and editing notes. // NoteEditorScreen: unified UI for creating and editing notes.
// - Use `NoteEditorScreen.showDialog(context, note: existing)` to edit. // - Use `NoteEditorScreen.showDialog(context, note: existing)` to edit.
@@ -22,7 +23,7 @@ class NoteEditorScreen extends StatefulWidget {
State<NoteEditorScreen> createState() => _NoteEditorScreenState(); State<NoteEditorScreen> createState() => _NoteEditorScreenState();
static Future<dynamic> showDialog(BuildContext context, {Note? note}) { static Future<dynamic> showDialog(BuildContext context, {Note? note}) {
if (MediaQuery.sizeOf(context).width < 600) { if (isAndroid || isIOS) {
return showGeneralDialog<dynamic>( return showGeneralDialog<dynamic>(
context: context, context: context,
barrierDismissible: false, barrierDismissible: false,
@@ -81,7 +82,7 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
late Note _currentNote; late Note _currentNote;
late bool _isNewNote; late bool _isNewNote;
bool get _isCompactLayout => MediaQuery.sizeOf(context).width < 600; bool get _isMobileLayout => isAndroid || isIOS;
@override @override
void initState() { void initState() {
@@ -203,7 +204,7 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (_isCompactLayout) { if (_isMobileLayout) {
return Material( return Material(
color: Colors.transparent, color: Colors.transparent,
child: SafeArea( child: SafeArea(
@@ -338,23 +339,17 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
return LayoutBuilder( return LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) { builder: (BuildContext context, BoxConstraints constraints) {
final double maxWidth = math.min(600, constraints.maxWidth - 48); final double maxWidth = math.min(constraints.maxWidth - 32, 600);
final double maxHeight = math.min(constraints.maxHeight * 0.88, 720); final double maxHeight = math.min(constraints.maxHeight - 64, 720);
final double overlayTop = MediaQuery.paddingOf(context).top + 32; final double overlayTop = MediaQuery.paddingOf(context).top + 32;
return Stack( return Stack(
children: [ children: [
Positioned.fill( Positioned.fill(
top: overlayTop, top: overlayTop,
child: IgnorePointer( child: ModalBarrier(
child: Container( dismissible: false,
color: const Color.fromARGB( color: const Color.fromARGB(54, 0, 0, 0).withValues(alpha: 0.5),
54,
0,
0,
0,
).withValues(alpha: 0.5),
),
), ),
), ),
Positioned.fill( Positioned.fill(
@@ -425,7 +420,6 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
), ),
), ),
Expanded( Expanded(
child: SingleChildScrollView(
child: Padding( child: Padding(
padding: const EdgeInsets.all(20), padding: const EdgeInsets.all(20),
child: Column( child: Column(
@@ -440,17 +434,18 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
), ),
decoration: const InputDecoration( decoration: const InputDecoration(
hintText: 'Título', hintText: 'Título',
hintStyle: TextStyle( hintStyle: TextStyle(color: Colors.white30),
color: Colors.white30,
),
border: InputBorder.none, border: InputBorder.none,
contentPadding: EdgeInsets.zero, contentPadding: EdgeInsets.zero,
), ),
), ),
const SizedBox(height: 16), const SizedBox(height: 8),
TextField( Expanded(
child: TextField(
controller: _bodyController, controller: _bodyController,
keyboardType: TextInputType.multiline,
maxLines: null, maxLines: null,
expands: true,
style: const TextStyle( style: const TextStyle(
color: Colors.white, color: Colors.white,
fontSize: 16, fontSize: 16,
@@ -465,8 +460,8 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
contentPadding: EdgeInsets.zero, contentPadding: EdgeInsets.zero,
), ),
), ),
],
), ),
],
), ),
), ),
), ),