英文:
Flutter change scaffold body from side drawer
问题
我正在尝试在Flutter的侧边抽屉中更改Scaffold主体的内容。我正在使用不同的文件来存储侧边导航栏和新的主体内容。
我已经创建了一个单独的文件,其中包含一个名为NavigationController的类,其中包含一个用于在Scaffold主体中显示的小部件的静态变量。
我使用不同的文件来更好地组织代码。
提前感谢您的任何建议。
变量正在得到更新,我已经使用print函数进行了测试。
另外,我能够在单击侧边导航栏上的按钮后更改屏幕的内容,如果我在页面上按下一个执行setState的按钮。
因此,似乎在按下侧边导航栏上的按钮时执行的setState不会刷新主页面。
主应用程序:
import 'package:flutter/material.dart';
import 'package:playground/sidenav.dart';
import 'package:playground/pagecontroller.dart';
void main() {
runApp(const MaterialApp(home: MyApp()));
}
class MyApp extends StatefulWidget {
const MyApp({Key? key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return Scaffold(
drawer: const SideNav(),
appBar: AppBar(),
body: NavigationController.currentPage,
);
}
}
导航控制器:
import 'package:flutter/material.dart';
class NavigationController {
static Widget currentPage = const Text("Hello World");
}
侧边抽屉小部件:
import 'package:flutter/material.dart';
import 'package:playground/pagecontroller.dart';
import 'package:playground/newbody.dart';
class SideNav extends StatefulWidget {
const SideNav({Key? key});
@override
State<SideNav> createState() => _SideNavState();
}
class _SideNavState extends State<SideNav> {
@override
Widget build(BuildContext context) {
return Drawer(
child: ListView(children: <Widget>[
ListTile(
title: const Text('Page 1'),
onTap: () {
setState(() {
NavigationController.currentPage = const NewBody();
Navigator.pop(context);
});
})
]));
}
}
希望对您有所帮助。
英文:
I am trying to change the content of the Scaffold body from the side drawer in Flutter. I am using different files to store the side navigation bar and new body contents.
I have created a separate file with a class NavigationController, which contains a static variable for the widget to be displayed in the body of the scaffold.
I am using different files to have better organisation.
Thanks in advance and any suggestions are highly appreciated.
The variable is getting updated as I have tested using the print function.
Also I am able to change the contents of the screen after clicking the button in the side navigation bar if i press a button on the page which does a set state.
So it seems that the set state I am executing when pressing the button in the side navigation bar is not refreshing the main page.
Main App:
import 'package:flutter/material.dart';
import 'package:playground/sidenav.dart';
import 'package:playground/pagecontroller.dart';
void main() {
runApp(const MaterialApp(home: MyApp()));
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return Scaffold(
drawer: const SideNav(),
appBar: AppBar(),
body: NavigationController.currentPage,
);
}
}
Navigation controller:
import 'package:flutter/material.dart';
class NavigationController {
static Widget currentPage = const Text("Hello World");
}
Side Drawer Widget:
import 'package:flutter/material.dart';
import 'package:playground/pagecontroller.dart';
import 'package:playground/newbody.dart';
class SideNav extends StatefulWidget {
const SideNav({super.key});
@override
State<SideNav> createState() => _SideNavState();
}
class _SideNavState extends State<SideNav> {
@override
Widget build(BuildContext context) {
return Drawer(
child: ListView(children: <Widget>[
ListTile(
title: const Text('Page 1'),
onTap: () {
setState(() {
NavigationController.currentPage = const NewBody();
Navigator.pop(context);
});
})
]));
}
}
答案1
得分: 0
希望你一切都好。
setState 刷新的是 SideNav
而不是主要的小部件。
你需要使用更好的解决方案,尝试了解状态管理和提供者。
建议使用 Flutter provider 或 Flutter cubit,
你可以通过创建一个带有监听器的主页来实现这一点,以监视来自提供者的任何更改,并使用新的小部件重新加载小部件。
英文:
hope you are fine.
setState is refreshing `SideNav` and not the main widget.
You have to use a better solution, try to read about state management and providers.
recommend to use Flutter provider or Flutter cubit
you can achieve this by creating a home page with a listener -> watching any change that comes from the provider and reloading the widget with a new one.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论