dart Flutter:当焦点位于TextField时,键盘立即消失

wooyq4lh  于 5个月前  发布在  Flutter
关注(0)|答案(3)|浏览(101)

当我点击文本字段开始写作,文本字段出现并立即消失.我试图删除ScreenUtil部件,它的工作,但我也试图通过删除ScreenUtils部件,它也工作,以取代生成路由GoRouter.但我需要这个ScreenUtils部件,以实现响应式应用程序
这是我的代码
main.dart:

import 'package:bloc/bloc.dart';
import 'package:elcampione/presentation/app.dart';
import 'package:elcampione/presentation/bloc_observer.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'data/repositories/repositories.dart';
import 'firebase_options.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  // Prevent screen from rotating
  SystemChrome.setPreferredOrientations(
      [DeviceOrientation.portraitUp, DeviceOrientation.portraitDown]);

  Bloc.observer = AppBlocObserver();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  final authenticationRepository = AuthenticationRepository();

  await authenticationRepository.user.first;

  runApp(App(authenticationRepository: authenticationRepository));
}

字符串
app.dart:

import 'package:elcampione/blocs/auth/auth_bloc.dart';
import 'package:elcampione/presentation/themes/theme.dart';
import 'package:elcampione/routes/routes.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../data/repositories/repositories.dart';

class App extends StatelessWidget {
  const App({
    super.key,
    required AuthenticationRepository authenticationRepository,
  }) : _authenticationRepository = authenticationRepository;

  final AuthenticationRepository _authenticationRepository;

  @override
  Widget build(BuildContext context) {
    return RepositoryProvider<AuthenticationRepository>(
      create: (context) => _authenticationRepository,
      child: BlocProvider(
        create: (_) => AuthBloc(
          authenticationRepository: _authenticationRepository,
        ),
        child: const AppView(),
      ),
    );
  }
}

class AppView extends StatelessWidget {
  const AppView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    final state = context.select((AuthBloc bloc) => bloc.state.status);
    final isAuthenticated = state == AuthStatus.authenticated;
    return ScreenUtilInit(
      builder: (context, child) => MaterialApp.router(
        debugShowCheckedModeBanner: false,
        theme: ThemeData(useMaterial3: true, colorScheme: darkColorScheme),
        darkTheme: ThemeData(useMaterial3: true, colorScheme: darkColorScheme),
        title: 'El Campione',
        locale: const Locale('en'),
        routerConfig: AppRouter.router(isAuthenticated),
      ),
      designSize: const Size(390, 844),
    );
  }
}


app_route_config.dart:

import 'package:elcampione/presentation/screens/screens.dart';
import 'package:elcampione/routes/app_route_constants.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

class AppRouter {
  static GoRouter router(bool isAuthenticated) {
    GoRouter routes = GoRouter(
      initialLocation: isAuthenticated ? '/home' : '/signin',
      routes: [
        GoRoute(
          name: AppRoutesConstants.home,
          path: '/home',
          builder: (context, state) => const HomeScreen(),
        ),
        GoRoute(
          name: AppRoutesConstants.signIn,
          path: '/signin',
          builder: (context, state) => const SignInScreen(),
        ),
        GoRoute(
          name: AppRoutesConstants.signUp,
          path: '/signup',
          builder: (context, state) => const SignUpScreen(),
        )
      ],
      redirect: (context, state) => !isAuthenticated ? '/signin' : null,
    );
    return routes;
  }
}

vwoqyblh

vwoqyblh1#

当我在代码中添加**'package:flutter_screenutil/flutter_screenutil. dart'**时,我遇到了同样的问题。
显然,MediaQuery.of(context)导致了整个小部件树的重建。

解决方案:删除我代码中所有剩余的Media.query(),替换为screenutil函数,现在键盘像以前一样打开了。

当所有的Media.query()被删除后,键盘再次打开。

egmofgnx

egmofgnx2#

在没有看到更多代码的情况下,我建议使用StatefulWidget而不是StatelessWidget。
我担心这里发生的是双重渲染。键盘消失了,因为它失去了焦点。
此外,检查日志-可能有一个错误(也许),因为有阻塞同步调用的混合。

zd287kbt

zd287kbt3#

当键盘出现时,TextFormField会重新生成,因此当键盘打开时,请求键盘的实际TextFormField不再可用,因此它会立即关闭
你可以通过使用全局键来解决这个问题,

Form(
    key: RouteHelper.myFormKey,
    child: Column(
        children: [
          TextFormField(
            initialValue: "1",
          )
      ]
    )
);

字符串
然后,您可以像这样在类中静态创建全局键

static final GlobalKey<FormState> myFormKey = GlobalKey<FormState>();

相关问题