Berkin
Berkin

Reputation: 519

Flutter page is not scrollable: How to scroll when more than one widget?

I am trying to make my page scrollable but I didn't manage it. What I tried so far is to use SingeChildScrollView, ListView and ScrollView... Everytime I use one of these an error occurs. How can I manage this? Is there any alternative to use those three options? I am new to flutter and what I googled so far didn't work because I could only find solutions with one of these three scrolling options. Thank you! This is my code:


class LadevorgangScreen extends StatefulWidget {
  @override
  _LadevorgangScreen createState() => _LadevorgangScreen();
}

@override
class _LadevorgangScreen extends State<LadevorgangScreen> {
//class LadevorgangScreen extends StatelessWidget {

  PageController pageController = PageController(initialPage: 0);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Ladevorgang'),
        flexibleSpace: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
                colors: [Color(0xffFBD23E), Color(0xffF6BE03)],
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter),
          ),
        ),
      ),
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
              colors: [Color(0xffFEFDFD), Color(0xffBDBDB2)],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight),
        ),
        child: Column(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.fromLTRB(10, 15, 10, 45),
              child: FlatButton(
                onPressed: () {},
                color: Colors.blue,
                highlightColor: Colors.transparent,
                splashColor: Colors.transparent,
                child: RichText(
                  textAlign: TextAlign.center,
                  text: TextSpan(
                    text: 'FAQs:\n',
                    style: TextStyle(
                      fontFamily: 'Avenir',
                      fontSize: 22.0,
                      fontWeight: FontWeight.w900,
                      decoration: TextDecoration.underline,
                      color: Color(0xff232323),
                    ),
                    children: [
                      TextSpan(
                        text: 'Ladevorgang des Elektroautos',
                        style: TextStyle(
                            fontFamily: 'Avenir',
                            fontSize: 20.0,
                            fontWeight: FontWeight.w500,
                            decoration: TextDecoration.none,
                            color: Color(0xff232323)),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            Flexible(
              child: Text(
                'Zu Hause laden',
                style: TextStyle(
                    fontSize: 18.5,
                    fontFamily: 'Avenir',
                    fontWeight: FontWeight.w700),
              ),
            ),
            Padding(
              padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
              child: Column(
                children: [
                  Row(
                    children: [
                      Padding(
                        padding: EdgeInsets.fromLTRB(0, 12, 7, 12),
                        child: Icon(
                          Icons.circle_outlined,
                          size: 15.0,
                          color: Color(0xffF6BE03),
                        ),
                      ),
                      Flexible(
                        child: Text(
                          "Wie lade ich zu Hause?",
                          style:
                              TextStyle(fontSize: 17.0, fontFamily: 'Avenir'),
                        ),
                      ),
                    ],
                  ),
                  Row(
                    children: [
                      Padding(
                        padding: EdgeInsets.fromLTRB(0, 12, 7, 12),
                        child: Icon(
                          Icons.circle_outlined,
                          size: 15.0,
                          color: Color(0xffF6BE03),
                        ),
                      ),
                      Flexible(
                        child: Text(
                            "Benötige ich überhaupt eine Lademöglichkeit zu Hause?",
                            style: TextStyle(
                                fontSize: 17.0, fontFamily: 'Avenir')),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Upvotes: 0

Views: 391

Answers (1)

Muhammad Tameem Rafay
Muhammad Tameem Rafay

Reputation: 4595

JUST WRAP your main widget OF BODY in SingleChildScrollView widget

   body: SingleChildScrollView(
    child: Container(
      decoration: BoxDecoration
       .....
       ..
       .

Upvotes: 1

Related Questions