检测小部件是否溢出

Question

我想根据蓝色更改红色小部件的位置。

情况1： 如果蓝色列表小部件的高度小于屏幕高度，则将红色的红色控件定位到屏幕底部。

情况2： 如果蓝色列表小部件的高度高于屏幕高度，则将红色小部件的位置定位在小部件的底部。

Answer 1

当涉及列表的内容看起来过于复杂时，研究slivers通常很有趣。

对于您来说，一个条子就解决了您的问题：SliverFillRemaining

以下是您的问题的示例实现，主要是受Flutter团队提供的代码启发。

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: MyStatelessWidget(),
      ),
    );
  }
}

class MyStatelessWidget extends StatelessWidget {
  MyStatelessWidget({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: <Widget>[
        SliverList(
          delegate: SliverChildListDelegate(
            [
              Container(
                color: Colors.amber[300],
                height: 150.0,
              ),
              Container(
                color: Colors.green[300],
                height: 150.0,
              ),
            ]
          ),
        ),
        SliverFillRemaining(
          hasScrollBody: false,
          child: Container(
            alignment: Alignment.bottomCenter,
            color: Colors.red,
            child: Icon(
              Icons.sentiment_very_satisfied,
              size: 75,
              color: Colors.blue[900],
            ),
          ),
        ),
      ],
    );
  }
}