flutter Отключаемая зависимость переменной виджета - PullRequest
Новая
       36

flutter Отключаемая зависимость переменной виджета

0 голосов
/ 17 декабря 2018

Редактировать: Исправлено .. Посмотрите вниз

Старая проблема:

Я экспериментирую с виджетом Отклонение.Я могу успешно отслеживать состояние направления, которое сохраняется в directionVar.Он выводит что-то вроде DismissDirection.endToStart

Я хочу использовать эту информацию, чтобы изменить расположение иконки, которую я показываю.При удалении элемента фон имеет красный цвет со значком справа от него.Что-то в стиле Gmail. 

Widget build(BuildContext context) {
        DismissDirection directionVar;
        return ListView.builder(
          itemBuilder: (BuildContext context, int index) {
            return Dismissible(
              key: Key(products[index]['title']), //Should be unique.
              onDismissed: (DismissDirection direction) {
                directionVar = direction;
              },

Моя проблема заключается в этой части: 

              background: Container(
                 color: Colors.red,
                padding: EdgeInsets.only(left: 20.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: <Widget>[
                    Icon(
                      Icons.delete,
                    )
                  ],
                ),
              ),);});}

Я хочу, чтобы эта часть изменялась в зависимости от значения directionVar.padding должен меняться в зависимости от значения directionVar вместе с mainAxisAlignment.

Что-то вроде этого: 

        if(directionVar == DismissDirection.endToStart){

        } else if (directionVar == DismissDirection.startToEnd){

        }

Но я не могу получить доступ к background: и padding свойство в этих операторах, так как они являются свойством виджета Dismissible и не могут быть изменены внутри onDismissed(){}

Это кажется простой проблемой, но не можетрешить это.

Редактировать: Исправлено .. Очень просто .. Просто добавили это: 

   secondaryBackground: Container(
        color: Colors.red,
        padding: EdgeInsets.only(right: 20.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            Icon(
              Icons.delete,
            )
          ],
        ),
      ),

1 Ответ

0 голосов
/ 17 декабря 2018

Есть несколько способов, которыми вы можете достичь этого.Например, вы можете создать метод, который динамически обрабатывает направление, а затем соответствующим образом обновить его в дереве виджетов.Что-то вроде 

    List<dynamic> _resolveDirection(DismissDirection direction) {

    switch (direction) {
        case DismissDirection.endToStart:
          return [MainAxisAlignment.center, 20.0];
          break;
        case DismissDirection.startToEnd:
          return [MainAxisAlignment.start, 10.0];
          break;
        case DismissDirection.vertical:
          return [MainAxisAlignment.end, 5.0];
          break;
        // And so on...
        default:
          return [];
      }
    }

и затем замените ваше дерево на 

 background: Container(
                 color: Colors.red,
                padding: _resolveDirection(directionVar)[1],
                child: Row(
                  mainAxisAlignment: _resolveDirection(directionVar)[0],
                  children: <Widget>[
                    Icon(
                      Icons.delete,
                    )
                  ],
                ),
              ),);});}

В конце концов, все, что вам нужно делать каждый раз, когда происходит свайп, это просто перестроить свое дерево с обновленным направлением

setState(() => directionVar = direction);

...