diff --git a/lib/component/app/app_type_component.dart b/lib/component/app/app_type_component.dart new file mode 100644 index 0000000..275ceb3 --- /dev/null +++ b/lib/component/app/app_type_component.dart @@ -0,0 +1,41 @@ +import 'package:flutter/material.dart'; + +import '../../const/base.dart'; + +class AppTypeComponent extends StatefulWidget { + int appType; + + AppTypeComponent(this.appType); + + @override + State createState() { + return _AppTypeComponent(); + } +} + +class _AppTypeComponent extends State { + @override + Widget build(BuildContext context) { + var themeData = Theme.of(context); + + return Container( + decoration: BoxDecoration( + color: themeData.hintColor.withOpacity(0.3), + borderRadius: BorderRadius.circular(8), + ), + padding: EdgeInsets.only( + left: Base.BASE_PADDING_HALF, + right: Base.BASE_PADDING_HALF, + top: 4, + bottom: 4, + ), + child: Text( + "WEB", + style: TextStyle( + fontSize: themeData.textTheme.bodySmall!.fontSize, + color: themeData.hintColor, + ), + ), + ); + } +} diff --git a/lib/component/auth_dialog/auth_app_info_component.dart b/lib/component/auth_dialog/auth_app_info_component.dart index fe58320..8a47af6 100644 --- a/lib/component/auth_dialog/auth_app_info_component.dart +++ b/lib/component/auth_dialog/auth_app_info_component.dart @@ -1,6 +1,9 @@ import 'package:flutter/material.dart'; +import 'package:nowser/const/app_type.dart'; import 'package:nowser/const/base.dart'; +import '../app/app_type_component.dart'; + class AuthAppInfoComponent extends StatefulWidget { @override State createState() { @@ -50,25 +53,7 @@ class _AuthAppInfoComponent extends State { ), Positioned( right: 16, - child: Container( - decoration: BoxDecoration( - color: themeData.hintColor.withOpacity(0.3), - borderRadius: BorderRadius.circular(8), - ), - padding: EdgeInsets.only( - left: Base.BASE_PADDING_HALF, - right: Base.BASE_PADDING_HALF, - top: 4, - bottom: 4, - ), - child: Text( - "WEB", - style: TextStyle( - fontSize: themeData.textTheme.bodySmall!.fontSize, - color: themeData.hintColor, - ), - ), - ), + child: AppTypeComponent(AppType.WEB), ) ], ); diff --git a/lib/component/user_pic_component.dart b/lib/component/user_pic_component.dart new file mode 100644 index 0000000..b4ef201 --- /dev/null +++ b/lib/component/user_pic_component.dart @@ -0,0 +1,33 @@ +import 'package:flutter/material.dart'; + +class UserPicComponent extends StatefulWidget { + double width; + + UserPicComponent({required this.width}); + + @override + State createState() { + return _UserPicComponent(); + } +} + +class _UserPicComponent extends State { + @override + Widget build(BuildContext context) { + Widget innerWidget = Icon( + Icons.account_circle, + size: widget.width, + ); + + return Container( + width: widget.width, + height: widget.width, + clipBehavior: Clip.hardEdge, + alignment: Alignment.center, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(widget.width / 2), + ), + child: innerWidget, + ); + } +} diff --git a/lib/component/webview/web_home_component.dart b/lib/component/webview/web_home_component.dart index 6c801b8..a5f7609 100644 --- a/lib/component/webview/web_home_component.dart +++ b/lib/component/webview/web_home_component.dart @@ -63,7 +63,8 @@ class _WebHomeComponent extends State { }), wrapBottomBtn(const Icon(Icons.space_dashboard)), wrapBottomBtn(const Icon(Icons.segment), onTap: () { - AuthDialog.show(context); + // AuthDialog.show(context); + RouterUtil.router(context, RouterPath.ME); }), ], ), diff --git a/lib/const/router_path.dart b/lib/const/router_path.dart index c09f187..2106127 100644 --- a/lib/const/router_path.dart +++ b/lib/const/router_path.dart @@ -1,4 +1,5 @@ class RouterPath { static const String INDEX = "/"; static const String WEB_TABS = "/webTabs"; + static const String ME = "/me"; } diff --git a/lib/main.dart b/lib/main.dart index 48e9528..072d563 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -11,6 +11,7 @@ import 'package:nowser/data/db.dart'; import 'package:nowser/provider/key_provider.dart'; import 'package:nowser/provider/web_provider.dart'; import 'package:nowser/router/index/index_router.dart'; +import 'package:nowser/router/me/me_router.dart'; import 'package:nowser/router/web_tabs_select/web_tabs_select_router.dart'; import 'package:provider/provider.dart'; import 'package:receive_intent/receive_intent.dart' as receiveIntent; @@ -75,6 +76,7 @@ class _MyApp extends State { routes = { RouterPath.INDEX: (context) => IndexRouter(), RouterPath.WEB_TABS: (context) => WebTabsSelectRouter(), + RouterPath.ME: (context) => MeRouter(), }; return MultiProvider( diff --git a/lib/router/me/me_router.dart b/lib/router/me/me_router.dart new file mode 100644 index 0000000..c554824 --- /dev/null +++ b/lib/router/me/me_router.dart @@ -0,0 +1,206 @@ +import 'package:flutter/material.dart'; +import 'package:nowser/component/user_pic_component.dart'; +import 'package:nowser/const/base.dart'; +import 'package:nowser/router/me/me_router_log_item_component.dart'; +import 'package:nowser/router/me/me_router_web_item_component.dart'; + +import 'me_router_app_item_component.dart'; + +class MeRouter extends StatefulWidget { + @override + State createState() { + return _MeRouter(); + } +} + +class _MeRouter extends State { + @override + Widget build(BuildContext context) { + var mediaQueryData = MediaQuery.of(context); + var themeData = Theme.of(context); + + var listWidgetMargin = EdgeInsets.only( + top: Base.BASE_PADDING, + bottom: Base.BASE_PADDING, + ); + + List defaultUserWidgets = []; + defaultUserWidgets.add(Container( + margin: EdgeInsets.only( + left: Base.BASE_PADDING, + ), + child: UserPicComponent(width: 50), + )); + defaultUserWidgets.add(Container( + margin: EdgeInsets.only(left: Base.BASE_PADDING), + child: Text("Click and Login"), + )); + defaultUserWidgets.add(Expanded(child: Container())); + defaultUserWidgets.add(Container( + margin: EdgeInsets.only(right: Base.BASE_PADDING), + child: Icon(Icons.settings), + )); + var defaultUserWidget = Container( + margin: const EdgeInsets.only( + top: Base.BASE_PADDING, + ), + child: Row( + children: defaultUserWidgets, + ), + ); + + List memberList = []; + for (var i = 0; i < 3; i++) { + memberList.add(Container( + margin: EdgeInsets.only(left: Base.BASE_PADDING_HALF), + child: UserPicComponent(width: 30), + )); + } + memberList.add(Expanded(child: Container())); + memberList.add(GestureDetector( + child: Icon(Icons.chevron_right), + )); + var memberListWidget = Container( + decoration: BoxDecoration( + color: themeData.cardColor, + borderRadius: BorderRadius.circular( + Base.BASE_PADDING, + ), + ), + margin: listWidgetMargin, + padding: EdgeInsets.all(Base.BASE_PADDING), + child: Row( + children: memberList, + ), + ); + + List webItemList = []; + webItemList.add(MeRouterWebItemComponent( + num: 102, + name: "Bookmarks", + // margin: EdgeInsets.only(right: Base.BASE_PADDING), + )); + webItemList.add(MeRouterWebItemComponent( + num: 999, + name: "Historys", + // margin: + // EdgeInsets.only(left: Base.BASE_PADDING, right: Base.BASE_PADDING), + )); + webItemList.add(MeRouterWebItemComponent( + num: 30, + name: "Downloads", + // margin: + // EdgeInsets.only(left: Base.BASE_PADDING, right: Base.BASE_PADDING), + )); + webItemList.add(MeRouterWebItemComponent( + num: 102, + name: "Bookmarks", + // margin: EdgeInsets.only(left: Base.BASE_PADDING), + )); + var webItemWidget = Container( + margin: listWidgetMargin, + child: Row( + children: webItemList, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + ), + ); + + List appList = []; + appList.add(Container( + child: MeRouterAppItemComponent(), + )); + appList.add(Divider()); + appList.add(Container( + child: MeRouterAppItemComponent(), + )); + appList.add(Divider()); + appList.add(Container( + child: MeRouterAppItemComponent(), + )); + appList.add(Divider()); + appList.add(Container( + alignment: Alignment.center, + child: Text( + "Show more", + style: TextStyle( + decoration: TextDecoration.underline, + ), + ), + )); + var appListWidget = Container( + margin: listWidgetMargin, + padding: EdgeInsets.all(Base.BASE_PADDING), + decoration: BoxDecoration( + color: themeData.cardColor, + borderRadius: BorderRadius.circular( + Base.BASE_PADDING, + ), + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: appList, + ), + ); + + List logList = []; + logList.add(Container( + child: MeRouterLogItemComponent(), + )); + logList.add(Divider()); + logList.add(Container( + child: MeRouterLogItemComponent(), + )); + logList.add(Divider()); + logList.add(Container( + child: MeRouterLogItemComponent(), + )); + logList.add(Divider()); + logList.add(Container( + alignment: Alignment.center, + child: Text( + "Show more", + style: TextStyle( + decoration: TextDecoration.underline, + ), + ), + )); + var logListWidget = Container( + margin: listWidgetMargin, + padding: EdgeInsets.all(Base.BASE_PADDING), + decoration: BoxDecoration( + color: themeData.cardColor, + borderRadius: BorderRadius.circular( + Base.BASE_PADDING, + ), + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: logList, + ), + ); + + var main = SingleChildScrollView( + child: Container( + padding: EdgeInsets.only( + left: Base.BASE_PADDING, + right: Base.BASE_PADDING, + top: mediaQueryData.padding.top + Base.BASE_PADDING, + bottom: mediaQueryData.padding.bottom + Base.BASE_PADDING, + ), + child: Column( + children: [ + defaultUserWidget, + memberListWidget, + webItemWidget, + appListWidget, + logListWidget, + ], + ), + ), + ); + + return Scaffold( + body: main, + ); + } +} diff --git a/lib/router/me/me_router_app_item_component.dart b/lib/router/me/me_router_app_item_component.dart new file mode 100644 index 0000000..2c89b95 --- /dev/null +++ b/lib/router/me/me_router_app_item_component.dart @@ -0,0 +1,50 @@ +import 'package:flutter/material.dart'; +import 'package:nowser/component/app/app_type_component.dart'; +import 'package:nowser/const/app_type.dart'; + +import '../../const/base.dart'; + +class MeRouterAppItemComponent extends StatefulWidget { + @override + State createState() { + return _MeRouterAppItemComponent(); + } +} + +class _MeRouterAppItemComponent extends State { + @override + Widget build(BuildContext context) { + var imageWidget = Container( + margin: EdgeInsets.only( + left: Base.BASE_PADDING_HALF, + right: Base.BASE_PADDING, + ), + child: Icon(Icons.image), + ); + + var titleWidget = Container( + margin: EdgeInsets.only(right: Base.BASE_PADDING), + child: Text("Title APP"), + ); + + var typeWidget = Container( + child: AppTypeComponent(AppType.WEB), + ); + + var rightIconWidget = Container( + child: Icon(Icons.chevron_right), + ); + + return Container( + child: Row( + children: [ + imageWidget, + titleWidget, + typeWidget, + Expanded(child: Container()), + rightIconWidget, + ], + ), + ); + } +} diff --git a/lib/router/me/me_router_log_item_component.dart b/lib/router/me/me_router_log_item_component.dart new file mode 100644 index 0000000..11571bc --- /dev/null +++ b/lib/router/me/me_router_log_item_component.dart @@ -0,0 +1,50 @@ +import 'package:flutter/material.dart'; +import 'package:nowser/const/base.dart'; + +class MeRouterLogItemComponent extends StatefulWidget { + @override + State createState() { + return _MeRouterLogItemComponent(); + } +} + +class _MeRouterLogItemComponent extends State { + @override + Widget build(BuildContext context) { + var appNameWidget = Container( + constraints: BoxConstraints(maxWidth: 80), + margin: EdgeInsets.only( + left: Base.BASE_PADDING_HALF, + right: Base.BASE_PADDING, + ), + child: Text( + "APP Name APP Name", + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + ); + + var logWidget = Expanded( + child: Container( + child: Text( + "Log Log Log Log Log Log Log Log Log Log Log Log Log Log Log Log", + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + )); + + var rightIconWidget = Container( + child: Icon(Icons.chevron_right), + ); + + return Container( + child: Row( + children: [ + appNameWidget, + logWidget, + rightIconWidget, + ], + ), + ); + } +} diff --git a/lib/router/me/me_router_web_item_component.dart b/lib/router/me/me_router_web_item_component.dart new file mode 100644 index 0000000..b307cf2 --- /dev/null +++ b/lib/router/me/me_router_web_item_component.dart @@ -0,0 +1,62 @@ +import 'package:flutter/material.dart'; +import 'package:nowser/const/base.dart'; + +class MeRouterWebItemComponent extends StatefulWidget { + int num; + + String name; + + // EdgeInsetsGeometry margin; + + MeRouterWebItemComponent({ + required this.num, + required this.name, + // required this.margin, + }); + + @override + State createState() { + return _MeRouterWebItemComponent(); + } +} + +class _MeRouterWebItemComponent extends State { + @override + Widget build(BuildContext context) { + var themeData = Theme.of(context); + var cardColor = themeData.cardColor; + + return Container( + alignment: Alignment.center, + // margin: widget.margin, + child: Container( + width: 80, + padding: const EdgeInsets.only( + left: Base.BASE_PADDING, + right: Base.BASE_PADDING, + top: Base.BASE_PADDING, + bottom: Base.BASE_PADDING, + ), + decoration: BoxDecoration( + color: cardColor, + borderRadius: BorderRadius.circular(Base.BASE_PADDING), + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + Text( + "${widget.num}", + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + Text( + widget.name, + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + ], + ), + ), + ); + } +}