颤振不会在容器中着色

时间:2020-09-21 16:38:08

标签: flutter flutter-layout

我正在使用flutter,我有一个自定义的小部件。我使用list.builder创建小部件列表。现在,我想为自定义小部件所在的容器着色,但是我不能。我对可以看到的每个容器进行了颜色编码,但由于某种原因,我不能。我更进一步,将自定义小部件的所有单个部分都涂上了颜色。

自定义小部件:

    return Scaffold(
      body: Center(
        child: AnimatedContainer(
          width: 400,
          height: 400,
          duration: Duration(seconds: 0),
          decoration: BoxDecoration(
            borderRadius: BorderRadius.all(Radius.circular(10.0)),
            border: Border.all(color: Colors.black),
            color: Colors.pink,
          ),
          child: Stack(
            children: [
              Container(
                margin: EdgeInsets.fromLTRB(15, 15, 15, 0),
                padding: EdgeInsets.symmetric(horizontal: 10, vertical: 3),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(Radius.circular(5.0)),
                  border: Border.all(color: Colors.black),
                  color: Colors.indigoAccent,

                ),
                child: Text(
                  title,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
              Container(
                color: Colors.limeAccent,
                child: FutureBuilder(
                    future: RetrieveProfile_getImage(),
                    initialData: [],
                    builder: (context, snapshot) {
                      if (snapshot.connectionState == ConnectionState.waiting) {
                        return Center(
                            child: Text('Please wait its loading...'));
                      } else {
                        if (snapshot.hasError) {
                          return Center(
                              child: Text('Error: ${snapshot.error}'));
                        } else {
                          return new Container(
                            margin: EdgeInsets.fromLTRB(0, 50, 0, 0),
                            // padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
                            color: Colors.lightGreenAccent,
                            height: 275,
                            child: Center(
                              child: Image(
                                fit: BoxFit.contain,
                                image: MemoryImage(_base64),
                              ),
                            ),
                          );
                        }
                      }
                    }),
              ),
              Container(
                margin: EdgeInsets.fromLTRB(15, 330, 15, 0),
                padding: EdgeInsets.symmetric(horizontal: 10, vertical: 3),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(Radius.circular(5.0)),
                  border: Border.all(color: Colors.black),
                  color: Colors.orange,

                ),
                child: Text(
                  owner,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
              Container(
                margin: EdgeInsets.fromLTRB(15, 360, 15, 0),
                padding: EdgeInsets.symmetric(horizontal: 10, vertical: 3),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(Radius.circular(5.0)),
                  border: Border.all(color: Colors.black),
                  color: Colors.purpleAccent,

                ),
                child: Text(
                  location,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
              Container(
                color: Colors.lightBlue,
                margin: EdgeInsets.fromLTRB(340, 345, 15, 35),
                child: FutureBuilder(
                  future: getLikes(),
                  initialData: [],
                  builder: (context, snapshot) {
                    if (snapshot.connectionState == ConnectionState.waiting) {
                      return Center(child: Text('Please wait its loading...'));
                    } else {
                      if (snapshot.hasError) {
                        return Center(child: Text('Error: ${snapshot.error}'));
                      } else {
                        return LikeButton(
                          isLiked: _liked,
                          animationDuration: Duration(milliseconds: 500),
                          onTap: changeLike,
                          likeBuilder: (bool isLiked) {
                            return Icon(
                              Icons.favorite,
                              color: isLiked ? Colors.red : Colors.grey,
                            );
                          },
                          countPostion: CountPostion.left,
                          likeCount: likeCount,
                          countBuilder: (likeCount, bool isLiked, String text) {
                            var color = isLiked ? Colors.red : Colors.grey;
                            Widget result;
                            if (likeCount == 0) {
                              result = Text(
                                '',
                                style: TextStyle(color: color),
                              );
                            } else {
                              result = Text(
                                likeCount.toString(),
                                style: TextStyle(color: color),
                              );
                            }
                            return result;
                          },
                        );
                      }
                    }
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );

ListBuilder:

ListView.builder(
                                              scrollDirection: Axis.horizontal,
                                              itemCount: likedEvent.length,
                                              itemBuilder: (context, index) {
                                                EventResource e =
                                                    likedEvent[index];
                                                print("ID: " + e.photoModel.id);
                                                return Material(
                                                    color: Colors.deepPurple,
                                                    child: Container(
                                                      color: Colors.amber,
                                                      margin: EdgeInsets.all(12),
                                                      child: Container(
                                                        width: 430,
                                                        color: Colors.green,
                                                        child: Container(
                                                            color: Colors.blue,
                                                            child: Event(
                                                              user: id,
                                                              owner: e.owner,
                                                              location: e.address,
                                                              title: e.name,
                                                              ImageID: e.photoModel.id,
                                                            )
                                                        ),
                                                      ),
                                                    ));
                                              },
                                            );

颤动渲染:

enter image description here

1 个答案:

答案 0 :(得分:0)

backgroundColor内设置scaffold