CupertinoTabView 没有 "OnPressed()" 功能。如何模拟?
CupertinoTabView doesn't have an "OnPressed()" functionality. How to simulate?
好的,我的程序有问题,我明白为什么它不能按我想要的方式工作,但我不知道如何解决它。
我正在使用以下代码在我的应用程序中切换选项卡。
child: CupertinoTabView(builder: (context) {
switch (i) {
case 0:
titleChanged = false;
firstPage = Page1();
return firstPage;
break;
case 1:
pageTitle = 'Page 2';
titleChanged = true;
secondPage = SecondPage();
return secondPage;
break;
default:
return Container();
}
}
现在在代码的前面(higher-up 在小部件树中)我有整个页面的标题,我想在第 1 页和第 2 页之间来回切换。我可以更改文本,但我需要执行 setState() 才能使更改生效。
不幸的是,tabview "buttons" 不像普通按钮那样操作,因此,我不能对它们应用 setState() 函数,否则它会在构建期间调用 setState。
有人告诉我也许可以使用观察器,但是 none 我可以在网上找到的资源确实可以指导我具体如何操作。
我不确定观察者是否是正确的方法,但我的经验也即将结束,因为我对 flutter 还很陌生。有什么想法吗?
如果选项卡有子选项卡 属性,请尝试使用 GestureDetector()
您可以复制粘贴 运行 下面的完整代码
您可以使用 onTap
共 CupertinoTabBar
示例代码更新 AppBar
title
代码片段
tabBar: CupertinoTabBar(
items: [
...
],
onTap: (int index) {
switch (index) {
case 0:
_title = "1 first";
setState(() {});
break;
case 1:
_title = "2 second";
setState(() {});
break;
case 2:
_title = "3 third";
setState(() {});
break;
}
},
工作演示
完整代码
import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _title = "1 first";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(_title)),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: [
BottomNavigationBarItem(
title: Text("First"), icon: Icon(Icons.menu)),
BottomNavigationBarItem(
title: Text("Second"), icon: Icon(Icons.business)),
BottomNavigationBarItem(
title: Text("Third"), icon: Icon(Icons.account_box)),
],
onTap: (int index) {
switch (index) {
case 0:
_title = "1 first";
setState(() {});
break;
case 1:
_title = "2 second";
setState(() {});
break;
case 2:
_title = "3 third";
setState(() {});
break;
}
},
),
tabBuilder: (BuildContext context, int index) {
return CupertinoTabView(
builder: (context) {
switch (index) {
case 0:
return FirstPage();
break;
case 1:
return SecondPage();
break;
case 2:
return ThirdPage();
break;
}
},
);
},
),
),
],
),
),
);
}
}
class FirstPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("First"),
),
child: Center(
child: CupertinoButton(
child: Text("First button"),
onPressed: () {},
),
),
);
}
}
class SecondPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("Second"),
),
child: Center(
child: CupertinoButton(
child: Text("Second button"),
onPressed: () {},
),
),
);
}
}
class ThirdPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("Thrid"),
),
child: Center(
child: CupertinoButton(
child: Text("Third button"),
onPressed: () {},
),
),
);
}
}
好的,我的程序有问题,我明白为什么它不能按我想要的方式工作,但我不知道如何解决它。
我正在使用以下代码在我的应用程序中切换选项卡。
child: CupertinoTabView(builder: (context) {
switch (i) {
case 0:
titleChanged = false;
firstPage = Page1();
return firstPage;
break;
case 1:
pageTitle = 'Page 2';
titleChanged = true;
secondPage = SecondPage();
return secondPage;
break;
default:
return Container();
}
}
现在在代码的前面(higher-up 在小部件树中)我有整个页面的标题,我想在第 1 页和第 2 页之间来回切换。我可以更改文本,但我需要执行 setState() 才能使更改生效。
不幸的是,tabview "buttons" 不像普通按钮那样操作,因此,我不能对它们应用 setState() 函数,否则它会在构建期间调用 setState。
有人告诉我也许可以使用观察器,但是 none 我可以在网上找到的资源确实可以指导我具体如何操作。
我不确定观察者是否是正确的方法,但我的经验也即将结束,因为我对 flutter 还很陌生。有什么想法吗?
如果选项卡有子选项卡 属性,请尝试使用 GestureDetector()
您可以复制粘贴 运行 下面的完整代码
您可以使用 onTap
共 CupertinoTabBar
示例代码更新 AppBar
title
代码片段
tabBar: CupertinoTabBar(
items: [
...
],
onTap: (int index) {
switch (index) {
case 0:
_title = "1 first";
setState(() {});
break;
case 1:
_title = "2 second";
setState(() {});
break;
case 2:
_title = "3 third";
setState(() {});
break;
}
},
工作演示
完整代码
import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _title = "1 first";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(_title)),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: [
BottomNavigationBarItem(
title: Text("First"), icon: Icon(Icons.menu)),
BottomNavigationBarItem(
title: Text("Second"), icon: Icon(Icons.business)),
BottomNavigationBarItem(
title: Text("Third"), icon: Icon(Icons.account_box)),
],
onTap: (int index) {
switch (index) {
case 0:
_title = "1 first";
setState(() {});
break;
case 1:
_title = "2 second";
setState(() {});
break;
case 2:
_title = "3 third";
setState(() {});
break;
}
},
),
tabBuilder: (BuildContext context, int index) {
return CupertinoTabView(
builder: (context) {
switch (index) {
case 0:
return FirstPage();
break;
case 1:
return SecondPage();
break;
case 2:
return ThirdPage();
break;
}
},
);
},
),
),
],
),
),
);
}
}
class FirstPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("First"),
),
child: Center(
child: CupertinoButton(
child: Text("First button"),
onPressed: () {},
),
),
);
}
}
class SecondPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("Second"),
),
child: Center(
child: CupertinoButton(
child: Text("Second button"),
onPressed: () {},
),
),
);
}
}
class ThirdPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text("Thrid"),
),
child: Center(
child: CupertinoButton(
child: Text("Third button"),
onPressed: () {},
),
),
);
}
}