me page ui

This commit is contained in:
DASHU
2024-08-30 00:19:45 +08:00
parent 46c1521d32
commit db050386b5
10 changed files with 451 additions and 20 deletions

View File

@@ -0,0 +1,41 @@
import 'package:flutter/material.dart';
import '../../const/base.dart';
class AppTypeComponent extends StatefulWidget {
int appType;
AppTypeComponent(this.appType);
@override
State<StatefulWidget> createState() {
return _AppTypeComponent();
}
}
class _AppTypeComponent extends State<AppTypeComponent> {
@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,
),
),
);
}
}

View File

@@ -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<StatefulWidget> createState() {
@@ -50,25 +53,7 @@ class _AuthAppInfoComponent extends State<AuthAppInfoComponent> {
),
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),
)
],
);

View File

@@ -0,0 +1,33 @@
import 'package:flutter/material.dart';
class UserPicComponent extends StatefulWidget {
double width;
UserPicComponent({required this.width});
@override
State<StatefulWidget> createState() {
return _UserPicComponent();
}
}
class _UserPicComponent extends State<UserPicComponent> {
@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,
);
}
}

View File

@@ -63,7 +63,8 @@ class _WebHomeComponent extends State<WebHomeComponent> {
}),
wrapBottomBtn(const Icon(Icons.space_dashboard)),
wrapBottomBtn(const Icon(Icons.segment), onTap: () {
AuthDialog.show(context);
// AuthDialog.show(context);
RouterUtil.router(context, RouterPath.ME);
}),
],
),

View File

@@ -1,4 +1,5 @@
class RouterPath {
static const String INDEX = "/";
static const String WEB_TABS = "/webTabs";
static const String ME = "/me";
}

View File

@@ -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<MyApp> {
routes = {
RouterPath.INDEX: (context) => IndexRouter(),
RouterPath.WEB_TABS: (context) => WebTabsSelectRouter(),
RouterPath.ME: (context) => MeRouter(),
};
return MultiProvider(

View File

@@ -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<StatefulWidget> createState() {
return _MeRouter();
}
}
class _MeRouter extends State<MeRouter> {
@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<Widget> 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<Widget> 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<Widget> 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<Widget> 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<Widget> 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,
);
}
}

View File

@@ -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<StatefulWidget> createState() {
return _MeRouterAppItemComponent();
}
}
class _MeRouterAppItemComponent extends State<MeRouterAppItemComponent> {
@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,
],
),
);
}
}

View File

@@ -0,0 +1,50 @@
import 'package:flutter/material.dart';
import 'package:nowser/const/base.dart';
class MeRouterLogItemComponent extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _MeRouterLogItemComponent();
}
}
class _MeRouterLogItemComponent extends State<MeRouterLogItemComponent> {
@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,
],
),
);
}
}

View File

@@ -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<StatefulWidget> createState() {
return _MeRouterWebItemComponent();
}
}
class _MeRouterWebItemComponent extends State<MeRouterWebItemComponent> {
@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,
),
],
),
),
);
}
}