Flutter - 容器高度与子 Text.length 相同? [英] Flutter - Container height same as child Text.length?

问题描述

各位开发者晚上好，

我正在尝试为我的父容器找到一种将其高度设置为等于子文本小部件内容的方法.Text 小部件中的文本 (textDes) 正在发生变化.它可以是短的也可以是长的，因此我不能将 height: 设置为一个特定的数字，比如 1400，因为它看起来很难看.

I am trying to find a way for my parent container to have its height set to be equal to the child text widget content. The text (textDes) in the Text widget is changing. It can be short or long and for that reason I can not set the height: to a specific number like 1400 because it will look ugly.

请善待我，帮助我，尝试几个小时.

Please be so kind and help me, trying for hours.

import 'package:angelbay_bungalows/screens/overview.dart';
import 'package:angelbay_bungalows/widgets/drawer.dart';
import 'package:flutter/material.dart';

class Amenities extends StatelessWidget {
  final String titleTop;
  final String textDes;
  final String img;

  Amenities(this.titleTop, this.textDes, this.img);

  final GlobalKey<ScaffoldState> scaffoldKey = GlobalKey<ScaffoldState>();
  @override
  Widget build(BuildContext context) {
    var screenSize = MediaQuery.of(context).size;

    return Scaffold(
      key: scaffoldKey,
      drawer: AppDrawer(),
      body: SingleChildScrollView(
          child: Container(
        height: 1400,
        width: screenSize.width,
        child: Stack(
          // overflow: Overflow.visible,
          children: <Widget>[
            Image.asset(
              "$img",
              height: 400.0,
              width: screenSize.width,
              fit: BoxFit.cover,
            ),
            Positioned(),
            Positioned(),
            Positioned(
              top: 375.0,
              child: Container(
                // height: ,
                width: screenSize.width,
                decoration: BoxDecoration(
                  color: Color.fromRGBO(216, 216, 216, 1),
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(30.0),
                    topRight: Radius.circular(30.0),
                  ),
                ),
                child: Padding(
                  padding: const EdgeInsets.all(25.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Text(
                        titleTop,
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 26.0,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      SizedBox(
                        height: 40.0,
                      ),
                      Text(
                        'Description',
                        style: TextStyle(
                          fontSize: 18.0,
                          fontWeight: FontWeight.w500,
                          color: Color.fromRGBO(50, 54, 67, 1),
                        ),
                      ),
                      SizedBox(
                        height: 20.0,
                      ),
                      Text(
                        textDes,
                        style: TextStyle(
                          fontSize: 16.0,
                          color: Color.fromRGBO(117, 117, 117, 1),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ],
        ),
      )),
    );
  }
}

推荐答案

将您的 Text 小部件包装在 Expanded 中并删除硬编码的高度 1400

Wrap your Text widget inside an Expanded and remove the hardcoded height of 1400

                          Expanded(
                            child: Text(
                              textDes,
                              style: TextStyle(
                                fontSize: 16.0,
                                color: Color.fromRGBO(117, 117, 117, 1),
                              ),
                            ),
                          ),

希望对你有帮助！！

这篇关于Flutter - 容器高度与子 Text.length 相同?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！