Skip to main content

Command Palette

Search for a command to run...

PageView widget and Attributes

Published
2 min read
PageView widget and Attributes
V

"Hello World, I'm Vinit Mepani, a coding virtuoso driven by passion, fueled by curiosity, and always poised to conquer challenges. Picture me as a digital explorer, navigating through the vast realms of code, forever in pursuit of innovation.

In the enchanting kingdom of algorithms and syntax, I wield my keyboard as a magical wand, casting spells of logic and crafting solutions to digital enigmas. With each line of code, I embark on an odyssey of learning, embracing the ever-evolving landscape of technology.

Eager to decode the secrets of the programming universe, I see challenges not as obstacles but as thrilling quests, opportunities to push boundaries and uncover new dimensions in the realm of possibilities.

In this symphony of zeros and ones, I am Vinit Mepani, a coder by passion, an adventurer in the digital wilderness, and a seeker of knowledge in the enchanting world of code. Join me on this quest, and let's create digital wonders together!"

The PageView widget in Flutter is used to create a scrollable list of pages, each of which occupies the entire screen. It's commonly used for implementing screen slides, such as image slideshows or onboarding screens.

Attributes:

  1. children (List<Widget>):

    • The list of widgets representing the pages to be displayed in the PageView.
  2. scrollDirection (Axis):

    • The axis along which the pages should be scrolled. It can be either Axis.horizontal for horizontal scrolling or Axis.vertical for vertical scrolling. The default value is Axis.horizontal.
  3. controller (PageController):

    • An optional controller that allows you to control the current page and listen to page change events.
  4. physics (ScrollPhysics):

    • The physics of the scrolling behavior. For example, you can use BouncingScrollPhysics() for iOS-like bouncing effect or ClampingScrollPhysics() for Android-like clamping effect.
  5. pageSnapping (bool):

    • Whether to snap pages to the closest boundary during scrolling. If set to true, the pages will snap to the closest boundary when released. The default value is true.
  6. onPageChanged (Function(int)):

    • An optional callback that is called when the page changes. It provides the index of the new page.

Example:

import 'package:flutter/material.dart';

class PageViewExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PageView Widget Example'),
      ),
      body: PageView(
        scrollDirection: Axis.horizontal,
        children: [
          Container(color: Colors.red),
          Container(color: Colors.blue),
          Container(color: Colors.green),
        ],
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: PageViewExample(),
  ));
}

Explanation:

  • In this example, a PageView widget is used to create a horizontal scrollable list of pages.

  • The scrollDirection attribute is set to Axis.horizontal to enable horizontal scrolling.

  • The children attribute contains a list of Container widgets, each representing a page with a different background color.

  • When you run this code, you'll see a screen with a horizontal scrollable list of three pages, each with a different background color. You can swipe left or right to navigate between pages.

More from this blog

Vinit Mepani (Flutter Developer)

270 posts

"Vinit Mepani, passionate coder! Dive into my Dart and Flutter journey on the blog. Let's master these tech wonders together. Happy coding! 🚀"