Блог

Главная - Вопросы по программированию - Применение преобразования к виджету без перерисовки дерева виджетов

Применение преобразования к виджету без перерисовки дерева виджетов

#flutter #flutter-animation

Вопрос:

Допустим, у меня есть эта стопка:

 Stack(
  children: [
    Column( // ==> I want to apply tranform (more specifically translate) on this
      children: [
        // a whole bunch of widgets
      ],
    ),
    Column( // ==> and this
      children: [
        // a whole bunch of widgets
      ],
    ),
  ],
);

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

Один из способов добиться этого-обернуть каждый столбец в an AnimatedBuilder , но это означало бы, что в каждом кадре потребуется воссоздать все дерево виджетов, что не идеально.

В родном Android есть этот метод, который делает то, что мне нужно:
someView.animate().translateX(100).withLayer();

Есть ли эквивалент этому в flutter или какой-либо другой способ достичь этого?

Комментарии:

1. AnimatedBuilder имеет child собственность

2. @pskink я не понимаю. Не могли бы вы уточнить?

3. проверьте официальную документацию по AnimatedBuilder.child собственности (и по AnimatedBuilder классу тоже).

4. Хорошо, я понял, спасибо. Я не знаю, как я это пропустил!

Ответ №1:

Благодаря @pskink, вот как это делается:

 Stack(
    children: [
      AnimatedBuilder(
        animation: _animation,
        builder: (context, child) {
          return Transform.translate(
            offset: Offset(_animation.value, 0),
            child: child,
          );
        },
        child: Column(
          children: [
            // a whole bunch of widgets
          ],
        ),
      ),
      ...
    ],
  );

Виджет , который необходимо изменить, чтобы произошло преобразование, таков Transform.translate , поэтому я поместил его в builder класс, а остальную часть дерева, на которую он не должен влиять, я поместил в свойство AnimatedBuilder «s child «.
Затем дочерний элемент передается обратно в builder метод, где я могу просто передать его дочернему свойству того, что находится внутри метода builder, и он не будет перестроен.

Метки: