Flutter PageView继续在setState值上重建主小部件



当前颤振应用结构

堆叠之家有一个有2个孩子的网页浏览

  • 浏览量(家长(:
    • 主屏幕(儿童#1(
      • 垂直页面浏览
      • 底部导航栏
    • 用户个人资料页面(儿童#2(

主屏幕应将索引值传递给UserProfilePage,因此当水平滚动时,我们将获得用户配置文件屏幕,其ID传递给从主屏幕接收的id。 根据传递的 ID 将显示相关的用户配置文件

这是显示问题的示例视频:

https://drive.google.com/file/d/1tIypNOHewcFSo2Pf-F97hsQGfDgNVqfW/view?usp=sharing

问题: 我设法做到了,它工作正常,但我在该变量的 setState 上的问题

setState(() {
_postIndex = postIndex;
}); 

在每个主屏幕上> onPageChanged 调用我正在更新索引值,将其传递给父类(堆叠主页(,并且由于有一个 setState 来更新配置文件索引(用户配置文件页面(...整个应用程序将在每次页面浏览更改时重新构建...

我需要的是禁用该主小部件,以便在值更新时一次又一次地重建。

堆叠家居

class StackedHome extends StatefulWidget {
final int data;
final Function(int) onDataChange;
const StackedHome({
this.data,
this.onDataChange,
Key key,
}) : super(key: key);
@override
_StackedHomeState createState() => _StackedHomeState();
}
class _StackedHomeState extends State<StackedHome>{
PageController pageController;

int _count = 0;
int _postIndex = 0;
void _postId(int postIndex) {
//This cuasing main screen to be rebuilt everytime on pageview scroll
//but getting the value correctly 
setState(() {
_postIndex = postIndex;
}); 
}
@override
void initState() {
super.initState();
pageController = PageController();
}
@override
void dispose() {
pageController.dispose();
super.dispose();
}
int index = 0;
@override
Future<void> _refreshPosts() async {
PostApi postApi = PostApi();
setState(() {
postApi.fetchAllPosts();
});
}
Widget build(BuildContext context) {
PostApi postApi = PostApi();
return FutureBuilder(
future: postApi.fetchAllPosts(),
builder: (BuildContext context, AsyncSnapshot<List<Post>> snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
return apiError('No Connection Made');
break;
case ConnectionState.waiting:
case ConnectionState.active:
return ApiLoading(color:0xff000000);
break;
case ConnectionState.done:
if (snapshot.hasError) {
return apiError(snapshot.error.toString());
}
if (snapshot.hasData) {
return _drawPostsList(snapshot.data, context);
}
break;
}
return Container();
},
);
}


Widget _drawPostsList(List<Post> posts, BuildContext context) {
return PageView(      
reverse: true,
children: <Widget>[
HomeScreen(
posts: posts,
index: index,
postId: _postId,//function Passed
),
UserProfilePage(
posts: posts,
index: _postIndex,
)
],
);
}
}

主屏幕

class HomeScreen extends StatefulWidget {
@override
final List posts;
final int index;
final Function(int) postId;
int getPage() {
return value;
}
void setPage(int page) {
value = page;
}
HomeScreen({Key key, this.posts, this.index, this.postId}) : super(key: key);
HomeScreenState createState() => HomeScreenState();
}
class HomeScreenState extends State<HomeScreen>
with SingleTickerProviderStateMixin {
final PageController _controller = PageController();
PageController _pageController = PageController();

int index = 0;   
@override
void initState() {
super.initState();
//Set pageview inital page
_pageController = PageController(
keepPage: true,
initialPage: widget.getPage(),
);
}  
@override
Widget build(BuildContext context) {
return RefreshIndicator(      
onRefresh: _refreshPosts,
child: Stack(children: <Widget>[
PageView.builder(
controller: _pageController,
onPageChanged: (index) => setState(() {
.
widget.postId(index);//I am calling parent class and updating the vlaue with new index value
.
}),
scrollDirection: Axis.vertical,
itemBuilder: (context, position) {            
//Build image lists
return _homeList(widget.posts, position);           
},
),
BottomNavigation("light"),
]),
);
}

}

我希望我的问题足够清楚....我需要将值传递给父级,以便我可以将其传递给第二个孩子,即个人资料屏幕,以便它将显示该帖子实现的用户个人资料

哦,哇,通过收听索引ID的任何更新,设法使用提供者和消费者解决了这个问题......这篇文章帮助我解决了它 https://medium.com/flutter-nyc/a-closer-look-at-the-provider-package-993922d3a5a5

最新更新