Text disappears when opening Dart Flutter Keyboard

Question

I have a sign up screen like this:

When the keyboard is opened to enter information into the textFormFields here, the screen looks like this:

The text "Welcome to register form" disappeared. What is the cause of this problem? How can I solve it? Thanks in advance for the help.

---

Codes:

main.dart:

import 'package:flutter/material.dart';
import 'package:simto_todolist/app.dart';
import 'package:firebase_core/firebase_core.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: splashScreen(),
    );
  }
}

app.dart:

import 'package:flutter/material.dart';
import 'package:cool_alert/cool_alert.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:timer_count_down/timer_count_down.dart';
import 'package:group_button/group_button.dart';
import 'package:firebase_auth/firebase_auth.dart';
      var currentPage;

class splashScreen extends StatefulWidget {
  @override
  State<splashScreen> createState() => _splashScreenState();
}

  final CarouselController _pageController = CarouselController();

class _splashScreenState extends State<splashScreen> {
  List splashs = [sp1(), sp2(), sp3()];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Image.asset("logo.png", fit: BoxFit.cover, height: 75,),
        centerTitle: true,
        backgroundColor: Colors.white,
        elevation: 0,
      ),
      backgroundColor: Colors.white,
      body: CarouselSlider(
        carouselController: _pageController,
        items: splashs.map((i) {
          return Builder(
            builder: (BuildContext context) {
              return i;
            },
          );
          
        }).toList(),
        options: CarouselOptions(
          height: MediaQuery.of(context).size.height,
          viewportFraction: 1,
          enableInfiniteScroll: false,
          onPageChanged: (index, reason) {
            setState(() {
              currentPage = index;
              print(currentPage);
            });
          },
        ),
      )
    );
  }
}

class sp1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(
          height: MediaQuery.of(context).size.height / 5
        ),
        Image.asset('assets/splash1.png', fit: BoxFit.cover, height: 220,),
        Text("Hoş geldin!", style: TextStyle(fontSize: 25, fontFamily: "Roboto-Bold"),),
        SizedBox(height: 15),
        Expanded(child: Text("Simto: To-do-list uygulamasına hoş geldin.", style: TextStyle(fontSize: 19, fontFamily: "Roboto-Thin"),)),
          RaisedButton(
            child: Padding(
              padding: const EdgeInsets.all(15.0),
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Icon(Icons.arrow_forward, color: Colors.white,),
                  SizedBox(width: 10),
                  Text("Devam", style: TextStyle(color: Colors.white, fontSize: 20, fontFamily: "Roboto-Thin"),),
                ],
              ),
            ),
            color: Colors.blue[400],
            textColor: Colors.white,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(30.0),
            ),
            onPressed: () {
              _pageController.nextPage(duration: Duration(milliseconds: 500), curve: Curves.easeIn);
            },
          ),
          SizedBox(height: 18),
      ]
    );
  }
}

class sp2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(
          height: MediaQuery.of(context).size.height / 5
        ),
        Image.asset('assets/splash2.png', fit: BoxFit.cover, height: 235,),
        Text("Yapılacakları planlayın", style: TextStyle(fontSize: 25, fontFamily: "Roboto-Bold"),),
        SizedBox(height: 15),
        Expanded(child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(30),
            color: Colors.white,
          ),
          child: Text("Düzenli bir gün, yapılacaklar listesi hazırlamakla başlar. Hemen yapılacaklar listesi oluşturun!", style: TextStyle(fontSize: 18, fontFamily: "Roboto-Thin"), textAlign: TextAlign.center,))),
          SizedBox(height: 25),
          RaisedButton(
            child: Padding(
              padding: const EdgeInsets.all(15.0),
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Icon(Icons.arrow_forward, color: Colors.white,),
                  SizedBox(width: 10),
                  Text("Devam", style: TextStyle(color: Colors.white, fontSize: 20, fontFamily: "Roboto-Thin"),),
                ],
              ),
            ),
            color: Colors.blue[400],
            textColor: Colors.white,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(30.0),
            ),
            onPressed: () {
              _pageController.nextPage(duration: Duration(milliseconds: 500), curve: Curves.easeIn);
            },
          ),
          SizedBox(height: 18),
      ]
    );
  }
}

class sp3 extends StatefulWidget {
  @override
  State<sp3> createState() => _sp3State();
}

