SingleChildScrollView height to max height with image background in flutter. Code of the required layout – its not 100% but get the job Done. You can Complete it as required.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 | @override Widget build(BuildContext context) { return Scaffold( body: Stack( children: <Widget>[ Container( decoration: new BoxDecoration( image: new DecorationImage( fit: BoxFit.cover, image: new NetworkImage( 'https://i.pinimg.com/originals/c2/47/e9/c247e913a0214313045a8a5c39f8522b.jpg'))), ), Center( child: SingleChildScrollView( padding: EdgeInsets.all(30.0), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: <Widget>[ CircleAvatar( radius: 58.0, child: Text('Travel'), ), SizedBox( height: 20.0, ), TextFormField( decoration: InputDecoration( prefixIcon: Icon( Icons.person, color: Colors.white, ), hintStyle: TextStyle(color: Colors.white), filled: true, fillColor: Colors.black45, hintText: 'Username'), ), SizedBox( height: 10.0, ), TextFormField( decoration: InputDecoration( filled: true, prefixIcon: Icon(Icons.lock, color: Colors.white), hintStyle: TextStyle(color: Colors.white), fillColor: Colors.black45, hintText: 'Password'), ), SizedBox( height: 15.0, ), FlatButton( onPressed: () {}, child: Text( 'Forgot your Password?', style: TextStyle(color: Colors.white), )), SizedBox( height: 15.0, ), RaisedButton( onPressed: () {}, child: Padding( padding: EdgeInsets.all(15.0), child: Text('LOGIN')), color: Colors.redAccent, textColor: Colors.white, ), SizedBox( height: 10.0, ), RaisedButton( onPressed: () {}, child: Padding( padding: EdgeInsets.all(15.0), child: Text('REGISTER')), color: Colors.grey, textColor: Colors.white, ), SizedBox( height: 12.0, ), Row( children: <Widget>[ Expanded( child: Divider( color: Colors.white, height: 8.0, ), ), SizedBox( width: 8.0, ), Text( 'OR', style: TextStyle(color: Colors.white), ), SizedBox( width: 8.0, ), Expanded( child: Divider( color: Colors.white, height: 8.0, ), ) ], ), Row( children: <Widget>[ // TODO Social Icons ], ), ], ), ), ), ], ), ); } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
