Какой эффективный способ реализовать BottomModalSheet, содержащий в себе Multiple checkBoxTile - PullRequest
Новая
       38

Какой эффективный способ реализовать BottomModalSheet, содержащий в себе Multiple checkBoxTile

0 голосов
/ 23 марта 2020

Я реализовал лист BottomModalSheet, содержащий в себе некоторый файл checkBoxTile, но, похоже, он отстает. Поэтому я ищу лучший способ реализации.

Я сделал это следующим образом: -

showBottomSheetSwitch.dart 

import 'package:flutter/material.dart';

class BottomSheetSwitch extends StatefulWidget {
  final String title;
  final bool switchValue;
  final ValueChanged valueChanged;

  BottomSheetSwitch({this.switchValue, this.valueChanged, this.title});

  @override
  _BottomSheetSwitchState createState() => _BottomSheetSwitchState();
}

class _BottomSheetSwitchState extends State<BottomSheetSwitch> {
  bool _switchValue;
  String _title;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _switchValue = widget.switchValue;
    _title = widget.title;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: CheckboxListTile(
        title: Text(
          _title,
          style: TextStyle(
              color: Colors.black54, fontSize: 20, fontFamily: 'ProductSans'),
        ),
        activeColor: Colors.purple,
        value: _switchValue,
        onChanged: (value) {
          setState(() {
            _switchValue = value;
            widget.valueChanged(value);
          });
        },
      ),
    );
  }
}

вот код, где он вызывается: - 

floatingActionButton: FloatingActionButton(
        splashColor: Colors.deepPurple,
        onPressed: () => showModalBottomSheet(
            shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(15),
                    topRight: Radius.circular(15))),
            elevation: 5,
            context: context,
            builder: (BuildContext context) {
              return Container(
                  height: 300,
                  padding: EdgeInsets.all(20),
                  child: Column(
                    children: <Widget>[
                      BottomSheetSwitch(
                        title: "Gluten Free",
                        switchValue: _glutenFree,
                        valueChanged: (value) {
                          _glutenFree = value;
                        },
                      ),
                      BottomSheetSwitch(
                        title: "Lactose Free",
                        switchValue: _lactoseFree,
                        valueChanged: (value) {
                          _lactoseFree = value;
                        },
                      ),
                      BottomSheetSwitch(
                        title: "Vegan",
                        switchValue: _vegan,
                        valueChanged: (value) {
                          _vegan = value;
                        },
                      ),
                      BottomSheetSwitch(
                        title: "Vegetarian",
                        switchValue: _vegetarian,
                        valueChanged: (value) {
                          _vegetarian = value;
                        },
                      )
                    ],
                  ));
            }),
        child: Icon(Icons.filter_list),
      )

Моя проблема в том, что он работает, но слишком отстает. я не знаю почему.

...