Проблема производительности флаттера модального нижнего листа - PullRequest
Новая
       66

Проблема производительности флаттера модального нижнего листа

0 голосов
/ 24 февраля 2020

При перетаскивании модальных нижних листов приложение флаттера начинает отставать, если на листе много виджетов. Это происходит только на модальном нижнем листе (showModalBottomSheet), а не на обычном (showBottomSheet). Ниже я приложил скриншот анализа производительности, который показывает, что все виджеты внутри листа постоянно перестраиваются, пока пользователь перетаскивает.

Я написал небольшую демонстрацию для сравните производительность двух типов листов. Есть ли способ предотвратить восстановление при перетаскивании? 

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

/// This Widget is the main application widget.
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "demo",
      home: Scaffold(
        body: MyButtons(),
      ),
    );
  }
}

class MyButtons extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          RaisedButton(
            onPressed: () {
              showModalBottomSheet<void>(
                context: context,
                builder: (context) => BottomSheet(),
              );
            },
            child: Text("show modal (laggy)"),
          ),
          RaisedButton(
            onPressed: () {
              showBottomSheet<void>(
                context: context,
                builder: (context) => BottomSheet(),
              );
            },
            child: Text("show normal (not laggy)"),
          ),
        ],
      ),
    );
  }
}

class BottomSheet extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Wrap(
      spacing: 8.0,
      alignment: WrapAlignment.center,
      children: List<Widget>.generate(
        100,
        (int index) {
          return InputChip(
            label: Text("test"),
          );
        },
      ),
    );
  }
}

1 Ответ

0 голосов
/ 29 апреля 2020

Я создал этот PR , чтобы исправить эту проблему производительности. Проблема заключалась в том, что AnimatedContainer из ModalBottomSheet не использовал свойство child, и поэтому было вынуждено многократно вызывать метод builder во время анимации вместо использования уже созданного дочернего виджета.

...