Question

我想要的是让背景图像占据屏幕的一半以下，并在顶部添加一个Card Widget。从这里好。但是，当我插入另一个Card Widget时，它会改变位置，无法修复。

return SafeArea(
  child: Container(
    child: Column(
      children: [
        Stack(alignment: Alignment(0, 5.4), children: [
          ProfileBackgroundImage(
            backgroundImage:
                'https://images.unsplash.com/photo-1580331451062-99ff652288d7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
          ),
          ProfileMainBubble(
              name: 'Laia Montés',
              photoProfile:
                  'https://images.unsplash.com/photo-1578680671705-0965e325b2ba?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1233&q=80',
              profession: 'Singer and Guitarrist',
              description:
                  'I’m a musician who loves Pop and Rock. ? Currently studying for being a lawyer, but what I truly want is to sing in the shower.',
              isFollowing: isFollowing)
        ]),
        StatisticsBubble(
            uploads: 36, reproductions: 2000000, hearts: 128000),
      ],
    ),
  ),
);

问题是我需要设置ProfileMainBubble和StatisticsBubble的位置，以便内容可以更改。那有没有Stack的地方我都可以解决吗？

Answer 1

将其作为子级包装在Positioned（）小部件内：

Positioned(
  top: *modify here double values*,
  bottom: same with top and so on with left and right,
  child: ProfileBackgroundImage(
        backgroundImage:
            'https://images.unsplash.com/photo-1580331451062-99ff652288d7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
      )
)

请注意，定位小部件仅在Stack内部可用。

如果您想要所需的输出，请尝试以下操作：如果您想获得所需的输出，我建议

return SafeArea(
  child: Container(
    child: Column(
      children: [
        Stack(alignment: Alignment(0, 5.4), children: [
          ProfileBackgroundImage(
            backgroundImage:
                'https://images.unsplash.com/photo-1580331451062-99ff652288d7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
          ),

        ]),
        ProfileMainBubble(
              name: 'Laia Montés',
              photoProfile:
                  'https://images.unsplash.com/photo-1578680671705-0965e325b2ba?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1233&q=80',
              profession: 'Singer and Guitarrist',
              description:
                  'I’m a musician who loves Pop and Rock. ? Currently studying for being a lawyer, but what I truly want is to sing in the shower.',
              isFollowing: isFollowing),
        StatisticsBubble(
            uploads: 36, reproductions: 2000000, hearts: 128000),
      ],
    ),
  ),
);

Answer 2

Widget build(BuildContext context) {
    return Container(
        child: Align(
            alignment: FractionalOffset(0.5,0.5),
            child: Container(),
        )
    );
}

Answer 3

一种可能的解决方案是将我的窗口小部件填充到一列中，并添加SizedBox，并以ProfileBackgroundImage的固定高度计算。另外，很抱歉，但是我工作了，并且它们是更多的小部件，所以解决方案的名称是Column和SizedBox。

SafeArea(
  child: RefreshIndicator(
    onRefresh: _refreshProfile, // TODO: call to fetch the profile
    child: ListView(
      physics:
          const AlwaysScrollableScrollPhysics(), // TODO: when it goes up the backgroundImage resized and goes with a higher height
      children: <Widget>[
        Stack(alignment: Alignment(0, 5.4), children: <Widget>[
          Positioned(
            top: 0,
            child: ProfileBackgroundImage(
              backgroundImage:
                  'https://images.unsplash.com/photo-1580331451062-99ff652288d7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
            ),
          ),
          Column(
            children: <Widget>[
              SizedBox(
                  height: kBackgroundImageHeight / 2 +
                      kBackgroundImageHeight / 5),
              ProfileMainBubble(
                  name: 'Laia Montés',
                  photoProfile:
                      'https://images.unsplash.com/photo-1578680671705-0965e325b2ba?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1233&q=80',
                  profession: 'Singer and Guitarrist',
                  description:
                      'I’m a musician who loves Pop and Rock. ? Currently studying for being a lawyer, but what I truly want is to sing in the shower.',
                  isFollowing: isFollowing),
              const SizedBox(height: kCommonSeparation),
              StatisticsBubble(
                  uploads: 36, reproductions: 2000000, hearts: 128000),
              const SizedBox(height: kCommonSeparation),
              ProfileContributeBubble(
                contributeDescription:
                    'Small steps every day will bring what I truly want! ?',
              )
            ],
          )
        ]),
      ],
    ),
  ),
);

如何设置小部件的位置？

3 个答案: