Flutter navigating MaterialApp children-CodePudding

I'm fairly new to flutter and dart, I set up my app like so:

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

  @override
  State<MyExpensesApp> createState() => _MyExpensesAppState();
}

class _MyExpensesAppState extends State<MyExpensesApp> {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'title',
      home: Directionality(
        textDirection: TextDirection.rtl,
        child: HomePage(),
      ),
    );
  }
}

and i have a FloatingAction button inside the HomePage which navigates to a different page when clicked

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        ....
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () => {
          Navigator.push(
              context, MaterialPageRoute(builder: (context) => ExpensePage()))
        },
        tooltip: "add expense",
        child: Icon(Icons.add),
      ),
    );
  }
}

but when navigation to the ExpensePage screen, it is not RTL, which means it is not a child of Directionality widget? Am i just replacing the whole MaterialApp with ExpensePage? How can i only replace the Directionality Child when navigating? I don't need any intricate routing, as i only have those 2 pages.

CodePudding user response：

For the child page, you can use Scaffold as the root parent. Then try with the same routing.

CodePudding user response：

To put a Directionality widget above the Navigator (and hence above every page), you can use the builder property in MaterialApp.

    return MaterialApp(
      title: 'title',
      home: HomePage(),
      builder: (context, child) => Directionality(
          textDirection: TextDirection.rtl,
          child: child!,
      ),
    );