Flutter Tutorials

Flutter app development tutorials


flutter – How to use SingleChildScrollView

main.dart


import 'package:flutter/material.dart';

void main() {runApp(const MyApp());}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        theme: ThemeData(primarySwatch: Colors.blueGrey),
        home: const MyHomePage()
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool _expanded = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            title: const Text("Flutter - SingleChildScrollView")
        ),
        body: bodyContent()
    );
  }

  bodyContent() {
    return SingleChildScrollView(
      child: ExpansionPanelList(
        animationDuration: const Duration(seconds: 1),
        children: [
          ExpansionPanel(
              headerBuilder: (context, isExpanded) {
                return const ListTile(title: Text("Orange"));
              },
              body:ListTile(
                  title: const Text("I am orange color."),
                  tileColor: Colors.orange.shade200,
                  contentPadding: const EdgeInsets.symmetric(
                      vertical: 64, horizontal: 32
                  )
              ),
              isExpanded: _expanded,
              canTapOnHeader: true
          )
        ],
        expansionCallback: (panelIndex, isExpanded) {
          setState(() {
            _expanded = !isExpanded;
          });
        },
      ),
    );
  }
}

More flutter tutorials



About Me

Flutter Developer

Design a site like this with WordPress.com
Get started