一键式功能

Question

我是颤振的新手。我尝试创建一个ecomm应用程序。我有一个 10 个类别和 1 个自定义小部件。如何使用点击功能来指导这 10 个类别？我的意思是对于每个_categoryTap直接用于此类别。像这样的东西：_categoryTap(Navigate to)或？。对不起，我的英语不好((我的代码：

class ListOfCategory extends StatefulWidget {
@override
_ListOfCategoryState createState() => _ListOfCategoryState();
}
class _ListOfCategoryState extends State<ListOfCategory> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
// padding: EdgeInsets.only(left: 40, right: 40),
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 30, left: 40, right: 40),
child: Image.asset('assets/dafna_logo.png'),
),
SizedBox(height: 15),
Padding(
padding: const EdgeInsets.all(8.0),
child: Wrap(
children: <Widget>[
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
],
),
),
],
),
);
}
}

Widget _categoryTap(String _nameCategory) {
return InkWell(
onTap: () {},
child: Padding(
padding: EdgeInsets.all(5),
child: Column(
children: <Widget>[
Container(
height: 120,
width: 120,
color: Colors.blue,
),
Container(
width: 120,
height: 35,
// color: Colors.red,
child: Text(_nameCategory,),
),
],
),
),
);
}

Answer 1

如果您以静态方式执行此操作，那么这是您可以检查的以下示例

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: ListView(
// padding: EdgeInsets.only(left: 40, right: 40),
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 30, left: 40, right: 40),
child: Icon(Icons.add),
),
SizedBox(height: 15),
Padding(
padding: const EdgeInsets.all(8.0),
child: Wrap(
children: <Widget>[
_categoryTap('test1'),
_categoryTap('test2'),
_categoryTap('test3'),
_categoryTap('test4'),
_categoryTap('test5'),
_categoryTap('test6'),
_categoryTap('test6'),
_categoryTap('test8'),
_categoryTap('test9'),
],
),
),
],
),
),
);
}
Widget _categoryTap(String _nameCategory) {
return InkWell(
onTap: () {
print('tap');
switch (_nameCategory) {
case 'test1':
{
// statements;
print('Test 1');
}
break;
case 'test2':
{
//statements;
}
break;
// .... and so on
default:
{
//statements;
print('you command whatever you want');
}
break;
}
},
child: Padding(
padding: EdgeInsets.all(5),
child: Column(
children: <Widget>[
Container(
height: 120,
width: 120,
color: Colors.blue,
),
Container(
width: 120,
height: 35,
// color: Colors.red,
child: Text(
_nameCategory,
),
),
],
),
),
);
}

让我知道它是否有效谢谢。

Answer 2

试试这个：

class ListOfCategory extends StatefulWidget {
@override
_ListOfCategoryState createState() => _ListOfCategoryState();
}
class _ListOfCategoryState extends State<ListOfCategory> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
// padding: EdgeInsets.only(left: 40, right: 40),
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 30, left: 40, right: 40),
child: Image.asset('assets/dafna_logo.png'),
),
SizedBox(height: 15),
Padding(
padding: const EdgeInsets.all(8.0),
child: Wrap(
children: <Widget>[
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
_categoryTap('name'),
],
),
),
],
),
);
}

Widget _categoryTap(String _nameCategory) {
return InkWell(
onTap: () {
redirectToEditProfile(context);
},
child: Padding(
padding: EdgeInsets.all(5),
child: Column(
children: <Widget>[
Container(
height: 120,
width: 120,
color: Colors.blue,
),
Container(
width: 120,
height: 35,
// color: Colors.red,
child: Text(_nameCategory,),
),
],
),
),
);
}
}


void redirectToEditProfile(BuildContext context) async {
await Navigator.of(context).push(PageRouteBuilder(
opaque: false,
pageBuilder: (BuildContext context, _, __) {
return (Your Redirecting Activity);
}));
}