使用技术:flutter框架、Dart语言、flutter资源包、sqlite数据库、EventBus。
设计的主要功能如下:
(1)个人中心模块:个人信息显示、个人信息修改、全部订单显示、我的项目显示;
(2)社交功能模块:聊天功能、系统通知、回复通知、我的动态、点赞转发收藏通知;
(3)用户注册登录模块:用户登录、注册、退出;
(4)项目推荐模块:主要项目推荐、次要项目推荐、项目详细信息;
(5)我的项目模块:我的项目、发起项目、项目分类、项目详细信息、项目动态;
(6)系统设置模块:设置、问题中心、建议与反馈;
(7)我的动态模块:动态显示、发布动态、动态互动。
目前只实现了项目发布、动态发布、登录注册、个人信息修改这几个功能。
代码地址在文章最后。
登录注册界面(CSDN上找的教程)
用到了flutter资源库中的banner组件,可以直接百度搜索
也是自己找到的一个教程
个人中心页面参考Github地址
导航栏
//BottomNavigationWidget.dart
import 'package:flutter/material.dart';
import 'package:bonnie_invest/Pages/HomePage/HomePage.dart';
import 'package:bonnie_invest/Pages/MessagePage/ShowMsg.dart';
import 'package:bonnie_invest/Pages/PersonPage/PersonPage.dart';
import 'package:bonnie_invest/Pages/DynamicsPage/DynamicPage.dart';
import 'package:bonnie_invest/Pages/ItemPage/InitiateType.dart';
import 'package:bonnie_invest/Pages/TestPage.dart';
class BottomNavigationWidget extends StatefulWidget {
@override
State<StatefulWidget> createState() => BottomNavigationWidgetState();
}
class BottomNavigationWidgetState extends State<BottomNavigationWidget> {
final _bottomNavigationColor = Colors.blue;
int _currentIndex = 0;
List<Widget> list = List<Widget>();
void initState(){
list
..add(HomeScreen())
..add(DynamicScreen())
..add(ShowMsg())
..add(PersonScreen());
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: list[_currentIndex],
floatingActionButton: new FloatingActionButton(
foregroundColor: Colors.white,
//elevation: 10.0,
onPressed: (){
Navigator.of(context)
.push(new MaterialPageRoute(builder: (context){
return new InitiateType();
}));
},
child: new Icon(Icons.add),
mini: true,
heroTag: 1,
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(
icon: Icon(
Icons.home,
color: _bottomNavigationColor,
),
title: Text(
'首页',
style: TextStyle(color: _bottomNavigationColor),
)),
BottomNavigationBarItem(
icon: Icon(
Icons.pages,
color: _bottomNavigationColor,
),
title: Text(
'动态',
style: TextStyle(color: _bottomNavigationColor),
)),
// BottomNavigationBarItem(
// icon: Icon(
// Icons.add,
// )
//
// ),
//
BottomNavigationBarItem(
icon: Icon(
Icons.email,
color: _bottomNavigationColor,
),
title: Text(
'消息',
style: TextStyle(color: _bottomNavigationColor),
)),
BottomNavigationBarItem(
icon: Icon(
Icons.person,
color: _bottomNavigationColor,
),
title: Text(
'我的',
style: TextStyle(color: _bottomNavigationColor),
)),
],
currentIndex: _currentIndex,
onTap: (int index) {
setState(() {
_currentIndex = index;
});
},
type: BottomNavigationBarType.fixed,
),
);
}
}
导航栏直接用的flutter中已有的导航栏部件,可以去flutter中文网找
项目信息编辑中的时间选择器也是用到了flutter资源库中timepicker,可自行搜索
获取时间时获取到了时分秒,可以用字符串操作函数substring(a,b)来提取特定字符