CODEWITHSUNDEEP
flutter
Smiles4U
Smiles4U

Reputation: 75

Moving flutter widgets to bottom of screen with background image

I cannot figure out how to move my login fields to the bottom of the screen. I'm using a Column and thought that I could wrap the Column with a Container or SizedBox to move all the login TextFormFields to the bottom of the screen. Here's a portion of my code for email entry. I also use a BoxDecoration for a background image.

Widget build(BuildContext context) {
return loading
    ? const Loading()
    : Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
              image: AssetImage('images/inapp/redbarn.jpg'),
              fit: BoxFit.fill),
        ),
        padding: const EdgeInsets.all(1.0),
        child: Column(
          children: [
            Text('Sign In',
                style: Theme.of(context).textTheme.headlineSmall),
            const Text('Use your Email Address'),
            Form(
              key: _formKey,
              child: Column(
                children: [
                  TextFormField(
                    autofillHints: const [AutofillHints.email],
                    decoration: const InputDecoration(
                      hintText: 'Email',
                      fillColor: Colors.white,
                      filled: true,
                    ),

Upvotes: 0

Views: 200

Answers (1)

rasityilmaz
rasityilmaz

Reputation: 1389

Use the Spacer() widget before the widgets you want to move.

Widget build(BuildContext context) {
return loading
    ? const Loading()
    : Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
              image: AssetImage('images/inapp/redbarn.jpg'),
              fit: BoxFit.fill),
        ),
        padding: const EdgeInsets.all(1.0),
        child: Column(
          children: [
            const Spacer(),
            Text('Sign In',
                style: Theme.of(context).textTheme.headlineSmall),
            const Text('Use your Email Address'),
            Form(
              key: _formKey,
              child: Column(
                children: [
                  TextFormField(
                    autofillHints: const [AutofillHints.email],
                    decoration: const InputDecoration(
                      hintText: 'Email',
                      fillColor: Colors.white,
                      filled: true,
                    ),

Upvotes: 1

Related Questions