我只是想在Flutter中使用ExpansionTile
,从我修改的示例中变成这样:
我想隐藏箭头并使用Switch
来展开图块,可以吗?或者我需要自定义的小部件,以编程方式呈现儿童?基本上,我只需要显示/隐藏孩子们
下面是我的代码:
import 'package:flutter/material.dart';
void main() {
runApp(ExpansionTileSample());
}
class ExpansionTileSample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('ExpansionTile'),
),
body: ListView.builder(
itemBuilder: (BuildContext context, int index) =>
EntryItem(data[index]),
itemCount: data.length,
),
),
);
}
}
// One entry in the multilevel list displayed by this app.
class Entry {
Entry(this.title,[this.question='',this.children = const <Entry>[]]);
final String title;
final String question;
final List<Entry> children;
}
// The entire multilevel list displayed by this app.
final List<Entry> data = <Entry>[
Entry(
'Chapter A',
'',
<Entry>[
Entry(
'Section A0',
'',
<Entry>[
Entry('Item A0.1'),
Entry('Item A0.2'),
Entry('Item A0.3'),
],
),
Entry('Section A1','text'),
Entry('Section A2'),
],
),
Entry(
'Chapter B',
'',
<Entry>[
Entry('Section B0'),
Entry('Section B1'),
],
),
Entry(
'Chapter C',
'',
<Entry>[
Entry('Section C0'),
Entry('Section C1')
],
),
];
// Displays one Entry. If the entry has children then it's displayed
// with an ExpansionTile.
class EntryItem extends StatelessWidget {
const EntryItem(this.entry);
final Entry entry;
Widget _buildTiles(Entry root) {
if (root.children.isEmpty) return Container(
child:Padding(
padding: const EdgeInsets.symmetric(
vertical: 8.0,
horizontal: 32.0,
),
child:Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children:[
Text(root.title),
Divider(height: 10.0,),
root.question=='text'?Container(
width: 100.0,
child:TextField(
decoration: const InputDecoration(helperText: "question")
),
):Divider()
]
)
)
);
return ExpansionTile(
//key: PageStorageKey<Entry>(root),
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children:[
Text(root.title),
Switch(
value:false,
onChanged: (_){},
)
]
),
children: root.children.map(_buildTiles).toList(),
);
}
@override
Widget build(BuildContext context) {
return _buildTiles(entry);
}
}
6条答案
按热度按时间oxcyiej71#
@diegoveloper的回答几乎可以,一个没有涉及的小问题是:它不会将单击
Switch
进一步传播到ExpansionTile
,因此如果您单击外部开关,它会扩展,而单击Switch
则不会执行任何操作。用IgnorePointer
Package 它,并在扩展事件中设置switch的值。这是一个有点落后的逻辑,但工作得很好。3htmauhk2#
0tdrvxhp3#
是的,这是可能的,我修改了你的代码一点:
基本上,我从Stateless改为Stateful,因为您需要处理
Switch
小部件的状态。在
ExpansionTile
中有一个trailing
属性,我在其中放置了Switch,以默认删除arrow
小部件。收听
onExpansionChanged: _onExpansionChanged,
,以更改交换机的状态。最后将子组件构建为新的widget:
5ktev3wc4#
**简答:**设置initiallyExpanded为true或false,相应的可以借助onExpansionChanged。但请记住initiallyExpanded仅适用于初始状态,因此应更改小部件的键以应用更改。现在要更改关键点,解决方法是:
nzkunb0c5#
initiallyExpanded = true,这个答案是正确的,但是如果我们在ExpansionTile的子元素中有一个TextFiled,那么键盘会自动隐藏(bug)。所以我的解决方案是用Visibilitywidget和控件visibilty Package 孩子。初始声明**
bool _expansionVisibility = false
;**d7v8vwbk6#
现在有一个
ExpansionTileController
,它可以用编程方式关闭切片,如docs中所解释的。