Why it navigate me back to previous screen when the Text Field get focusing and keyboard appears?

Viewed 574

I have simple application which consists of following screens:

Landing Screen Login Screen Verification Screen

When try to write something on the verification screen, as the keyboard appears and the text field is getting focus, the keyboard closes automatically ,it navigate me back to the Login screen without giving any error or bugs. I don't know why it is happening?

info: I run application on both physical and emulator, but the is not any difference, and the flutter version is 2.0.3, dart 2.12.2

here the flutter doctor:

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.0.3, on Microsoft Windows [Version 
10.0.18363.1440], locale en-US)
[√] Android toolchain - develop for Android devices (Android SDK version 
30.0.3)
[√] Chrome - develop for the web
[√] Android Studio (version 4.1.0)
[√] IntelliJ IDEA Ultimate Edition (version 2020.2)
[√] VS Code (version 1.53.2)
[√] Connected device (3 available)

here is the code base of main:

void main() async {
WidgetsFlutterBinding.ensureInitialized();

runApp(
MyApp(),
);
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
  title:TextConstants.appName,
  debugShowCheckedModeBanner: false,
  home: LandingScreen(),
  initialRoute: '/landing-screen',
  defaultTransition: Transition.downToUp,
  getPages: [
    GetPage(
      name: '/landing-screen',
      page: () => LandingScreen(),
    ),
    GetPage(
      name: '/login-screen',
      page: () => LoginScreen(),
    ),
    GetPage(
      name: '/verification-screen',
      page: () => VerificationScreen(),
    ),
  ],
);
}
}

Here is the code base of landing screen:

 @override
void didChangeDependencies() async {
super.didChangeDependencies();

if( await NetworkingUtils.checkInternetConnection()){
  // if it's connected.
  Get.toNamed("/login-screen");
} else {
  // if it's not connected.
  Get.snackbar(
    'Warning', // title
    'You don\'t have internet connection',
    icon: Icon(Icons.warning,color: Colors.white,),
    snackPosition: SnackPosition.BOTTOM,
    borderRadius: 0,
    showProgressIndicator: true,
    mainButton: TextButton(onPressed: (){}, child: Text('Check')),
    colorText: Colors.white,
    forwardAnimationCurve: Curves.bounceIn,
    isDismissible: false,
    reverseAnimationCurve: Curves.easeInOut,

  );
}

}

@override
Widget build(BuildContext context) {
double height = MediaQuery.of(context).size.height;
double width = MediaQuery.of(context).size.width;
return Scaffold(
  backgroundColor: Colors.lightBlueAccent,
  body: Container(
    decoration: BoxDecoration(
      image: DecorationImage(
        image: AssetImage('assets/images/landing_background.png'),
        fit: BoxFit.fill
      )
    ),
    child: Center(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: AvatarGlow(
          glowColor: Colors.white,
          endRadius: width*0.44,
          showTwoGlows: true,
          repeat: true,
          duration: Duration(milliseconds: 1000),
          animate: true,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(200.0),
            child: Container(
              height: width*0.6,
              width: width*0.6,
              child: Image.asset('assets/images/smart_city_logo.png'),
            ),
          ),
        ),
      ),
    ),
  ),
);
}
}

Here is the code base of Login Screen:

class LoginScreen extends StatefulWidget {
@override
_LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {

TextEditingController _phoneNumberController = TextEditingController();
bool isLoading = false;


@override
Widget build(BuildContext context) {
double height = MediaQuery.of(context).size.height;
double width = MediaQuery.of(context).size.width;
return Scaffold(
  backgroundColor: Colors.white,
  body: SafeArea(
    child: SingleChildScrollView(
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 20, vertical: 30),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            
 Image.asset('assets/images/smart_city_logo_transparent.png',height: width/2.5,fit:  BoxFit.fill,),
            SizedBox(height: 15,),
            Text("LOGIN TO", style: FontConstants.k24Light(fontSize: 38, textColor: Colors.black),),
            Text("SMART CITY \nMANAGER", style: FontConstants.k24Bold(fontSize: 35, textColor: ColorConstant.blueLight),textAlign: TextAlign.start,),
            Divider(height: 15,color: Colors.black, endIndent: width * 0.80, thickness: 3,),
            Text("Smart city manager provides whole information about the flat that you are looking for.", style: FontConstants.k24Light(fontSize: 20, textColor: Colors.black ).copyWith(wordSpacing: 0.5),),
            SizedBox(height: 35,),
            TextField(
              style: FontConstants.k24Light(fontSize: 20, textColor: Colors.black),
              decoration: InputDecoration(
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.all(
                    Radius.circular(10)
                  ),
                  borderSide: BorderSide(
                    width: 0,
                    style: BorderStyle.none
                  )
                ),
                filled: true,
                fillColor: ColorConstant.blueGreyLight,
                prefixIcon: Icon(Icons.phone_android_sharp, color: Colors.grey,),
                hintText: "Phone number...",
              ),
            ),
            SizedBox(height: 35,),
            RaisedGradientButton(
              child: Text(
                'NEXT',
                style: FontConstants.k24Light(
                    fontSize: 28, textColor: Colors.white),
              ),
              onPressed: () {
                Get.toNamed('/verification-screen');
              },
              gradient: LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: [
                    Color(0xff7CD9FF),
                    Color(0xff3CC6FF),
                  ]),
            )
          ],
        ),
      ),
    ),
  ),
);
}
}

Here is the last code base which contains only one Text Field:

class VerificationScreen extends StatefulWidget {
@override
_VerificationScreenState createState() => _VerificationScreenState();
}

class _VerificationScreenState extends State<VerificationScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
    body: Container(
  child: Center(
    child: TextField(),
  ),
));
}
}
1 Answers

I had the problem on Landing Screen that it mess's the widget tree. Because didChangeDependancy method would be called more than one time and with any changes from the widget tree. the solution is to didChangeWidget instead of didChangeDependancy and change the navigation to offAndToNamed.

Related