flutter 文字 超过了就省略,没超过就自适应,右边还有小图

2024-03-20  本文已影响0人  一个冬季

需求描述

flutter 设置文字 超过了就省略,没超过就自适应,文字右边是一张小图标,文字少小图标紧贴文字,文字多,文字会出现省略符号,小图标也是紧贴文字

图片简图

1711010669644.jpg

代码展示

              Container(
                          ...
                            width: double.infinity,
                            height: 54.w,
                            child: Row(
                              children: [
                                .......
                                Expanded(child: Row(
                                  mainAxisSize: MainAxisSize.min,
                                  children: [
                                    //这里就是大量文字
                                    Flexible(
                                      child:Text("这里就是大量文字展示UI",
                                        maxLines: 1,
                                        overflow: TextOverflow.ellipsis,
                                        style: TextStyle(color: ColorName.FFFFFF,fontSize: 15.sp),),),
                                   .....
                                  //这里就是紧贴的小图标
                                    Container(
                                        constraints: BoxConstraints( maxWidth: 50.w,  maxHeight: 18.w,),
                                        child: Row(
                                          mainAxisAlignment: MainAxisAlignment.start,
                                          mainAxisSize: MainAxisSize.min,
                                          children: [
                                            Image.asset("../image/path",width: 18.w,height: 17,),
                                            Text("5",style: TextStyle(color: ColorName.FFFFFF,fontSize: 11.sp),)
                                          ],
                                        ),
                                      ),,
                                  ],
                                )),
                              ],
                            ),
                          ......
                          )
上一篇 下一篇

猜你喜欢

热点阅读