Compare commits

...

2 Commits

Author SHA1 Message Date
e742338d92 🐛 Bug fixes of scaffold 2024-05-03 14:04:34 +08:00
d179d907ad 💄 Better large screen optimization! 2024-05-03 13:52:41 +08:00
9 changed files with 137 additions and 183 deletions

View File

@ -47,7 +47,11 @@ class SolianApp extends StatelessWidget {
child: Overlay( child: Overlay(
initialEntries: [ initialEntries: [
OverlayEntry(builder: (context) { OverlayEntry(builder: (context) {
return NotificationNotifier(child: child ?? Container()); return ScaffoldMessenger(
child: Scaffold(
body: NotificationNotifier(child: child ?? Container()),
),
);
}), }),
OverlayEntry(builder: (context) => const CallOverlay()), OverlayEntry(builder: (context) => const CallOverlay()),
], ],

View File

@ -26,16 +26,52 @@ import 'package:solian/widgets/layouts/two_column.dart';
abstract class SolianRouter { abstract class SolianRouter {
static final router = GoRouter( static final router = GoRouter(
routes: [ routes: [
GoRoute(
path: '/',
name: 'explore',
builder: (context, state) => const ExploreScreen(),
),
GoRoute( GoRoute(
path: '/notification', path: '/notification',
name: 'notification', name: 'notification',
builder: (context, state) => const NotificationScreen(), builder: (context, state) => const NotificationScreen(),
), ),
ShellRoute(
pageBuilder: (context, state, child) => defaultPageBuilder(
context,
state,
SolianTheme.isLargeScreen(context)
? TwoColumnLayout(
sideChild: const ExplorePostScreen(),
mainChild: child,
)
: child,
),
routes: [
GoRoute(
path: '/',
name: 'explore',
builder: (context, state) =>
!SolianTheme.isLargeScreen(context) ? const ExplorePostScreen() : const PageEmptyWidget(),
),
GoRoute(
path: '/posts/publish/moments',
name: 'posts.moments.editor',
builder: (context, state) => MomentEditorScreen(editing: state.extra as Post?),
),
GoRoute(
path: '/posts/publish/comments',
name: 'posts.comments.editor',
builder: (context, state) {
final args = state.extra as CommentPostArguments;
return CommentEditorScreen(editing: args.editing, related: args.related);
},
),
GoRoute(
path: '/posts/:dataset/:alias',
name: 'posts.screen',
builder: (context, state) => PostScreen(
alias: state.pathParameters['alias'] as String,
dataset: state.pathParameters['dataset'] as String,
),
),
],
),
ShellRoute( ShellRoute(
pageBuilder: (context, state, child) => defaultPageBuilder( pageBuilder: (context, state, child) => defaultPageBuilder(
context, context,
@ -81,31 +117,23 @@ abstract class SolianRouter {
), ),
], ],
), ),
ShellRoute(
pageBuilder: (context, state, child) => defaultPageBuilder(
context,
state,
SolianTheme.isLargeScreen(context)
? TwoColumnLayout(
sideChild: const AccountScreen(),
mainChild: child,
)
: child,
),
routes: [
GoRoute( GoRoute(
path: '/account', path: '/account',
name: 'account', name: 'account',
builder: (context, state) => const AccountScreen(), builder: (context, state) =>
), !SolianTheme.isLargeScreen(context) ? const AccountScreen() : const PageEmptyWidget(),
GoRoute(
path: '/posts/publish/moments',
name: 'posts.moments.editor',
builder: (context, state) => MomentEditorScreen(editing: state.extra as Post?),
),
GoRoute(
path: '/posts/publish/comments',
name: 'posts.comments.editor',
builder: (context, state) {
final args = state.extra as CommentPostArguments;
return CommentEditorScreen(editing: args.editing, related: args.related);
},
),
GoRoute(
path: '/posts/:dataset/:alias',
name: 'posts.screen',
builder: (context, state) => PostScreen(
alias: state.pathParameters['alias'] as String,
dataset: state.pathParameters['dataset'] as String,
),
), ),
GoRoute( GoRoute(
path: '/auth/sign-in', path: '/auth/sign-in',
@ -127,9 +155,12 @@ abstract class SolianRouter {
name: 'account.personalize', name: 'account.personalize',
builder: (context, state) => const PersonalizeScreen(), builder: (context, state) => const PersonalizeScreen(),
), ),
]),
], ],
); );
static GoRoute get currentRoute => SolianRouter.router.routerDelegate.currentConfiguration.last.route;
static Page defaultPageBuilder( static Page defaultPageBuilder(
BuildContext context, BuildContext context,
GoRouterState state, GoRouterState state,

View File

@ -2,64 +2,21 @@ import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:solian/providers/auth.dart'; import 'package:solian/providers/auth.dart';
import 'package:solian/router.dart'; import 'package:solian/router.dart';
import 'package:solian/screens/account/friend.dart';
import 'package:solian/screens/account/personalize.dart';
import 'package:solian/widgets/account/account_avatar.dart'; import 'package:solian/widgets/account/account_avatar.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:solian/widgets/empty.dart';
import 'package:solian/widgets/scaffold.dart'; import 'package:solian/widgets/scaffold.dart';
class AccountScreen extends StatefulWidget { class AccountScreen extends StatelessWidget {
const AccountScreen({super.key}); const AccountScreen({super.key});
@override
State<AccountScreen> createState() => _AccountScreenState();
}
class _AccountScreenState extends State<AccountScreen> {
String? _title;
String? _selectedTab;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final screenWidth = MediaQuery.of(context).size.width;
final isLargeScreen = screenWidth >= 600;
Widget renderContent() {
switch (_selectedTab) {
case 'account.friend':
return const FriendScreenWidget();
case 'account.personalize':
return const PersonalizeScreenWidget();
default:
return const PageEmptyWidget();
}
}
return IndentScaffold( return IndentScaffold(
title: _title ?? AppLocalizations.of(context)!.account, title: AppLocalizations.of(context)!.account,
noSafeArea: true, noSafeArea: true,
fixedAppBarColor: true, fixedAppBarColor: true,
child: isLargeScreen
? Row(
children: [
Flexible(
flex: 2,
child: AccountScreenWidget( child: AccountScreenWidget(
onSelect: (item, title) { onSelect: (item) {
setState(() {
_selectedTab = item;
_title = title;
});
},
),
),
const VerticalDivider(thickness: 0.3, width: 0.3),
Flexible(flex: 4, child: renderContent()),
],
)
: AccountScreenWidget(
onSelect: (item, _) {
SolianRouter.router.pushNamed(item); SolianRouter.router.pushNamed(item);
}, },
), ),
@ -68,7 +25,7 @@ class _AccountScreenState extends State<AccountScreen> {
} }
class AccountScreenWidget extends StatefulWidget { class AccountScreenWidget extends StatefulWidget {
final Function(String item, String title) onSelect; final Function(String item) onSelect;
const AccountScreenWidget({super.key, required this.onSelect}); const AccountScreenWidget({super.key, required this.onSelect});
@ -105,7 +62,7 @@ class _AccountScreenWidgetState extends State<AccountScreenWidget> {
leading: const Icon(Icons.color_lens), leading: const Icon(Icons.color_lens),
title: Text(AppLocalizations.of(context)!.personalize), title: Text(AppLocalizations.of(context)!.personalize),
onTap: () { onTap: () {
widget.onSelect('account.personalize', AppLocalizations.of(context)!.personalize); widget.onSelect('account.personalize');
}, },
), ),
ListTile( ListTile(
@ -113,7 +70,7 @@ class _AccountScreenWidgetState extends State<AccountScreenWidget> {
leading: const Icon(Icons.diversity_1), leading: const Icon(Icons.diversity_1),
title: Text(AppLocalizations.of(context)!.friend), title: Text(AppLocalizations.of(context)!.friend),
onTap: () { onTap: () {
widget.onSelect('account.friend', AppLocalizations.of(context)!.friend); widget.onSelect('account.friend');
}, },
), ),
ListTile( ListTile(

View File

@ -32,7 +32,6 @@ class ChatScreen extends StatelessWidget {
title: chat.focusChannel?.name ?? 'Loading...', title: chat.focusChannel?.name ?? 'Loading...',
hideDrawer: true, hideDrawer: true,
fixedAppBarColor: SolianTheme.isLargeScreen(context), fixedAppBarColor: SolianTheme.isLargeScreen(context),
appBarLeading: IconButton(icon: const Icon(Icons.tag), onPressed: () {}),
appBarActions: chat.focusChannel != null appBarActions: chat.focusChannel != null
? [ ? [
ChannelCallAction( ChannelCallAction(

View File

@ -25,10 +25,17 @@ class ChatListScreen extends StatelessWidget {
fixedAppBarColor: SolianTheme.isLargeScreen(context), fixedAppBarColor: SolianTheme.isLargeScreen(context),
child: ChatListWidget( child: ChatListWidget(
onSelect: (item) { onSelect: (item) {
if (SolianRouter.currentRoute.name == 'chat.channel') {
SolianRouter.router.pushReplacementNamed( SolianRouter.router.pushReplacementNamed(
'chat.channel', 'chat.channel',
pathParameters: {'channel': item.alias}, pathParameters: {'channel': item.alias},
); );
} else {
SolianRouter.router.pushNamed(
'chat.channel',
pathParameters: {'channel': item.alias},
);
}
}, },
), ),
); );

View File

@ -6,61 +6,26 @@ import 'package:solian/models/pagination.dart';
import 'package:solian/models/post.dart'; import 'package:solian/models/post.dart';
import 'package:solian/providers/auth.dart'; import 'package:solian/providers/auth.dart';
import 'package:solian/router.dart'; import 'package:solian/router.dart';
import 'package:solian/screens/posts/screen.dart';
import 'package:solian/utils/service_url.dart'; import 'package:solian/utils/service_url.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart'; import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:http/http.dart' as http; import 'package:http/http.dart' as http;
import 'package:solian/widgets/empty.dart'; import 'package:solian/utils/theme.dart';
import 'package:solian/widgets/scaffold.dart'; import 'package:solian/widgets/scaffold.dart';
import 'package:solian/widgets/notification_notifier.dart'; import 'package:solian/widgets/notification_notifier.dart';
import 'package:solian/widgets/posts/post.dart'; import 'package:solian/widgets/posts/post.dart';
class ExploreScreen extends StatefulWidget { class ExplorePostScreen extends StatelessWidget {
const ExploreScreen({super.key}); const ExplorePostScreen({super.key});
@override
State<ExploreScreen> createState() => _ExploreScreenState();
}
class _ExploreScreenState extends State<ExploreScreen> {
Post? _selectedPost;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final screenWidth = MediaQuery.of(context).size.width;
final isLargeScreen = screenWidth >= 600;
return IndentScaffold( return IndentScaffold(
noSafeArea: true, noSafeArea: true,
fixedAppBarColor: isLargeScreen, fixedAppBarColor: SolianTheme.isLargeScreen(context),
appBarActions: const [NotificationButton()], appBarActions: const [NotificationButton()],
title: AppLocalizations.of(context)!.explore, title: AppLocalizations.of(context)!.explore,
child: isLargeScreen child: ExplorePostWidget(
? Row(
children: [
Flexible(
flex: 2,
child: ExploreScreenWidget(
onSelect: (item) {
setState(() => _selectedPost = item);
},
),
),
const VerticalDivider(thickness: 0.3, width: 0.3),
Flexible(
flex: 4,
child: _selectedPost == null
? const PageEmptyWidget()
: PostScreenWidget(
key: Key('p${_selectedPost!.id}'),
dataset: _selectedPost!.dataset,
alias: _selectedPost!.alias,
),
),
],
)
: ExploreScreenWidget(
onSelect: (item) { onSelect: (item) {
SolianRouter.router.pushNamed( SolianRouter.router.pushNamed(
'posts.screen', 'posts.screen',
@ -75,16 +40,16 @@ class _ExploreScreenState extends State<ExploreScreen> {
} }
} }
class ExploreScreenWidget extends StatefulWidget { class ExplorePostWidget extends StatefulWidget {
final Function(Post item) onSelect; final Function(Post item) onSelect;
const ExploreScreenWidget({super.key, required this.onSelect}); const ExplorePostWidget({super.key, required this.onSelect});
@override @override
State<ExploreScreenWidget> createState() => _ExploreScreenWidgetState(); State<ExplorePostWidget> createState() => _ExplorePostWidgetState();
} }
class _ExploreScreenWidgetState extends State<ExploreScreenWidget> { class _ExplorePostWidgetState extends State<ExplorePostWidget> {
final PagingController<int, Post> _pagingController = PagingController(firstPageKey: 0); final PagingController<int, Post> _pagingController = PagingController(firstPageKey: 0);
final http.Client _client = http.Client(); final http.Client _client = http.Client();

View File

@ -9,9 +9,6 @@ abstract class SolianTheme {
brightness: brightness, brightness: brightness,
useMaterial3: true, useMaterial3: true,
colorScheme: ColorScheme.fromSeed(brightness: brightness, seedColor: Colors.indigo), colorScheme: ColorScheme.fromSeed(brightness: brightness, seedColor: Colors.indigo),
snackBarTheme: const SnackBarThemeData(
behavior: SnackBarBehavior.floating,
),
); );
} }
} }

View File

@ -13,9 +13,7 @@ class TwoColumnLayout extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ScaffoldMessenger( return Row(
child: Scaffold(
body: Row(
children: [ children: [
SizedBox( SizedBox(
width: 400, width: 400,
@ -24,8 +22,6 @@ class TwoColumnLayout extends StatelessWidget {
const VerticalDivider(width: 0.3, thickness: 0.3), const VerticalDivider(width: 0.3, thickness: 0.3),
Expanded(child: mainChild ?? const PageEmptyWidget()), Expanded(child: mainChild ?? const PageEmptyWidget()),
], ],
),
),
); );
} }
} }

View File

@ -1,6 +1,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart'; import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:solian/models/post.dart'; import 'package:solian/models/post.dart';
import 'package:solian/utils/theme.dart';
import 'package:solian/widgets/account/account_avatar.dart'; import 'package:solian/widgets/account/account_avatar.dart';
import 'package:solian/widgets/posts/comment_list.dart'; import 'package:solian/widgets/posts/comment_list.dart';
import 'package:solian/widgets/posts/content/article.dart'; import 'package:solian/widgets/posts/content/article.dart';
@ -87,16 +88,13 @@ class _PostItemState extends State<PostItem> {
Widget renderAttachments() { Widget renderAttachments() {
if (widget.item.modelType == 'article') return Container(); if (widget.item.modelType == 'article') return Container();
final screenWidth = MediaQuery.of(context).size.width;
final isLargeScreen = screenWidth >= 600;
if (widget.item.attachments != null && widget.item.attachments!.isNotEmpty) { if (widget.item.attachments != null && widget.item.attachments!.isNotEmpty) {
return Padding( return Padding(
padding: const EdgeInsets.only(top: 8), padding: const EdgeInsets.only(top: 8),
child: AttachmentList( child: AttachmentList(
items: widget.item.attachments!, items: widget.item.attachments!,
provider: 'interactive', provider: 'interactive',
noTag: isLargeScreen && widget.brief, noTag: SolianTheme.isLargeScreen(context) && widget.brief,
), ),
); );
} else { } else {