Giter Site home page Giter Site logo

nash0x7e2 / animated-list-demo Goto Github PK

View Code? Open in Web Editor NEW
9.0 1.0 2.0 56 KB

Project files form my upcoming article on Flutter's Animated List

Java 6.26% Objective-C 12.40% Dart 81.35%
dartlang flutter flutter-animation flutter-examples flutter-community

animated-list-demo's Introduction

animated-list-demo's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

animated-list-demo's Issues

If I have several parts in a page that need to use AnimatedList, what should I do?

Thanks for your sharing, I have benefited a lot from it.If I have several parts in a page that need to use AnimatedList, what should I do?

  Widget singleRoomDevides(room, signal) {
    final GlobalKey<AnimatedListState> _listKey = GlobalKey();
    return Container(
        child: Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Padding(
          padding: EdgeInsets.only(top: 10.0, bottom: 10.0),
          child: Text(room['room_name'],
              style: TextStyle(
                  fontSize: ScreenUtil().setSp(26, false),
                  color: Color(0xff7D80A2))),
        ),
        Flexible(
          child: SafeArea(
            child: AnimatedList(
              key: _listKey,
              initialItemCount: room['devices'].length,
              itemBuilder:
                  (BuildContext context, int index, Animation animation) {
                return ScaleTransition(
                  scale: animation,
                  child: _singleDeviceCard(
                      room['room_id'], room['devices'][index], signal),
                );
              },
            ),
          ),
        )
      ],
    ));
  }

just like the above code show,I have several singleRoomDevides widget in my page, the _singleDeviceCard widget is a normal widget。

I get the following error:

flutter: Another exception was thrown: Vertical viewport was given unbounded height.
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#b6ace NEEDS-LAYOUT NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#b6ace NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderIgnorePointer#66c76 relayoutBoundary=up13 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderSemanticsAnnotations#c86fc relayoutBoundary=up12 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderPointerListener#e71b4 relayoutBoundary=up11 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderSemanticsGestureHandler#3bf80 relayoutBoundary=up10 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: _RenderScrollSemantics#aa75d relayoutBoundary=up9 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderPadding#3f9c7 relayoutBoundary=up8 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#e50a7 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#12023 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#42612 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#9ee0a NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#6a464 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderViewport#b6ace NEEDS-PAINT

Do you know how to fix it? Thank you.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.