【Flutter】パスワード入力用のTextFieldを作る

import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class PasswordTextField extends StatefulWidget {
  final TextEditingController controller;
  final String? labelText;
  final String? hintText;
  final int? maxLength;
  final TextInputAction? textInputAction;
  final void Function(String)? onChanged;
  final void Function(String)? onSubmitted;
  final void Function(bool)? onFocusChange;

  const PasswordTextField({
    super.key,
    required this.controller,
    this.labelText = 'パスワード',
    this.hintText,
    this.maxLength,
    this.textInputAction,
    this.onChanged,
    this.onSubmitted,
    this.onFocusChange,
  });

  @override
  State<PasswordTextField> createState() => _PasswordTextFieldState();
}

class _PasswordTextFieldState extends State<PasswordTextField> {
  bool _obscureText = true;

  @override
  Widget build(BuildContext context) {
    return Focus(
      onFocusChange: widget.onFocusChange,
      child: TextField(
        controller: widget.controller,
        decoration: InputDecoration(
          labelText: widget.labelText,
          hintText: widget.hintText,
          suffixIcon: GestureDetector(
            child: Icon(_obscureText ? FontAwesomeIcons.solidEyeSlash : FontAwesomeIcons.solidEye),
            onTap: () => setState(() => _obscureText ^= true),
          ),
        ),
        obscureText: _obscureText,
        autocorrect: false,
        enableInteractiveSelection: false,
        maxLength: widget.maxLength,
        textInputAction: widget.textInputAction,
        onChanged: widget.onChanged,
        onSubmitted: widget.onSubmitted,
      ),
    );
  }
}

$ flutter pub add font_awesome_flutter

class SignUpPage extends StatelessWidget {
  final _passwordController = TextEditingController();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      body: PasswordTextField(
        controller: _passwordController,
        textInputAction: TextInputAction.next,
        onChanged: (value) {
          _validate(value);
        },
        onFocusChange: (hasFocus) {
          if (!hasFocus) {
            フォーカスが外れた時...
          }
        },
      ),
    );
  }

  void _validate(String password) {
    // 何かバリデーションを行ったりする...
  }
}