Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Move button to the bottom

I am trying to move the button to the bottom of the screen but in vain. I basically have 2 textEditingControllers and a button but the latter keeps sticking with the textEditingController. Any advice, please?

return Scaffold(
      
      body: SafeArea(
        child: SingleChildScrollView(
          physics: const ScrollPhysics(),
          child: Column(
            children: [
                
              return Card(
                 elevation: 5,
                 clipBehavior: Clip.antiAlias,
                 margin: const EdgeInsets.all(0),
                 child: Container(
                 padding: const EdgeInsets.all(15),
                 child: Row(
                   children: [
                    Column(
                    
         ),
         Expanded(
          child: Column(
          children: [
            LocationField(
                isDestination: false,
                textEditingController: sourceController),
            LocationField(
                isDestination: true,
                textEditingController: destinationController),
            
          ],
         ),
        ),   
              Align(
                alignment: Alignment.bottomCenter,
                child: Container(
                  margin: const EdgeInsets.all(5),
                  width: double.infinity,
                  child: ElevatedButton(
                    onPressed: () {},
                    child: const Text('Bottom Button '),  // trying to move to the bottom
                  ),
                ),
              )


            ],
        
         

    );
  }

Where am I going wrong?
trying to move the button downwards

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

You can achieve it by making small changes in your code it self. you have to change the tree of your code as below.

Scaffold -> Body -> Column 
  1. Column First Child Should be wrapped with Expanded and then SinglechildScrollView then Column and remaining Widgets
  2. And the Second Widget should be your Button.

This will make the Button to move to the end of the screen. I hope thats what you are trying to do.
But this way makes the Button visible on the screen all the time where as remaining widgets will be scrolling.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading