美文网首页
flutter 分割线高度自适应

flutter 分割线高度自适应

作者: Faith_K | 来源:发表于2024-01-10 19:45 被阅读0次

使用 IntrinsicHeight VerticalDivider 来实现

image.png
Widget itemBuilder(BuildContext context, int index){

    String leftText = 'leftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftTextleftText';
    String rightText = 'rightText';

    return Container(
      decoration: BoxDecoration(
        color: index %2==0 ?const Color(0xffF7F8FA):const Color(0xffffffff)
      ),
      child: IntrinsicHeight(
        child: Row(
          children: [
            Expanded(
                child: Padding(
                  padding: const EdgeInsets.only(top: 6,bottom: 6,left: 6,right: 6),
                  child: Text(
                    leftText,
                    style: TextStyle(fontSize: 12, color: Color(0xff5E5F66)),
                  ),
                )
            ),
            const VerticalDivider(
              width: 2,
              thickness: 1,
              indent: 0,
              endIndent: 0,
              color: Color(0xffE5E6EB)
            ),
            Expanded(
                child: Padding(
                  padding: const EdgeInsets.only(top: 6,bottom: 6,left: 6,right: 6),
                  child: Text(
                    rightText,
                    style:const TextStyle(fontSize: 12, color: Color(0xff5E5F66)),
                  ),
                )
            ),
          ],
        ),
      ),
    );
  }

相关文章

网友评论

      本文标题:flutter 分割线高度自适应

      本文链接:https://www.haomeiwen.com/subject/cbmzndtx.html