如何在富文本flutter中使用expanded答案

【问题标题】：How to use expanded in rich text flutter如何在富文本flutter中使用expanded
【发布时间】：2022-01-01 15:58:24
【问题描述】：

大家晚上好。我试图在我的富文本中使用扩展但无法实现。我的主要问题是小部件在不同的屏幕尺寸上溢出，所以我需要一种如何实现扩展的方法，因为扩展将帮助文本根据屏幕的尺寸适应

代码：

  Container(
                width: double.maxFinite,
                height: 100,
                margin: const EdgeInsets.only(left: 150,top: 50),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "Watch your playlist",
                      style: TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                        color: color.AppColor.homePageDetails
                      ),
                    ),
                    SizedBox(height: 10,),//56:39
                    RichText(
                      text: TextSpan(
                       text: "stream up\n",
                        style:TextStyle(
                          color: color.AppColor.homePagePlanColor,
                          fontSize: 16
                        ),
                        children: [
                          TextSpan(
                            text:"check out your favourite"
                          )
                        ]
                      ),
                    ),

                  ],
                ),
              )

【问题讨论】：

RichText 的父窗口小部件是什么？您能否提供有关其祖先的更多详细信息？
@YeasinSheikh 我已经更新了代码，请看看谢谢

标签： flutter flutter-layout cross-platform

【解决方案1】：

很久以前我也遇到过同样的问题，一个解决方案是在 Row 中使用 Flexible Widget：

             Row(
                children: [
                  Flexible(
                    child: RichText(
                      text: const TextSpan(
                          text: "stream up\n",
                          color: color.AppColor.homePagePlanColor,
                          style: TextStyle(fontSize: 16),
                          children: [
                            TextSpan(text: "check out your favourite")
                          ]),
                    ),
                  ),
                ],
              ),

请务必使用 const 来避免性能问题。

【讨论】：

【解决方案2】：

你可以使用这个包 = flutter_screenutil 它为不同的屏幕尺寸按比例分配所有应用程序内容

【讨论】：

【解决方案3】：

溢出问题来自Container 的height。您可以简单地从 Container 中删除 height ，它会正常工作而没有任何问题

     Container(
            width: double.maxFinite,
            margin: const EdgeInsets.only(left: 150, top: 50),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [

注意：左边距 150 为 150px，"stream up\n" => \n 创建换行符。默认情况下，它会根据需要占用尽可能多的大小

【讨论】：

【解决方案4】：

                      Expanded(
                              child: SingleChildScrollView(
                                scrollDirection: Axis.horizontal,
                                child: RichText(
                                  text: TextSpan(

为我工作

【讨论】：