import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:huixiang/generated/l10n.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:huixiang/view_widget/my_appbar.dart'; class HotArticleDetailsPage extends StatefulWidget { @override State createState() { return _HotArticleDetailsPage(); } } class _HotArticleDetailsPage extends State { var controller = new ScrollController(); @override Widget build(BuildContext context) { return Scaffold( appBar: MyAppBar( background: Color(0xFFFFFFFF), leadingColor: Colors.black, title: S.of(context).wenzhangxiangqing, titleColor: Colors.black, titleSize: 16.sp, action: Padding( padding: EdgeInsets.only(right: 16.w), child: Image.asset( "assets/image/icon_share.png", width: 24.w, height: 24.h, ), ), ), body: Container( child: SingleChildScrollView( physics: BouncingScrollPhysics(), child: Column( children: [ Container( margin: EdgeInsets.only(bottom: 20.h), padding: EdgeInsets.all(16), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 2), blurRadius: 14, spreadRadius: 0, ) ], ), child: Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( "牡丹花的养护知识", style: TextStyle( fontSize: 24.sp, fontWeight: FontWeight.bold, color: Color(0xff1A1A1A), ), ), SizedBox( height: 20.h, ), Row( children: [ ClipOval( child: Image.network( "https://t7.baidu.com/it/u=2841334870,333581502&fm=193&f=GIF", fit: BoxFit.cover, width: 44.w, height: 44.h, ), clipBehavior: Clip.hardEdge, ), SizedBox( width: 8.w, ), Expanded( child: Container( height: 60.h, child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: [ Text.rich( TextSpan(children: [ TextSpan( text: "百花谷", style: TextStyle( fontWeight: FontWeight.bold, fontSize: 14.sp, color: Colors.black), ), ]), textDirection: TextDirection.ltr, ), Text( "2021.04.12 12:12", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 12.sp, color: Color(0xff808080), ), ), ], ), ), flex: 1, ) ], ), SizedBox( height: 20.h, ), RichText( text: TextSpan( text: "文本，是指书面语言的表现形式，从文学角度说，通常是具有完整、系统含义（Message）的一个句子或多个句子的组合。" "一个文本可以是一个句子（Sentence）、一个段落（Paragraph）或者一个篇章（Discourse）。广义“文本”：" "任何由书写所固定下来的任何话语。（利科尔） 狭义“文本”：由语言文字组成的文学实体，代指“作品”，相对于作者、世界构成一个独立、自足的系统。", style: TextStyle(color: Color(0xFF1A1A1A), fontSize: 16.sp), )), SizedBox( height: 16.h, ), Image.network( "https://t7.baidu.com/it/u=2487758541,1861252964&fm=193&f=GIF", fit: BoxFit.cover, width: double.infinity, height: 170.h, ), SizedBox( height: 16.h, ), RichText( text: TextSpan( text: "文本，是指书面语言的表现形式，从文学角度说，通常是具有完整、系统含义（Message）的一个句子或多个句子的组合。一个文本可以", style: TextStyle(color: Color(0xFF1A1A1A), fontSize: 16.sp), )), ], ), ), Container( // margin: EdgeInsets.only(bottom: 20), // padding: EdgeInsets.all(16), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 2), blurRadius: 14, spreadRadius: 0) ], ), child: Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ Padding( padding: EdgeInsets.all(16), child: Text("评论 (58) 喜欢 (58)", style: TextStyle( fontSize: 16.sp, fontWeight: FontWeight.bold, color: Color(0xff1A1A1A))), ), SizedBox( height: 600.h, child: ListView.builder( itemCount: 6, scrollDirection: Axis.vertical, physics: BouncingScrollPhysics(), itemBuilder: (context, position) { return _commentItem(position); }, ), ), ], ), ), SizedBox( height: 12.h, ), Container( padding: EdgeInsets.all(16), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 2), blurRadius: 14, spreadRadius: 0) ], borderRadius: new BorderRadius.only( topLeft: Radius.circular(8.0), topRight: Radius.circular(8.0), ), ), child: Row( children: [ Expanded( flex: 1, child: Container( decoration: new BoxDecoration( color: Color(0xffF2F2F2), borderRadius: BorderRadius.circular(2.0)), child: Column( children: [ Container( margin: const EdgeInsets.fromLTRB(4, 0, 4, 0), alignment: Alignment.topLeft, child: TextField( maxLines: 8, minLines: 1, decoration: InputDecoration( border: InputBorder.none, hintText: "留下您精彩的评论吧~", hintStyle: TextStyle( fontSize: 14.sp, color: Color(0xffCDCCCC), ), ), ), ), ], ), ), ), Padding( padding: EdgeInsets.only(left: 20.w, right: 20.w), child: Text( "发送", style: TextStyle( fontSize: 16.sp, fontWeight: FontWeight.bold, color: Color(0XFF1A1A1A)), ), ), Image.asset("assets/image/icon_like_h.png") ], ), ), ], ), ), ), ); } // var _status = 0; // var _bgStatus = false; // Widget rightAction() { // if (_status == 0) { // return Container( // margin: EdgeInsets.only(right: 17), // child: GestureDetector( // onTap: () { // setState(() { // _status = (_status + 1) % 2; // }); // }, // child: Image.asset( // "assets/image/icon_share.png", // width: 24, // height: 24, // ), // ), // ); // } else { // return GestureDetector( // onTap: () { // setState(() { // _status = (_status + 1) % 2; // }); // }, // child: Container( // margin: EdgeInsets.only(right: 17), // padding: EdgeInsets.only(top: 15, bottom: 15), // alignment: Alignment.center, // child: RoundButton( // text: S.of(context).wancheng, // textColor: _bgStatus ? Colors.white : Color(0xFFA0A0A0), // backgroup: _bgStatus ? Color(0xFF32A060) : Color(0xFFD8D8D8), // fontSize: 14, // fontWeight: FontWeight.bold, // padding: EdgeInsets.only(left: 12, right: 12, top: 2, bottom: 2), // radius: 12, // ), // ), // ); // } // } Widget _commentItem(var position) { return Container( child: Column( children: [ Padding( padding: EdgeInsets.all(16), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ ClipOval( child: Image.network( "https://t7.baidu.com/it/u=2841334870,333581502&fm=193&f=GIF", fit: BoxFit.cover, width: 40.w, height: 40.h, ), clipBehavior: Clip.hardEdge, ), SizedBox( width: 12.w, ), Expanded( child: Container( height: 60.h, child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: [ Text.rich( TextSpan(children: [ TextSpan( text: "张三", style: TextStyle( fontWeight: FontWeight.bold, fontSize: 14.sp, color: Colors.black), ), ]), textDirection: TextDirection.ltr, ), Text( "2021.04.12 12:12", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 12.sp, color: Color(0xff808080), ), ), ], ), ), flex: 1, ), Container( alignment: Alignment.topRight, child: Row( children: [ Image.asset( "assets/image/icon_like.png", width: 16.w, height: 16.h, ), Text( "58", style: TextStyle( fontSize: 12.sp, color: Color(0xff1A1A1A)), ), ], ), ), ], ), ), Padding( padding: EdgeInsets.only(left: 68, right: 16), child: Text( "文本，是指书面语言的表现形式，从文学角度说，通常是具有完整、系统含义（Mess…", style: TextStyle(fontSize: 14.sp, color: Color(0xff1A1A1A)), ), ), SizedBox( height: 12.h, ), Container( width: double.infinity, margin: EdgeInsets.only(left: 68.w, right: 16.w), decoration: new BoxDecoration( color: Color(0xffF2F2F2), borderRadius: BorderRadius.circular(2.0), ), child: Padding( padding: EdgeInsets.only(left: 4.w, top: 4.h, bottom: 4.h), child: Text( "文本，是指书面语言的表现形式文本，是指、", style: TextStyle(fontSize: 12.sp, color: Color(0xff808080)), ), ), ), if (position == 5) Container( height: 63.h, decoration: BoxDecoration( color: Color(0xffF2F2F2), boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 2), blurRadius: 14, spreadRadius: 0) ], ), margin: EdgeInsets.only(top: 30.h), alignment: Alignment.center, child: Text( "-已显示全部评论-", style: TextStyle(fontSize: 14.sp, color: Color(0xff353535)), ), ), ], ), ); } }