添加布局,自定义分割线

hmxc
张萌 4 years ago
parent 6c013fe22f
commit bd07b758d8

@ -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),
])),
);
}
}

@ -1,4 +1,5 @@
import 'package:aku_community_manager/style/app_style.dart'; 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/aku_ui.dart';
import 'package:aku_ui/common_widgets/aku_material_button.dart'; import 'package:aku_ui/common_widgets/aku_material_button.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@ -12,28 +13,64 @@ class HomePage extends StatefulWidget {
_HomePageState createState() => _HomePageState(); _HomePageState createState() => _HomePageState();
} }
Widget _menuButton(IconData iconData, String text,Widget page) { //bar
Widget _menuButton(IconData iconData, String text, Widget page) {
return AkuButton( return AkuButton(
height: 75.w+8.w+33.w, height: 75.w + 8.w + 33.w,
onPressed:(){ onPressed: () {
Get.to(page); Get.to(page);
},child: Column( },
children: [ child: Column(
Icon( children: [
iconData, Icon(
size: 75.w, iconData,
), size: 75.w,
SizedBox(height: 8.w),
Text(
text,
style: TextStyle(
color: Color(0xFF4A4B51),
fontSize: 24.sp,
fontWeight: FontWeight.bold,
), ),
) 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<HomePage> { class _HomePageState extends State<HomePage> {
@ -41,8 +78,10 @@ class _HomePageState extends State<HomePage> {
Widget build(BuildContext context) { Widget build(BuildContext context) {
ScreenUtil.init(context, ScreenUtil.init(context,
designSize: Size(750, 1334), allowFontScaling: true); designSize: Size(750, 1334), allowFontScaling: true);
return Scaffold( return Scaffold(
drawer: Drawer(),
backgroundColor: Color(0xFFF9F9F9),
//bar
appBar: PreferredSize( appBar: PreferredSize(
preferredSize: Size(375.w, 430.w - 40.w + ScreenUtil().statusBarHeight), preferredSize: Size(375.w, 430.w - 40.w + ScreenUtil().statusBarHeight),
child: Container( child: Container(
@ -70,52 +109,52 @@ class _HomePageState extends State<HomePage> {
width: 16.w, width: 16.w,
), ),
Container( Container(
margin: EdgeInsets.only(top: 8.w, bottom: 8.w), margin: EdgeInsets.only(top: 8.w, bottom: 8.w),
width: 72.w, width: 72.w,
height: 72.w, height: 72.w,
child: AkuRoundButton(
// //
height: 36.w, child: Builder(builder: (BuildContext context) {
onPressed: () {}, return AkuRoundButton(
child: CircleAvatar(radius: 36.w), height: 36.w,
), onPressed: () {
), Scaffold.of(context).openDrawer();
},
child: CircleAvatar(radius: 36.w),
);
})),
SizedBox(width: 16.w), SizedBox(width: 16.w),
Expanded( Expanded(
child: Container( child: Container(
margin: EdgeInsets.only(top: 8.w, bottom: 8.w), margin: EdgeInsets.only(top: 8.w, bottom: 8.w),
alignment: Alignment.center, alignment: Alignment.center,
height: 72.w, height: 72.w,
color: Color(0xFFFFFFFF), padding: EdgeInsets.only(left: 21.w),
padding: EdgeInsets.only(left: 21.w, right: 87.w), child: AkuButton(
child: Row(children: [ //
Container( color: Color(0xFFFFFFFF),
child: Column( onPressed: () {},
children: [ child: Row(children: [
SizedBox(height: 18.w), Container(
Icon( child: Column(
Icons.zoom_in_sharp, children: [
size: 38.w, SizedBox(height: 18.w),
), Icon(
], Icons.zoom_in_sharp,
size: 38.w,
),
],
),
), ),
), SizedBox(width: 19.w),
SizedBox(width: 19.w), Text(
Expanded( '搜索工单订单号、手机',
child: AkuButton( style: TextStyle(
// color: AppStyle.minorTextColor,
padding: EdgeInsets.zero, fontSize: 28.sp,
onPressed: () {},
child: Text(
'搜索工单订单号、手机',
style: TextStyle(
color: AppStyle.minorTextColor,
fontSize: 28.sp,
),
), ),
), ),
), ]),
]), ),
), ),
), ),
SizedBox(width: 15.w), SizedBox(width: 15.w),
@ -188,17 +227,17 @@ class _HomePageState extends State<HomePage> {
SizedBox(height: 16.w), SizedBox(height: 16.w),
Container( Container(
margin: EdgeInsets.only(left: 32.w, right: 32.w), margin: EdgeInsets.only(left: 32.w, right: 32.w),
padding: EdgeInsets.only(top:24.w), padding: EdgeInsets.only(top: 24.w),
color: Color(0xFFFFFFFF), color: Color(0xFFFFFFFF),
width: double.infinity, width: double.infinity,
height: 163.w, height: 163.w,
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround, mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [ children: [
_menuButton(Icons.wysiwyg, '一键报警',HomePage()), _menuButton(Icons.wysiwyg, '一键报警', HomePage()),
_menuButton(Icons.work, '访客管理',HomePage()), _menuButton(Icons.work, '访客管理', HomePage()),
_menuButton(Icons.accessibility, '报事报修',HomePage()), _menuButton(Icons.accessibility, '报事报修', HomePage()),
_menuButton(Icons.account_balance, '全部应用',HomePage()), _menuButton(Icons.account_balance, '全部应用', HomePage()),
], ],
), ),
), ),
@ -206,6 +245,132 @@ class _HomePageState extends State<HomePage> {
), ),
), ),
), ),
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)),
],
),
],
),
),
],
),
); );
} }
} }

Loading…
Cancel
Save