diff --git a/lib/tools/widget_tool.dart b/lib/tools/widget_tool.dart new file mode 100644 index 0000000..8b28ab4 --- /dev/null +++ b/lib/tools/widget_tool.dart @@ -0,0 +1,45 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class AkuDiveder { + final bool isReverse; + const AkuDiveder({Key key,this.isReverse=false}); + Widget verticalDivider(double height) { + return Container( + width: 1.w, + height: height, + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: isReverse + ? [ + Color(0xFFE8E8E8), + Color(0xFFFFFFFF), + ] + : [ + Color(0xFFFFFFFF), + Color(0xFFE8E8E8), + ])), + ); + } + Widget horizontalDivider(double width) { + return Container( + width: width, + height: 1.w, + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: isReverse + ? [ + Color(0xFFE8E8E8), + Color(0xFFFFFFFF), + ] + : [ + Color(0xFFFFFFFF), + Color(0xFFE8E8E8), + ])), + ); + } +} diff --git a/lib/ui/home/home_page.dart b/lib/ui/home/home_page.dart index 02115c8..4f22b7d 100644 --- a/lib/ui/home/home_page.dart +++ b/lib/ui/home/home_page.dart @@ -1,4 +1,5 @@ import 'package:aku_community_manager/style/app_style.dart'; +import 'package:aku_community_manager/tools/widget_tool.dart'; import 'package:aku_ui/aku_ui.dart'; import 'package:aku_ui/common_widgets/aku_material_button.dart'; import 'package:flutter/material.dart'; @@ -12,28 +13,64 @@ class HomePage extends StatefulWidget { _HomePageState createState() => _HomePageState(); } -Widget _menuButton(IconData iconData, String text,Widget page) { +//自定义bar的菜单按钮 +Widget _menuButton(IconData iconData, String text, Widget page) { return AkuButton( - height: 75.w+8.w+33.w, - onPressed:(){ + height: 75.w + 8.w + 33.w, + onPressed: () { Get.to(page); - },child: Column( - children: [ - Icon( - iconData, - size: 75.w, - ), - SizedBox(height: 8.w), - Text( - text, - style: TextStyle( - color: Color(0xFF4A4B51), - fontSize: 24.sp, - fontWeight: FontWeight.bold, + }, + child: Column( + children: [ + Icon( + iconData, + size: 75.w, ), - ) - ], - ),); + SizedBox(height: 8.w), + Text( + text, + style: TextStyle( + color: Color(0xFF4A4B51), + fontSize: 24.sp, + fontWeight: FontWeight.bold, + ), + ) + ], + ), + ); +} + +//底部信息栏卡片 +Widget _card(String number, String text, Color color) { + return AkuButton( + onPressed: () {}, + color: Color(0xFFFFFFFF), + child: Container( + width: 342.5.w, + height: 166.w, + alignment: Alignment.center, + child: Column( + children: [ + SizedBox( + height: 32.w, + ), + Text( + number, + style: TextStyle( + color: color, fontSize: 40.sp, fontStyle: FontStyle.italic), + ), + SizedBox( + height: 16.w, + ), + Text(text, + style: TextStyle( + color: AppStyle.minorTextColor, + fontSize: 24.sp, + fontWeight: FontWeight.bold)), + Spacer(), + ], + )), + ); } class _HomePageState extends State { @@ -41,8 +78,10 @@ class _HomePageState extends State { Widget build(BuildContext context) { ScreenUtil.init(context, designSize: Size(750, 1334), allowFontScaling: true); - return Scaffold( + drawer: Drawer(), + backgroundColor: Color(0xFFF9F9F9), + //自定义bar appBar: PreferredSize( preferredSize: Size(375.w, 430.w - 40.w + ScreenUtil().statusBarHeight), child: Container( @@ -70,52 +109,52 @@ class _HomePageState extends State { width: 16.w, ), Container( - margin: EdgeInsets.only(top: 8.w, bottom: 8.w), - width: 72.w, - height: 72.w, - child: AkuRoundButton( + margin: EdgeInsets.only(top: 8.w, bottom: 8.w), + width: 72.w, + height: 72.w, //头像按钮 - height: 36.w, - onPressed: () {}, - child: CircleAvatar(radius: 36.w), - ), - ), + child: Builder(builder: (BuildContext context) { + return AkuRoundButton( + height: 36.w, + onPressed: () { + Scaffold.of(context).openDrawer(); + }, + child: CircleAvatar(radius: 36.w), + ); + })), SizedBox(width: 16.w), Expanded( child: Container( margin: EdgeInsets.only(top: 8.w, bottom: 8.w), alignment: Alignment.center, height: 72.w, - color: Color(0xFFFFFFFF), - padding: EdgeInsets.only(left: 21.w, right: 87.w), - child: Row(children: [ - Container( - child: Column( - children: [ - SizedBox(height: 18.w), - Icon( - Icons.zoom_in_sharp, - size: 38.w, - ), - ], + padding: EdgeInsets.only(left: 21.w), + child: AkuButton( + //搜索框按钮 + color: Color(0xFFFFFFFF), + onPressed: () {}, + child: Row(children: [ + Container( + child: Column( + children: [ + SizedBox(height: 18.w), + Icon( + Icons.zoom_in_sharp, + size: 38.w, + ), + ], + ), ), - ), - SizedBox(width: 19.w), - Expanded( - child: AkuButton( - //搜索框按钮 - padding: EdgeInsets.zero, - onPressed: () {}, - child: Text( - '搜索工单订单号、手机', - style: TextStyle( - color: AppStyle.minorTextColor, - fontSize: 28.sp, - ), + SizedBox(width: 19.w), + Text( + '搜索工单订单号、手机', + style: TextStyle( + color: AppStyle.minorTextColor, + fontSize: 28.sp, ), ), - ), - ]), + ]), + ), ), ), SizedBox(width: 15.w), @@ -188,17 +227,17 @@ class _HomePageState extends State { SizedBox(height: 16.w), Container( margin: EdgeInsets.only(left: 32.w, right: 32.w), - padding: EdgeInsets.only(top:24.w), + padding: EdgeInsets.only(top: 24.w), color: Color(0xFFFFFFFF), width: double.infinity, height: 163.w, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ - _menuButton(Icons.wysiwyg, '一键报警',HomePage()), - _menuButton(Icons.work, '访客管理',HomePage()), - _menuButton(Icons.accessibility, '报事报修',HomePage()), - _menuButton(Icons.account_balance, '全部应用',HomePage()), + _menuButton(Icons.wysiwyg, '一键报警', HomePage()), + _menuButton(Icons.work, '访客管理', HomePage()), + _menuButton(Icons.accessibility, '报事报修', HomePage()), + _menuButton(Icons.account_balance, '全部应用', HomePage()), ], ), ), @@ -206,6 +245,132 @@ class _HomePageState extends State { ), ), ), + body: ListView( + padding: EdgeInsets.all(32.w), + children: [ + Container( + //公告标题行 + width: double.infinity, + height: 45.w, + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + '今日公告', + style: TextStyle( + color: Color(0xFF4A4B51), + fontSize: 32.sp, + fontWeight: FontWeight.bold, + ), + ), + Spacer(), + AkuButton( + //全部公告按钮 + onPressed: () {}, + child: Row( + children: [ + Text( + '全部公告', + style: TextStyle( + color: AppStyle.minorTextColor, + fontSize: 24.sp, + fontWeight: FontWeight.bold, + ), + ), + Icon( + Icons.arrow_forward_ios, + size: 22.w, + color: AppStyle.minorTextColor, + ) + ], + ), + ), + ], + ), + ), + SizedBox(height: 16.w), + //公告栏 + Container( + color: Color(0xFFFFFFFF), + //公告栏 + width: double.infinity, + height: 172.w, + //TODO listview + ), + SizedBox(height: 32.w), + //待办事项标题行 + Container( + width: double.infinity, + height: 45.w, + child: Row( + children: [ + Text( + '待办事项', + style: TextStyle( + color: Color(0xFF4A4B51), + fontSize: 32.sp, + fontWeight: FontWeight.bold, + ), + ), + Spacer(), + AkuButton( + onPressed: () {}, + child: Row( + children: [ + Text( + '全部事项', + style: TextStyle( + color: AppStyle.minorTextColor, + fontSize: 24.sp, + fontWeight: FontWeight.bold), + ), + Icon( + Icons.arrow_forward_ios, + size: 22.w, + color: AppStyle.minorTextColor, + ), + ], + ), + ), + ], + ), + ), + SizedBox(height: 16.w), + //待办事项栏 + Container( + width: double.infinity, + height: 449.w, + //TODO listview + ), + SizedBox(height: 24.w), + //底部信息栏 + Container( + width: double.infinity, + // height: 333.w, + child: Column( + children: [ + Row( + children: [ + _card('25', '未处理事项', Color(0xFFFF4E0D)), + AkuDiveder().verticalDivider(166.5.w), + _card('22', '处理中事项', Color(0xFFFFC40C)), + ], + ), + AkuDiveder().horizontalDivider(343.w), + Row( + children: [ + _card('25', '已处理事项', Color(0xFF3F8FFE)), + AkuDiveder(isReverse: true).verticalDivider( + 166.5.w, + ), + _card('72', '全部事项', Color(0xFF333333)), + ], + ), + ], + ), + ), + ], + ), ); } }