Flutter

Flutter | 常用带事件处理的组件详解(主要IconBut

2020-07-07  本文已影响0人  凌川江雪

常用带事件处理的组件

IconButton 案例

icon:icon组件,可以用原生的封装;
onPressed:匿名函数,实现的点击事件;

代码:

IconButton(
              icon: Icon(Icons.description),
              onPressed: () {
                print('点击了icon  $index');
              },
            )

运行效果:


点击Icon图标:

ToggleButton 案例

代码:

List<bool> indexs = [true,false,false];
---------------------------------------------------------------------
ToggleButtons(
        children: [
          Text('Data1'),
          Text('Data2'),
          Text('Data3'),
        ],
        isSelected: indexs,
        onPressed: (int index){
          int count = 0;

          print('点击了: $index');

          //每次点击 遍历indexs数组,点击的页面设置为true,其他页面设置false
          setState(() {
            for(int buttonIndex =0;buttonIndex < indexs.length;buttonIndex++) {
              if(buttonIndex == index) {
                indexs[buttonIndex] = true;
              }else{
                indexs[buttonIndex] = false;
              }
            }
          });
        },
      )

运行效果:







参考自CSDN的Flutter入门课程

上一篇下一篇

猜你喜欢

热点阅读