Browse Source

change homelist UI

pull/18/head
Sun 4 years ago
parent
commit
99cc2b7421
  1. 16
      lib/apps/chat/list.dart
  2. 14
      lib/apps/service/list.dart
  3. 29
      lib/apps/service/models.dart
  4. 238
      lib/pages/home.dart
  5. 28
      lib/provider.dart
  6. 151
      lib/widgets/default_home_show.dart

16
lib/apps/chat/list.dart

@ -23,13 +23,27 @@ class _ChatListState extends State<ChatList> { @@ -23,13 +23,27 @@ class _ChatListState extends State<ChatList> {
Widget build(BuildContext context) {
final provider = context.watch<ChatProvider>();
final isDesktop = isDisplayDesktop(context);
final lang = AppLocalizations.of(context);
final color = Theme.of(context).colorScheme;
final friends = provider.friends;
final chatKeys = provider.orderKeys;
return Scaffold(
body: ListView.builder(
appBar: AppBar(
title: Text(lang.contact),
bottom: PreferredSize(
child: Container(color: const Color(0x40ADB0BB), height: 1.0),
preferredSize: Size.fromHeight(1.0)
),
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 10.0),
child: ListView.builder(
itemCount: chatKeys.length,
itemBuilder: (BuildContext ctx, int index) => ListChat(friend: friends[chatKeys[index]]),
)
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {

14
lib/apps/service/list.dart

@ -39,7 +39,7 @@ class _ServiceListState extends State<ServiceList> { @@ -39,7 +39,7 @@ class _ServiceListState extends State<ServiceList> {
name: params[0],
bio: params[1],
logo: params[2],
callback: () => v.callback(context, isDesktop, lang),
callback: () => v.callback(),
isDesktop: isDesktop,
);
}).toList()
@ -70,16 +70,12 @@ class ListInnerService extends StatelessWidget { @@ -70,16 +70,12 @@ class ListInnerService extends StatelessWidget {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
final widgets = this.callback();
if (widgets != null) {
final widget = this.callback();
if (widget != null) {
if (this.isDesktop) {
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(widgets[0], widgets[1], widgets[2]);
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(widget);
} else {
if (widgets[2] != null) {
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(null, widgets[1], widgets[2]);
} else {
Navigator.push(context, MaterialPageRoute(builder: (_) => widgets[0]));
}
Navigator.push(context, MaterialPageRoute(builder: (_) => widget));
}
}
},

29
lib/apps/service/models.dart

@ -1,14 +1,10 @@ @@ -1,14 +1,10 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:esse/l10n/localizations.dart';
import 'package:esse/provider.dart';
import 'package:esse/apps/assistant/page.dart';
import 'package:esse/apps/file/page.dart';
import 'package:esse/apps/group_chat/page.dart';
enum InnerService {
Files,
Assistant,
@ -27,31 +23,14 @@ extension InnerServiceExtension on InnerService { @@ -27,31 +23,14 @@ extension InnerServiceExtension on InnerService {
}
}
void callback(context, isDesktop, lang) {
Widget coreWidget = null;
String listTitle = null;
Widget listHome = null;
Widget callback() {
switch (this) {
case InnerService.Files:
listTitle = lang.files;
listHome = FolderList();
break;
return FolderList();
case InnerService.Assistant:
coreWidget = AssistantDetail();
break;
return AssistantDetail();
case InnerService.GroupChat:
listTitle = lang.groupChat;
listHome = GroupChatList();
break;
}
if (this == InnerService.Assistant) {
Navigator.push(context, MaterialPageRoute(builder: (_) => coreWidget));
} else {
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(
coreWidget, listTitle, listHome
);
return GroupChatList();
}
}
}

238
lib/pages/home.dart

@ -22,16 +22,20 @@ import 'package:esse/account.dart'; @@ -22,16 +22,20 @@ import 'package:esse/account.dart';
import 'package:esse/global.dart';
import 'package:esse/options.dart';
import 'package:esse/provider.dart';
import 'package:esse/session.dart';
import 'package:esse/apps/device/provider.dart';
import 'package:esse/apps/device/page.dart';
import 'package:esse/apps/chat/provider.dart';
import 'package:esse/apps/chat/list.dart';
import 'package:esse/apps/chat/detail.dart';
import 'package:esse/apps/chat/add.dart';
import 'package:esse/apps/file/page.dart';
import 'package:esse/apps/service/list.dart';
import 'package:esse/apps/service/add.dart';
import 'package:esse/apps/assistant/page.dart';
import 'package:esse/apps/group_chat/detail.dart';
import 'package:esse/apps/group_chat/provider.dart';
class HomePage extends StatelessWidget {
static GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
@ -47,19 +51,18 @@ class HomePage extends StatelessWidget { @@ -47,19 +51,18 @@ class HomePage extends StatelessWidget {
if (isDesktop) {
return WillPopScope(
onWillPop: () =>
SystemChannels.platform.invokeMethod('SystemNavigator.pop'),
onWillPop: () => SystemChannels.platform.invokeMethod('SystemNavigator.pop'),
child: Scaffold(
key: _scaffoldKey,
drawer: const DrawerWidget(),
drawerScrimColor: Color(0x26ADB0BB),
drawerScrimColor: const Color(0x26ADB0BB),
body: SafeArea(
child: Row(children: [
Container(
width: 375.0,
child: HomeList(_scaffoldKey),
child: Row(
children: [
Container(width: 375.0,
child: HomeList(scaffoldKey: _scaffoldKey),
),
SizedBox(width: 20.0),
const SizedBox(width: 20.0),
Expanded(child: context.watch<AccountProvider>().coreShowWidget),
])),
));
@ -72,16 +75,15 @@ class HomePage extends StatelessWidget { @@ -72,16 +75,15 @@ class HomePage extends StatelessWidget {
}
return WillPopScope(
onWillPop: () =>
SystemChannels.platform.invokeMethod('SystemNavigator.pop'),
onWillPop: () => SystemChannels.platform.invokeMethod('SystemNavigator.pop'),
child: Scaffold(
key: _scaffoldKey,
drawer: const DrawerWidget(),
drawerScrimColor: Color(0x26ADB0BB),
drawerScrimColor: const Color(0x26ADB0BB),
body: AnnotatedRegion<SystemUiOverlayStyle>(
value: style.copyWith(statusBarColor: colorScheme.background),
child: SafeArea(
child: HomeList(_scaffoldKey),
child: HomeList(scaffoldKey: _scaffoldKey),
)),
));
}
@ -89,8 +91,8 @@ class HomePage extends StatelessWidget { @@ -89,8 +91,8 @@ class HomePage extends StatelessWidget {
}
class HomeList extends StatefulWidget {
final GlobalKey<ScaffoldState> _scaffoldKey;
HomeList(this._scaffoldKey);
final GlobalKey<ScaffoldState> scaffoldKey;
const HomeList({Key key, this.scaffoldKey}) : super(key: key);
@override
_HomeListState createState() => _HomeListState();
@ -133,52 +135,42 @@ class _HomeListState extends State<HomeList> { @@ -133,52 +135,42 @@ class _HomeListState extends State<HomeList> {
final color = Theme.of(context).colorScheme;
final lang = AppLocalizations.of(context);
final provider = context.watch<AccountProvider>();
final allKeys = provider.topKeys + provider.orderKeys;
final sessions = provider.sessions;
return Padding(
padding: const EdgeInsets.symmetric(vertical: 10.0),
child: Column(
children: [
Container(
height: 30.0,
padding: const EdgeInsets.symmetric(horizontal: 20.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
GestureDetector(
onTap: widget._scaffoldKey.currentState.openDrawer,
child: Icon(
Icons.menu_rounded,
color: color.primary,
size: 28.0,
return Scaffold(
appBar: AppBar(
leading: IconButton(
icon: const Icon(Icons.menu),
onPressed: () => widget.scaffoldKey.currentState.openDrawer(),
),
bottom: PreferredSize(
child: Container(color: const Color(0x40ADB0BB), height: 1.0),
preferredSize: Size.fromHeight(1.0)
),
actions: [
IconButton(
icon: const Icon(Icons.search),
onPressed: null,
),
Expanded(
child: Center(
child: Text(provider.homeShowTitle, style: TextStyle(fontWeight: FontWeight.bold)),
)),
Icon(Icons.search_rounded, color: color.primary),
const SizedBox(width: 20.0),
Stack(
children: <Widget>[
Container(
width: 28.0,
height: 28.0,
child: provider.homeShowTitle == ''
? PopupMenuButton<int>(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15)),
margin: const EdgeInsets.symmetric(horizontal: 20.0),
alignment: Alignment.center,
child: Stack(
children: <Widget>[
PopupMenuButton<int>(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
color: const Color(0xFFEDEDED),
child: Icon(Icons.add_circle_outline_rounded,
color: color.primary),
child: Icon(Icons.add_circle_outline, color: color.primary),
onSelected: (int value) {
if (value == 0) {
_scanQr(isDesktop);
} else if (value == 1) {
final widget = ChatAddPage();
provider.systemAppFriendAddNew = false;
if (isDesktop) {
provider.updateActivedWidget(widget);
} else {
provider.systemAppFriendAddNew = false;
setState(() {});
Navigator.push(context, MaterialPageRoute(builder: (_) => widget));
}
@ -203,9 +195,7 @@ class _HomeListState extends State<HomeList> { @@ -203,9 +195,7 @@ class _HomeListState extends State<HomeList> {
_menuItem(2, Icons.qr_code_rounded, lang.myQrcode),
];
},
)
: GestureDetector(onTap: () => provider.updateToHome(),
child: Icon(Icons.home_outlined, color: color.primary))),
),
if (provider.systemAppFriendAddNew)
Positioned(
top: 0,
@ -219,16 +209,19 @@ class _HomeListState extends State<HomeList> { @@ -219,16 +209,19 @@ class _HomeListState extends State<HomeList> {
))),
],
),
],
)
]
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 10.0),
child: ListView.builder(
itemCount: allKeys.length,
itemBuilder: (BuildContext ctx, int index) => _SessionWidget(
session: sessions[allKeys[index]]
),
),
),
const SizedBox(height: 10.0),
const Divider(height: 1.0, color: Color(0x40ADB0BB)),
const SizedBox(height: 5.0),
Expanded(
child: provider.homeShowWidget,
)
],
),
);
}
@ -359,9 +352,15 @@ class DrawerWidget extends StatelessWidget { @@ -359,9 +352,15 @@ class DrawerWidget extends StatelessWidget {
style: TextStyle(fontSize: 16.0)),
onTap: () {
Navigator.pop(context);
final coreWidget = ChatList();
if (isDesktop) {
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(
null, lang.contact, ChatList()
coreWidget
);
} else {
Navigator.push(context, MaterialPageRoute(builder: (_) => coreWidget));
}
}),
ListTile(
leading: Icon(Icons.grid_view_rounded, color: color.primary),
@ -369,9 +368,14 @@ class DrawerWidget extends StatelessWidget { @@ -369,9 +368,14 @@ class DrawerWidget extends StatelessWidget {
style: TextStyle(fontSize: 16.0)),
onTap: () {
Navigator.pop(context);
final coreWidget = ServiceList();
if (isDesktop) {
Provider.of<AccountProvider>(context, listen: false).updateActivedWidget(
null, lang.groups, ServiceList()
coreWidget
);
} else {
Navigator.push(context, MaterialPageRoute(builder: (_) => coreWidget));
}
}),
const Divider(height: 1.0, color: Color(0x40ADB0BB)),
ListTile(
@ -459,6 +463,120 @@ class DrawerWidget extends StatelessWidget { @@ -459,6 +463,120 @@ class DrawerWidget extends StatelessWidget {
}
}
class _SessionWidget extends StatelessWidget {
final Session session;
const _SessionWidget({Key key, this.session}) : super(key: key);
@override
Widget build(BuildContext context) {
final color = Theme.of(context).colorScheme;
final lang = AppLocalizations.of(context);
final isDesktop = isDisplayDesktop(context);
final params = session.parse(lang);
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
Widget coreWidget = null;
switch (session.type) {
case SessionType.Chat:
context.read<ChatProvider>().updateActivedFriend(session.fid);
coreWidget = ChatDetail();
break;
case SessionType.Group:
context.read<GroupChatProvider>().updateActivedGroup(session.fid);
coreWidget = GroupChatDetail();
break;
case SessionType.Assistant:
coreWidget = AssistantDetail();
break;
case SessionType.Files:
coreWidget = FolderList();
break;
}
context.read<AccountProvider>().updateActivedSession(session.id);
if (coreWidget != null) {
if (!isDesktop) {
Navigator.push(context, MaterialPageRoute(builder: (_) => coreWidget));
} else {
context.read<AccountProvider>().updateActivedWidget(coreWidget);
}
}
},
child: Container(
height: 55.0,
child: Row(
children: [
Container(
width: 45.0,
height: 45.0,
margin: const EdgeInsets.only(left: 20.0, right: 15.0),
child: params[0],
),
Expanded(
child: Container(
height: 55.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text(params[1],
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(fontSize: 16.0))
),
Container(
margin: const EdgeInsets.only(left: 15.0, right: 20.0),
child: Text(params[3], style: const TextStyle(color: Color(0xFFADB0BB), fontSize: 12.0)),
)
]),
const SizedBox(height: 4.0),
Row(
children: [
Expanded(
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
if (params[4] != null)
Container(
margin: const EdgeInsets.only(right: 6.0),
child: Icon(params[4], size: 16.0, color: Color(0xFFADB0BB)),
),
Expanded(
child: Text(params[2],
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(color: Color(0xFFADB0BB), fontSize: 12.0)),
)
]
),
),
Container(width: 8.0, height: 8.0,
margin: const EdgeInsets.only(left: 15.0, right: 20.0),
decoration: BoxDecoration(
color: session.lastReaded ? color.background : Colors.red,
shape: BoxShape.circle
),
),
]),
],
),
),
),
],
),
),
);
}
}
Widget _menuItem(int value, IconData icon, String text,
[bool hasNew = false]) {
return PopupMenuItem<int>(

28
lib/provider.dart

@ -7,7 +7,6 @@ import 'package:flutter/material.dart'; @@ -7,7 +7,6 @@ import 'package:flutter/material.dart';
import 'package:esse/account.dart';
import 'package:esse/utils/logined_cache.dart';
import 'package:esse/widgets/default_core_show.dart';
import 'package:esse/widgets/default_home_show.dart';
import 'package:esse/global.dart';
import 'package:esse/rpc.dart';
import 'package:esse/session.dart';
@ -35,12 +34,6 @@ class AccountProvider extends ChangeNotifier { @@ -35,12 +34,6 @@ class AccountProvider extends ChangeNotifier {
int actived = 0;
Session get activedSession => this.sessions[actived];
/// left home list sessions widget.
String homeShowTitle = '';
Widget defaultListShow = DefaultHomeShow();
Widget currentListShow = null;
Widget get homeShowWidget => this.currentListShow ?? this.defaultListShow;
/// right main screen show session details.
Widget coreShowWidget = DefaultCoreShow();
@ -120,7 +113,6 @@ class AccountProvider extends ChangeNotifier { @@ -120,7 +113,6 @@ class AccountProvider extends ChangeNotifier {
this.activedAccountId = gid;
this.activedAccount.hasNew = false;
this.coreShowWidget = DefaultCoreShow();
this.currentListShow = null;
// load sessions.
this.sessions.clear();
@ -141,7 +133,6 @@ class AccountProvider extends ChangeNotifier { @@ -141,7 +133,6 @@ class AccountProvider extends ChangeNotifier {
logout() {
this.accounts.clear();
this.clearActivedAccount();
this.currentListShow = null;
this.sessions.clear();
this.orderKeys.clear();
this.topKeys.clear();
@ -201,12 +192,6 @@ class AccountProvider extends ChangeNotifier { @@ -201,12 +192,6 @@ class AccountProvider extends ChangeNotifier {
rpc.send('account-system-info', []);
}
updateToHome() {
this.homeShowTitle = '';
this.currentListShow = null;
notifyListeners();
}
clearActivedSession(SessionType type) {
if (this.activedSession.type == type && this.actived > 0) {
rpc.send('session-suspend', [this.actived, this.activedSession.gid,
@ -254,20 +239,13 @@ class AccountProvider extends ChangeNotifier { @@ -254,20 +239,13 @@ class AccountProvider extends ChangeNotifier {
}
}
updateActivedWidget([Widget coreWidget, String title, Widget homeWidget]) {
print("update actived widget");
if (homeWidget != null && title != null) {
this.homeShowTitle = title;
this.currentListShow = homeWidget;
}
updateActivedWidget(Widget coreWidget) {
if (coreWidget != null) {
print("update actived widget");
this.coreShowWidget = coreWidget;
}
this.systemAppFriendAddNew = false;
notifyListeners();
}
}
// -- callback when receive rpc info. -- //
_systemInfo(List params) {

151
lib/widgets/default_home_show.dart

@ -1,151 +0,0 @@ @@ -1,151 +0,0 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:esse/l10n/localizations.dart';
import 'package:esse/utils/adaptive.dart';
import 'package:esse/widgets/list_system_app.dart';
import 'package:esse/options.dart';
import 'package:esse/provider.dart';
import 'package:esse/session.dart';
import 'package:esse/apps/chat/detail.dart';
import 'package:esse/apps/chat/provider.dart';
import 'package:esse/apps/group_chat/detail.dart';
import 'package:esse/apps/group_chat/provider.dart';
import 'package:esse/apps/assistant/page.dart';
import 'package:esse/apps/file/page.dart';
class DefaultHomeShow extends StatelessWidget {
const DefaultHomeShow({Key key}): super(key: key);
@override
Widget build(BuildContext context) {
final isDesktop = isDisplayDesktop(context);
final lang = AppLocalizations.of(context);
final provider = context.watch<AccountProvider>();
final allKeys = provider.topKeys + provider.orderKeys;
final sessions = provider.sessions;
return ListView.builder(
itemCount: allKeys.length,
itemBuilder: (BuildContext ctx, int index) => _SessionWidget(
session: sessions[allKeys[index]]
),
);
}
}
class _SessionWidget extends StatelessWidget {
final Session session;
const _SessionWidget({Key key, this.session}) : super(key: key);
@override
Widget build(BuildContext context) {
final color = Theme.of(context).colorScheme;
final lang = AppLocalizations.of(context);
final isDesktop = isDisplayDesktop(context);
final params = session.parse(lang);
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
String listTitle = "";
Widget listWidget = null;
Widget coreWidget = null;
switch (session.type) {
case SessionType.Chat:
context.read<ChatProvider>().updateActivedFriend(session.fid);
coreWidget = ChatDetail();
break;
case SessionType.Group:
context.read<GroupChatProvider>().updateActivedGroup(session.fid);
coreWidget = GroupChatDetail();
break;
case SessionType.Assistant:
coreWidget = AssistantDetail();
break;
case SessionType.Files:
listTitle = lang.files;
listWidget = FolderList();
break;
}
context.read<AccountProvider>().updateActivedSession(session.id);
if (!isDesktop && coreWidget != null) {
Navigator.push(context, MaterialPageRoute(builder: (_) => coreWidget));
} else {
context.read<AccountProvider>().updateActivedWidget(coreWidget, listTitle, listWidget);
}
},
child: Container(
height: 55.0,
child: Row(
children: [
Container(
width: 45.0,
height: 45.0,
margin: const EdgeInsets.only(left: 20.0, right: 15.0),
child: params[0],
),
Expanded(
child: Container(
height: 55.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text(params[1],
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(fontSize: 16.0))
),
Container(
margin: const EdgeInsets.only(left: 15.0, right: 20.0),
child: Text(params[3], style: const TextStyle(color: Color(0xFFADB0BB), fontSize: 12.0)),
)
]),
const SizedBox(height: 4.0),
Row(
children: [
Expanded(
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
if (params[4] != null)
Container(
margin: const EdgeInsets.only(right: 6.0),
child: Icon(params[4], size: 16.0, color: Color(0xFFADB0BB)),
),
Expanded(
child: Text(params[2],
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(color: Color(0xFFADB0BB), fontSize: 12.0)),
)
]
),
),
Container(width: 8.0, height: 8.0,
margin: const EdgeInsets.only(left: 15.0, right: 20.0),
decoration: BoxDecoration(
color: session.lastReaded ? color.background : Colors.red,
shape: BoxShape.circle
),
),
]),
],
),
),
),
],
),
),
);
}
}
Loading…
Cancel
Save