Question 409949 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – How to prevent app from closing on swipe back

In a screen of my flutter app I have some buttons that allow me to open new pages, created with the following code:

@override
Widget build(BuildContext context) {
  return ElevatedButton.icon(
    onPressed: () {
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (BuildContext context) {
            return Scaffold(
              appBar: AppBar(title: const Text("Back Swipe")),
              body: const Center(
                child: SizedBox(),
              ),
            );
          },
        ),
      );
    },
    icon: const Icon(Icons.sunny),
    label: const Text("Hello"),
  );
}

The problem is that by doing so, once I enter the subpage, to go back I have to click on the back button.

If instead I use the back swipe (from left or right) the app closes.

Adding the rootNavigator: true parameter like this:

Navigator.of(context, rootNavigator: true).push(

the back swipe works and I go back, but using this parameter, the NavigationBar disappears, and I need it to stay.

How can I solve it?
Thanks in advance

Tags:

2

Answers


  1. 0

    You can use leading and automaticallyImplyLeading properties of the AppBar:

    Scaffold(
    appBar: AppBar(
      automaticallyImplyLeading: false,
      leading: BackButton(
          onPressed: () => doSomething()),
    ),
    body: Text('Hello')
  )

    In this way you can choose what happens when you click back button.

    Login or Signup to reply.
  2. 0

    You Can try this package:swipeable_page_route: ^0.4.4

    Orelse

    In Flutter, you can implement a swipe-to-change-page functionality using the PageView widget. Here’s an example of how to achieve this:

    import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SwipeToChangePage(),
    );
  }
}

class SwipeToChangePage extends StatelessWidget {
  final PageController _controller = PageController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Swipe to Change Page")),
      body: PageView(
        controller: _controller,
        children: <Widget>[
          Center(child: Text("Page 1", style: TextStyle(fontSize: 24))),
          Center(child: Text("Page 2", style: TextStyle(fontSize: 24))),
          Center(child: Text("Page 3", style: TextStyle(fontSize: 24))),
        ],
      ),
    );
  }
}

    Explanation:

    The PageView widget allows horizontal swiping between pages.

    The PageController is used to manage and control the pages programmatically if needed.

    Each page is represented as a widget inside the children property of the PageView.

    You can customize the PageView further by adding indicators, animations, or custom gestures if needed.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search