import 'package:dating_touchme_app/components/page_appbar.dart'; import 'package:dating_touchme_app/extension/ex_widget.dart'; import 'package:dating_touchme_app/generated/assets.dart'; import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:tdesign_flutter/tdesign_flutter.dart'; class TimelineInfo extends StatefulWidget { const TimelineInfo({super.key}); @override State createState() => _TimelineInfoState(); } class _TimelineInfoState extends State { bool showInput = false; @override Widget build(BuildContext context) { return Scaffold( appBar: PageAppbar(title: "详情"), body: Stack( children: [ SingleChildScrollView( child: Container( padding: EdgeInsets.symmetric( horizontal: 16.w, vertical: 10.w ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Row( children: [ Image.asset( Assets.imagesUserAvatar, width: 40.w, height: 40.w, ), SizedBox(width: 8.w,), Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "刘美玲", style: TextStyle( fontSize: 13.w, fontWeight: FontWeight.w500 ), ), Text( "15:16", style: TextStyle( fontSize: 11.w, color: const Color.fromRGBO(51, 51, 51, .6), fontWeight: FontWeight.w500 ), ) ], ) ], ), PopupMenuButton( tooltip: "", padding: EdgeInsets.zero, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14)), color: Colors.white, elevation: 8, offset: Offset(0, 32.w), // 相对按钮下移一点 itemBuilder: (context) => [ const PopupMenuItem(value: 'report', child: Text('举报')), ], onSelected: (v) { if (v == 'report') { print("举报"); } }, child: Icon( Icons.keyboard_control, size: 15.w, color: const Color.fromRGBO(51, 51, 51, 1), ), // 你的小圆按钮 ), ], ), Container( margin: EdgeInsets.symmetric(vertical: 11.w), child: Text( "你总顾及别人，那谁来顾及你。你总顾及别人，那谁来顾及你。你总顾及别人，那谁来顾及你。你总顾及别人，那谁来顾及你。" ), ), Image.asset( Assets.imagesRoseBanner, width: 343.w, ), SizedBox(height: 15.w,), Row( mainAxisAlignment: MainAxisAlignment.end, children: [ Row( children: [ Image.asset( Assets.imagesLikeIcon, width: 14.w, height: 12.w, ), SizedBox(width: 6.w,), Text( "47", style: TextStyle( fontSize: 11.w, color: const Color.fromRGBO(144, 144, 144, .6) ), ) ], ), SizedBox(width: 33.w,), Row( children: [ Image.asset( Assets.imagesCommentIcon, width: 15.w, height: 15.w, ), SizedBox(width: 6.w,), Text( "23", style: TextStyle( fontSize: 11.w, color: const Color.fromRGBO(144, 144, 144, .6) ), ) ], ).onTap((){ showInput = true; setState(() { }); }), ], ), SizedBox(height: 18.w,), Text( "全部评论(23)", style: TextStyle( fontSize: 13.w, color: const Color.fromRGBO(144, 144, 144, 1), fontWeight: FontWeight.w500 ), ), SizedBox(height: 20.w,), CommentItem(), CommentItem(), CommentItem(), CommentItem(), CommentItem(), CommentItem(), CommentItem(), ], ), ), ), if(showInput) Positioned.fill( child: Container( color: const Color.fromRGBO(0, 0, 0, .4), ).onTap((){ showInput = false; setState(() { }); }), ), if(showInput) Positioned( left: 0, bottom: 0, child: Container( width: 375.w, height: 60.w, color: Colors.white, padding: EdgeInsets.all(10.w), child: Row( children: [ Expanded( child: Container( decoration: BoxDecoration( color: const Color.fromRGBO(247, 247, 247, 1), borderRadius: BorderRadius.all(Radius.circular(40.w)) ), child: TextField( // controller: _codeController, autofocus: true, style: TextStyle( fontSize: ScreenUtil().setWidth(14), height: 1 ), decoration: InputDecoration( contentPadding: EdgeInsets.symmetric( vertical: 0, horizontal: 17.w ), hintText: "请输入评论", border: const OutlineInputBorder( borderSide: BorderSide.none, // 这将移除边框 // 可选：设置圆角 ), // 如果你希望聚焦时和未聚焦时都没有边框，也可以设置 focusedBorder 和 enabledBorder focusedBorder: const OutlineInputBorder( borderSide: BorderSide.none, borderRadius: BorderRadius.all(Radius.circular(4.0)), ), enabledBorder: const OutlineInputBorder( borderSide: BorderSide.none, borderRadius: BorderRadius.all(Radius.circular(4.0)), ), ), onChanged: (value){ }, ), ), ), Container( width: 60.w, height: 30.w, margin: EdgeInsets.only(left: 15.w), decoration: BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(30.w)), gradient: LinearGradient( begin: Alignment.centerLeft, // 0%：左边开始 end: Alignment.centerRight, // 100%：右边结束 colors: [ Color.fromRGBO(131, 89, 255, 1), // 紫色 Color.fromRGBO(77, 127, 231, 1), // 中间淡蓝 Color.fromRGBO(61, 138, 224, 1), // 右侧深蓝 ], stops: [0.0, 0.7753, 1.0], // 对应 CSS 百分比：0%、77.53%、100% ), ), child: Center( child: Text( "发送", style: TextStyle( fontSize: 12.w, color: Colors.white ), ), ), ) ], ), ), ) ], ), ); } } class CommentItem extends StatefulWidget { const CommentItem({super.key}); @override State createState() => _CommentItemState(); } class _CommentItemState extends State { @override Widget build(BuildContext context) { return Container( margin: EdgeInsets.only(bottom: 20.w), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ Image.asset( Assets.imagesUserAvatar, width: 40.w, height: 40.w, ), SizedBox(width: 8.w,), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "刘美玲", style: TextStyle( fontSize: 13.w, color: const Color.fromRGBO(144, 144, 144, 1), ), ), SizedBox(height: 5.w,), SizedBox( child: Text( "看起来还不错！看起来还不错！看起来还不错！看起来还不错！看起来还不错！看起来还不错！看起来还不错！看起来还不错！", style: TextStyle( fontSize: 13.w, fontWeight: FontWeight.w500 ), ), ), SizedBox(height: 5.w,), Text( "15:16·回复", style: TextStyle( fontSize: 11.w, color: const Color.fromRGBO(51, 51, 51, .6), ), ), ], ), ) ], ), ), // Image.asset( // Assets.imagesLikeIcon, // width: 14.w, // ) ], ), ); } }