Dn-a / flutter_tags

With flutter tags you can create selectable or input tags that automatically adapt to the screen width
https://pub.dartlang.org/packages/flutter_tags
MIT License
507 stars 127 forks source link

Using SelectableTags in ListView,when sliding listview and tags will redraw, it cause view jitter. #14

Closed windows7lake closed 5 years ago

windows7lake commented 5 years ago

Using SelectableTags in ListView,when sliding listview and tags will redraw, it cause view jitter. Have any idea about it?

windows7lake commented 5 years ago

There is a set of SelectableTags in the listview,after SelectableTags move out screen and then slide into the screen, it happened.

Dn-a commented 5 years ago

@windows7lake wrap with container....if it does not work, post your code here

milosjovac commented 5 years ago

When wrapped with container there is a render overflow for a couple of ms, so this cannot be used as a solution.

image

By debugging I have noticed that build method of class _SelectableTagsState is always called 2 times. Once with _width=0.0 and second time with real _width value calculated inside _getwidthContainer().

For this reason first tag set is created with every tag in it's own row, and total height = tagNum * tagHeight.

image

After width is calculated (t < sec) more tags can be in the same row, and height is smaller.

image

This transition between _width=0 and _width>0 makes ListView/static screens to jitter/jump.

Solution: Just return empty container in case width is 0. This is a code snippet from class _SelectableTagsState

  @override
  Widget build(BuildContext context) {
    // essential to avoid infinite loop of addPostFrameCallback
    if (MediaQuery.of(context).orientation != _orientation || _width == 0) {
      _getwidthContainer();
      return Container(
        key: _containerKey,
        color: widget.backgroundContainer ?? Colors.white,
      );
    }
Dn-a commented 5 years ago

@milosjovac Ok thanks. is a problem due to the fact that to get the exact width it is necessary to first build the layout, then build is called to set the width previously obtained. it is a problem that does not always arise, and I have not yet understood why. I will make the necessary changes.

Dn-a commented 5 years ago

@milosjovac @windows7lake fixed in 0.3.2 version.