Home > Back-end >  How can i add PageView widget In a Stack widget?
How can i add PageView widget In a Stack widget?

Time:09-17

Im developing a quotes app as a beginner in flutter.I had used a stack widget to use both image and text in the center of my screen.Right now i want to add a pageview widget to scroll and land in the next page.Please suggest me where and how should i use the pageview widget?

  class OverviewScreen extends StatefulWidget {
  @override
 _OverviewScreenState createState() => _OverviewScreenState();
  }

  class _OverviewScreenState extends State<OverviewScreen> {

  @override
  Widget build(BuildContext context) {
  return MaterialApp(
  home:Scaffold(
    extendBodyBehindAppBar: true,
    appBar: AppBar(
        title: Text("Hu   R   Rehman",
        style: TextStyle(fontFamily: "MonteCarlo"),),
        centerTitle: true,
      leading: Icon(Icons.menu),

      shape:RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(bottom: Radius.circular(16))
      ),
    backgroundColor: Colors.transparent,
      elevation: 0,

    ),
    body:
    Stack(
      children:<Widget>[
        Image(
          image:AssetImage('Image/soc1.jpg'),
          fit:BoxFit.cover,
          width: double.infinity,
          height: double.infinity,
        ),
        Align(alignment: Alignment.center,
           child: Text(' This is my text '
             ,style: TextStyle(fontSize: 30.0,
                 fontFamily:"MonteCarlo",
                 color: Colors.white,
                   fontWeight: FontWeight.w700 ) )

          )
          ],
          )
          ),
          );
          }
          }

CodePudding user response:

Check this out if it solves your problem:

class MyHomePage extends StatefulWidget {


  const MyHomePage({Key? key,}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final _pageController = PageController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Title'),
      ),
      body: Center(
        child: Stack(
          alignment: Alignment.center,
          children: [
            PageView(
              controller: _pageController,
              children:[
                Image(image: AssetImage('Location of your image')),
                //Add more Image Widgets
              ]
            ),
            const Text(
              'Add you Text here',
            ),
            
          ],
        ),
      ),
      
    );
  }
}

  • Related