class _sp3State extends State<sp3> {
  @override  
    Widget build(BuildContext context) {
      return Column(
        children: [
          Image.asset('assets/splash3.png', fit: BoxFit.cover, height: 220,),
          Text("Register", style: TextStyle(fontSize: 25, fontFamily: "Roboto-Bold"),), // Kayıt ol
          SizedBox(height: 15),
          Expanded(
            child: Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(30),
              color: Colors.white,
            ),
            child: Text("Welcome to register form", style: TextStyle(fontSize: 18, fontFamily: "Roboto-Thin"), textAlign: TextAlign.center,))), // Hemen kayıt ol ve yapılacaklar listeni hazırla!
          SizedBox(height: 25),
          Padding(
            padding: const EdgeInsets.only(left: 11, right: 11),
            child: TextFormField(
              decoration: InputDecoration(
                hintText: "E-mail",
                labelStyle: TextStyle(fontSize: 18, fontFamily: "Roboto-Thin", color: Colors.grey),
                prefixIcon: Icon(Icons.email, color: Colors.grey,),
                border: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey),
                )
              ),
              style: TextStyle(
                color: Colors.black,
                fontSize: 20
              ),
            ),
          ),
          SizedBox(height: 10,),
          Padding(
            padding: const EdgeInsets.only(left: 11, right: 11),
            child: TextFormField(
              decoration: InputDecoration(
                hintText: "Name-surname", // Ad-soyad
                labelStyle: TextStyle(fontSize: 18, fontFamily: "Roboto-Thin", color: Colors.grey),
                prefixIcon: Icon(Icons.person, color: Colors.grey, size: 30,),
                border: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey),
                ),
              ),
              style: TextStyle(
                color: Colors.black,
                fontSize: 20
              ),
            ),
          ),
          // şifre input:
          SizedBox(height: 10,),
          Padding(
            padding: const EdgeInsets.only(left: 11, right: 11),
            child: TextFormField(
              decoration: InputDecoration(
                hintText: "Password", // Şifre
                labelStyle: TextStyle(fontSize: 18, fontFamily: "Roboto-Thin", color: Colors.grey),
                prefixIcon: Icon(Icons.lock, color: Colors.grey,),
                border: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey),
                ),
                suffixIcon: InkWell(
                  child: Icon(Icons.remove_red_eye),
                )
                
              ),
              style: TextStyle(
                color: Colors.black,
                fontSize: 20
              ),
              obscureText: true,
            ),
          ),
          SizedBox(height: 25,),
          RaisedButton(
            child: Text("Register"),
            onPressed: () {
            }
          ),
        ],
      );
    }
}


class loadingAccount extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Image.asset('assets/splash4.png', fit: BoxFit.cover, height: 200,),
            SizedBox(height: 15),
            Text("Her şey size özel hazırlanıyor..", style: TextStyle(fontSize: 22, fontFamily: "Roboto-Medium"), textAlign: TextAlign.center,),
            SizedBox(height: 15),
            CircularProgressIndicator(),
            Countdown(
              seconds: 4,
              interval: Duration(milliseconds: 500),
              build: (BuildContext context, double time) {
                return SizedBox();
              },
              onFinished: () {
                //register();
                print("bitti");
                Navigator.push(context,
                PageRouteBuilder(
                  barrierDismissible: false,
                  opaque: true,
                  transitionDuration: Duration(milliseconds: 150),
                  transitionsBuilder: (BuildContext context, Animation<double> animation, Animation <double> secAnimation, Widget child) {
                    return ScaleTransition(
                      alignment: Alignment.center,
                      scale: animation,
                      child: child,
                    );
                  },
                  pageBuilder: (BuildContext context, Animation<double> animation, Animation <double> secAnimation) {
                    // return HomePage();
                  }
                  ),
                );
              },
            ),
            WillPopScope(
              child: Container(),
              onWillPop: () {
                return Future.value(false);
              },
            )
          ],
        ),
      ),
    );
  }
}

My goal is to create a nice sign up screen.

Answer 1

Try wrapping your column with a SingleChildScrollView in SP3 as follows:

return SingleChildScrollView(
  child: Column(
    children: [<COLUMN-CHILDREN>]
  ),
);

This will allow your column to expand to its full minimum MainAxisSize when the keyboard is shown, instead of trying to squeeze all the elements onto the screen