[FilmEditScreen] added validation

lib/l10n/intl_en.arb

@@ -150,5 +150,9 @@
             }
         }
     },
-    "close": "Close"
+    "close": "Close",
+    "filmFormula": "Formula",
+    "filmFormulaExponential": "T=t^Rf",
+    "filmFormulaExponentialRf": "Rf",
+    "name": "Name"
 }

lib/res/theme.dart

@@ -67,7 +67,8 @@ ThemeData themeFrom(Color primaryColor, Brightness brightness) {
       style: ListTileStyle.list,
       iconColor: scheme.onSurface,
       textColor: scheme.onSurface,
-      subtitleTextStyle: theme.textTheme.bodyMedium!.copyWith(color: scheme.onSurfaceVariant),
+      subtitleTextStyle: theme.textTheme.bodyMedium,
+      leadingAndTrailingTextStyle: theme.textTheme.bodyMedium,
     ),
   );
 }

lib/screens/film_edit/bloc_film_edit.dart

@@ -4,11 +4,18 @@ import 'package:lightmeter/screens/film_edit/state_film_edit.dart';
 import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
 
 class FilmEditBloc extends Bloc<FilmEditEvent, FilmEditState> {
+  final FilmExponential _originalFilm;
+  FilmExponential _newFilm;
+
   FilmEditBloc(FilmExponential film)
-      : super(
+      : _originalFilm = film,
+        _newFilm = film,
+        super(
           FilmEditState(
-            film,
+            name: film.name,
-            IsoValue.values.firstWhere((element) => element.value == film.iso),
+            isoValue: IsoValue.values.firstWhere((element) => element.value == film.iso),
+            exponent: film.exponent,
+            canSave: false,
           ),
         ) {
     on<FilmEditEvent>(
@@ -27,18 +34,47 @@ class FilmEditBloc extends Bloc<FilmEditEvent, FilmEditState> {
     );
   }
 
-  Future<void> _onNameChanged(FilmEditNameChangedEvent event, Emitter emit) async {}
+  Future<void> _onNameChanged(FilmEditNameChangedEvent event, Emitter emit) async {
-
+    _newFilm = _newFilm.copyWith(name: event.name);
-  Future<void> _onIsoChanged(FilmEditIsoChangedEvent event, Emitter emit) async {
     emit(
       FilmEditState(
-        state.film.copyWith(iso: event.iso.value),
+        name: event.name,
-        event.iso,
+        isoValue: state.isoValue,
+        exponent: state.exponent,
+        canSave: _canSave(event.name, state.exponent),
       ),
     );
   }
 
-  Future<void> _onExpChanged(FilmEditExpChangedEvent event, Emitter emit) async {}
+  Future<void> _onIsoChanged(FilmEditIsoChangedEvent event, Emitter emit) async {
+    _newFilm = _newFilm.copyWith(iso: event.iso.value);
+    emit(
+      FilmEditState(
+        name: state.name,
+        isoValue: event.iso,
+        exponent: state.exponent,
+        canSave: _canSave(state.name, state.exponent),
+      ),
+    );
+  }
+
+  Future<void> _onExpChanged(FilmEditExpChangedEvent event, Emitter emit) async {
+    if (event.exponent != null) {
+      _newFilm = _newFilm.copyWith(exponent: event.exponent);
+    }
+    emit(
+      FilmEditState(
+        name: state.name,
+        isoValue: state.isoValue,
+        exponent: event.exponent,
+        canSave: _canSave(state.name, event.exponent),
+      ),
+    );
+  }
 
   Future<void> _onSave(FilmEditSaveEvent _, Emitter emit) async {}
+
+  bool _canSave(String name, double? exponent) {
+    return name.isNotEmpty && exponent != null && _newFilm != _originalFilm;
+  }
 }

lib/screens/film_edit/components/exponential_formula_input/widget_input_exponential_formula.dart

@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:lightmeter/generated/l10n.dart';
+import 'package:lightmeter/res/dimens.dart';
+import 'package:lightmeter/screens/shared/text_field/widget_text_field.dart';
+
+class ExponentialFormulaInput extends StatefulWidget {
+  final double? value;
+  final ValueChanged<double?> onChanged;
+
+  const ExponentialFormulaInput({
+    super.key,
+    required this.value,
+    required this.onChanged,
+  });
+
+  @override
+  State<ExponentialFormulaInput> createState() => _ExponentialFormulaInputState();
+}
+
+class _ExponentialFormulaInputState extends State<ExponentialFormulaInput> {
+  TextStyle get style =>
+      Theme.of(context).textTheme.bodyMedium!.copyWith(color: Theme.of(context).listTileTheme.textColor);
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        ListTile(
+          leading: const Icon(Icons.show_chart),
+          title: Text(S.of(context).filmFormula),
+          trailing: Text(S.of(context).filmFormulaExponential),
+        ),
+        ListTile(
+          leading: const SizedBox(),
+          title: Text(
+            S.of(context).filmFormulaExponentialRf,
+            style: Theme.of(context).listTileTheme.titleTextStyle,
+          ),
+          trailing: SizedBox(
+            width: _textInputWidth(context),
+            child: LightmeterTextField(
+              initialValue: widget.value?.toString() ?? '',
+              inputFormatters: [FilteringTextInputFormatter.allow(RegExp("[0-9.]"))],
+              onChanged: (value) {
+                widget.onChanged(double.tryParse(value));
+              },
+              textAlign: TextAlign.end,
+              style: style,
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+
+  double _textInputWidth(BuildContext context) {
+    final textPainter = TextPainter(
+      text: TextSpan(text: widget.value.toString(), style: style),
+      maxLines: 1,
+      textDirection: TextDirection.ltr,
+    )..layout();
+    return textPainter.maxIntrinsicWidth + Dimens.grid4;
+  }
+}

lib/screens/film_edit/event_film_edit.dart

@@ -17,9 +17,9 @@ class FilmEditIsoChangedEvent extends FilmEditEvent {
 }
 
 class FilmEditExpChangedEvent extends FilmEditEvent {
-  final double exp;
+  final double? exponent;
 
-  const FilmEditExpChangedEvent(this.exp);
+  const FilmEditExpChangedEvent(this.exponent);
 }
 
 class FilmEditSaveEvent extends FilmEditEvent {

lib/screens/film_edit/screen_film_edit.dart

@@ -1,13 +1,15 @@
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:lightmeter/generated/l10n.dart';
+import 'package:lightmeter/res/dimens.dart';
 import 'package:lightmeter/screens/film_edit/bloc_film_edit.dart';
+import 'package:lightmeter/screens/film_edit/components/exponential_formula_input/widget_input_exponential_formula.dart';
 import 'package:lightmeter/screens/film_edit/event_film_edit.dart';
 import 'package:lightmeter/screens/film_edit/state_film_edit.dart';
 import 'package:lightmeter/screens/metering/components/shared/readings_container/components/shared/animated_dialog_picker/components/dialog_picker/widget_picker_dialog.dart';
-import 'package:lightmeter/screens/settings/components/shared/dialog_filter/widget_dialog_filter.dart';
-import 'package:lightmeter/screens/settings/components/shared/expandable_section_list/widget_expandable_section_list.dart';
 import 'package:lightmeter/screens/shared/sliver_screen/screen_sliver.dart';
+import 'package:lightmeter/screens/shared/text_field/widget_text_field.dart';
 import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
 
 class FilmEditScreen extends StatefulWidget {
@@ -22,21 +24,34 @@ class _FilmEditScreenState extends State<FilmEditScreen> {
   Widget build(BuildContext context) {
     return SliverScreen(
       title: BlocBuilder<FilmEditBloc, FilmEditState>(
-        buildWhen: (previous, current) => previous.film.name != current.film.name,
+        buildWhen: (previous, current) => previous.name != current.name,
-        builder: (context, state) => TextFormField(
+        builder: (_, state) => Text(state.name),
-          initialValue: state.film.name,
-          onChanged: (value) {},
-        ),
       ),
       appBarActions: [
-        IconButton(
+        BlocBuilder<FilmEditBloc, FilmEditState>(
-          onPressed: () {},
+          buildWhen: (previous, current) => previous.canSave != current.canSave,
+          builder: (context, state) => IconButton(
+            onPressed: state.canSave ? () {} : null,
             icon: const Icon(Icons.save),
           ),
+        ),
       ],
       slivers: [
         SliverToBoxAdapter(
-          child: BlocBuilder<FilmEditBloc, FilmEditState>(
+          child: Padding(
+            padding: const EdgeInsets.fromLTRB(
+              Dimens.paddingM,
+              0,
+              Dimens.paddingM,
+              Dimens.paddingM,
+            ),
+            child: Card(
+              child: Padding(
+                padding: const EdgeInsets.symmetric(vertical: Dimens.paddingM),
+                child: Column(
+                  children: [
+                    _NameFieldBuilder(),
+                    BlocBuilder<FilmEditBloc, FilmEditState>(
                       buildWhen: (previous, current) => previous.isoValue != current.isoValue,
                       builder: (context, state) => _IsoPickerListTile(
                         selected: state.isoValue,
@@ -45,14 +60,18 @@ class _FilmEditScreenState extends State<FilmEditScreen> {
                         },
                       ),
                     ),
+                    BlocBuilder<FilmEditBloc, FilmEditState>(
+                      buildWhen: (previous, current) => previous.exponent != current.exponent,
+                      builder: (context, state) => ExponentialFormulaInput(
+                        value: state.exponent,
+                        onChanged: (value) {
+                          context.read<FilmEditBloc>().add(FilmEditExpChangedEvent(value));
+                        },
+                      ),
+                    ),
+                  ],
+                ),
               ),
-        SliverToBoxAdapter(
-          child: BlocBuilder<FilmEditBloc, FilmEditState>(
-            buildWhen: (previous, current) => previous.film.exponent != current.film.exponent,
-            builder: (context, state) => ListTile(
-              leading: const Icon(Icons.equalizer),
-              title: Text('Formula'),
-              trailing: Text(state.film.exponent.toString()),
             ),
           ),
         ),
@@ -62,6 +81,33 @@ class _FilmEditScreenState extends State<FilmEditScreen> {
   }
 }
 
+class _NameFieldBuilder extends StatelessWidget {
+  const _NameFieldBuilder();
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(
+        left: Dimens.paddingM,
+        top: Dimens.paddingS / 2,
+        right: Dimens.paddingL,
+        bottom: Dimens.paddingS / 2,
+      ),
+      child: BlocBuilder<FilmEditBloc, FilmEditState>(
+        buildWhen: (previous, current) => previous.name != current.name,
+        builder: (context, state) => LightmeterTextField(
+          initialValue: state.name,
+          onChanged: (value) {
+            context.read<FilmEditBloc>().add(FilmEditNameChangedEvent(value));
+          },
+          style: Theme.of(context).listTileTheme.titleTextStyle,
+          leading: const Icon(Icons.edit_outlined),
+        ),
+      ),
+    );
+  }
+}
+
 class _IsoPickerListTile extends StatelessWidget {
   final IsoValue selected;
   final ValueChanged<IsoValue> onChanged;

lib/screens/film_edit/state_film_edit.dart

@@ -1,8 +1,15 @@
 import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
 
 class FilmEditState {
-  final FilmExponential film;
+  final String name;
   final IsoValue isoValue;
+  final double? exponent;
+  final bool canSave;
 
-  const FilmEditState(this.film, this.isoValue);
+  const FilmEditState({
+    required this.name,
+    required this.isoValue,
+    required this.exponent,
+    required this.canSave,
+  });
 }

lib/screens/shared/text_field/widget_text_field.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+
+class LightmeterTextField extends TextFormField {
+  LightmeterTextField({
+    super.controller,
+    super.focusNode,
+    super.initialValue,
+    super.inputFormatters,
+    super.onChanged,
+    super.style,
+    super.textAlign,
+    Widget? leading,
+  }) : super(
+          autovalidateMode: AutovalidateMode.onUserInteraction,
+          maxLines: 1,
+          decoration: InputDecoration(
+            contentPadding: EdgeInsets.zero,
+            errorStyle: const TextStyle(fontSize: 0),
+            icon: leading,
+          ),
+          validator: (value) {
+            if (value == null || value.isEmpty) {
+              return '';
+            } else {
+              return null;
+            }
+          },
+        );
+}