使用幻灯片菜单（在抽屉中）中的复选框和滑块，可以吗？

Question

我正试图在滑动菜单中添加小部件，不知道是否可行。我想将幻灯片菜单用作搜索页面的过滤器选择页面。

Answer 1

是的，有可能。您可以将“自定义”布局用作Drawer小部件的子级。

drawer: new Drawer(
    child: new Container(
      padding: new EdgeInsets.all(32.0),
      child: new Column(
        children: <Widget>[

          ListTile(
            title: Text('Select Language', style: TextStyle(fontSize: 16),),
            onTap: null,
          ),

          _drawerItemLanguage(),

          itemDivider(),

          ListTile(
            title: Text('Select Price :'+sliderValue.toString(), style: TextStyle(fontSize: 16),),
            onTap: null,
          ),

          _drawerItemRandeSlider(),

        ],
      ),
    ),
  ),


Widget _drawerItemLanguage(){
return Column(
  children: <Widget>[
    CheckboxListTile(
      title: Text("English"),
      value: selectedData,
      onChanged: (bool value){
        setState(() {
          selectedData = value;
        });
      },
      secondary: Icon(Icons.language),
    ),

    CheckboxListTile(
      title: Text("Hindi"),
      value: filledData,
      onChanged: (bool value){
        setState(() {
          filledData = value;
        });
      },
      secondary: Icon(Icons.language),
    ),


  ],
);
}


 Widget _drawerItemRandeSlider(){
return ListTile(
  leading: Text("0"),
  contentPadding: EdgeInsets.only(top: 20.0),
  title: Slider(
    value: sliderValue,
    min: 0.0,
    max: 100.0,
    onChanged: (value){
      setState(() {
        sliderValue = value;
      });
    },
    activeColor: Colors.green,
    //inactiveColor: Colors.red,
    divisions: 100,
    label: sliderValue.toString(),
  ),
  trailing: Text("100"),
);
}

itemDivider(){
return Divider(
  height: 1,
  color: Colors.black,
);
}