Question

按下此TextFormField时，不会获得焦点。这是我的包含TextFormField的小部件的代码

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:cyphlyfe/profile/notifiers/profileNotifier.dart';

class Bio extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final pNotifier = Provider.of<ProfileNotifier>(context);
    return Padding(
      padding: EdgeInsets.only(
        top: 15,
        left: 30,
        right: 30,
      ),
      child: pNotifier.editMode ? TextFormField(
        keyboardType: TextInputType.text,
        initialValue: pNotifier.profileInfo['bio'],
        maxLengthEnforced: true,
        maxLength: 140,
        decoration: InputDecoration(hintText: 'Write your bio here'),
        onChanged: (value) => pNotifier.updateProfileInfo('bio', value),
        style: TextStyle(
          fontSize: 16,
        ),
      ) : Text(
        pNotifier.profileInfo['bio'].isEmpty
            ? 'You have no bio. Add one!'
            : pNotifier.profileInfo['bio'],
        style: TextStyle(
          color: Colors.grey.shade600,
          fontSize: 16,
        ),
      ),
    );
  }
}

这是用于切换editMode的按钮（导致出现TextFormField）

import 'package:cyphlyfe/profile/notifiers/profileNotifier.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class ButtonEdit extends StatefulWidget {
  @override
  _ButtonEditState createState() => _ButtonEditState();
}

class _ButtonEditState extends State<ButtonEdit> {
  ProfileNotifier pNotifier;

  @override
  Widget build(BuildContext context) {
    pNotifier = Provider.of<ProfileNotifier>(context);
    return pNotifier.editMode ? IconButton(
      icon: Icon(Icons.check),
      onPressed: onSave,
    ) : IconButton(
      icon: Icon(Icons.edit),
      onPressed: onEdit,
    );
  }

  void onEdit() {
    pNotifier.editMode = true;
  }

  Future<void> onSave() async {
    // todo: upload profile pic to firebase storage
    // todo: send profileInfo data in pNotifier to user service to update user record
    pNotifier.editMode = false;
    _showSavedSnackBar();

  }

  void _showSavedSnackBar() {
    Scaffold.of(context).showSnackBar(SnackBar(
      content: Row(
        children: <Widget>[
          Icon(
            Icons.check_circle,
            color: Colors.green,
            size: 24.0,
          ),
          SizedBox(width: 5.0),
          Text("Changes saved successfully.")
        ],
      ),
    ));
  }
}

此外，这是父窗口小部件

import 'package:cyphlyfe/profile/widgets/appName.dart';
import 'package:cyphlyfe/profile/widgets/backdrop.dart';
import 'package:cyphlyfe/profile/widgets/bio.dart';
import 'package:cyphlyfe/profile/widgets/btnVideoCall.dart';
import 'package:cyphlyfe/profile/widgets/name.dart';
import 'package:cyphlyfe/profile/widgets/profileAppBar.dart';
import 'package:cyphlyfe/profile/widgets/profilePic.dart';
import 'package:flutter/material.dart';

class Profile extends StatefulWidget {
  @override
  _ProfileState createState() => _ProfileState();
}

class _ProfileState extends State<Profile> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
          children: <Widget>[
            Backdrop(),
            Container(
              margin: EdgeInsets.only(top: 90),
              child: Column(
                children: <Widget>[
                  AppName(),
                  SizedBox(height: 20.0),
                  ProfilePic(),
                  SizedBox(height: 10),
                  Name(),
                  Bio(),
                  SizedBox(height: 10),
                  ButtonVideoCall(),
                ],
              ),
            ),
            ProfileAppBar(),
          ],
        ),
    );
  }
}

如果有意义，minSdkVersion为16，compileSdkVersion为28，targetSdkVersion为28。我在做什么错了？

Answer 1

原来是堆栈中小部件的顺序。 ProfileAppBar显示在Container的顶部，阻止对Container的子小部件进行手势检测。我将ProfileAppBar放在Container之前，一切又恢复正常了。

Answer 2

将焦点节点传递到TextFormField小部件
按下Button时，只需调用 myFocusNode.requestFocus（）

Ref

按下时TextFormField无法获得焦点

2 个答案: