Skip to content

Commit

Permalink
fix: UI adjust
Browse files Browse the repository at this point in the history
  • Loading branch information
MuZhou233 committed Jul 31, 2024
1 parent 7ee0659 commit d512981
Show file tree
Hide file tree
Showing 6 changed files with 126 additions and 123 deletions.
46 changes: 39 additions & 7 deletions lib/view/helper/app_bar.dart
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,46 @@ class AppBarHelper {
static RoundedRectangleBorder defaultShape = RoundedRectangleBorder(
borderRadius: SpacingHelper.defaultBorderRadius,
);
static Widget? defaultMainLeading(BuildContext context,
{void Function()? onPressed}) {
if (OverlappingPanels.of(context) != null || onPressed != null) {

static Widget? defaultMainLeading(
BuildContext context, {
void Function()? onPressed,
}) {
if (OverlappingPanels.of(context) == null) {
return null;
}
return _defaultLeading(
context,
onPressed ??
() {
OverlappingPanels.of(context)?.reveal(RevealSide.left);
},
);
}

static Widget? defaultRightLeading(
BuildContext context, {
void Function()? onPressed,
}) {
if (OverlappingPanels.of(context) == null) {
return null;
}
return _defaultLeading(
context,
onPressed ??
() {
OverlappingPanels.of(context)?.reveal(RevealSide.main);
},
);
}

static Widget? _defaultLeading(
BuildContext context,
void Function()? onPressed,
) {
if (onPressed != null) {
return IconButton(
onPressed: onPressed ??
() {
OverlappingPanels.of(context)?.reveal(RevealSide.left);
},
onPressed: onPressed,
icon: const Icon(Icons.arrow_back),
);
}
Expand Down
24 changes: 14 additions & 10 deletions lib/view/pages/frame_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,17 @@ import 'package:flutter/material.dart';

import '../../consts.dart';
import '../../route.dart';
import '../helper/spacing.dart';
import '../layout/bootstrap_breakpoints.dart';
import '../layout/overlapping_panels.dart';
import '../specialized/nav_rail.dart';
import 'server_select_overlay.dart';

const double restWidth = 36;
const double gapWidth = 8;
const double navWidth = 64;
const double defaultLeftPartWidth = 256;

class FramePage extends StatefulWidget {
const FramePage({
super.key,
Expand Down Expand Up @@ -51,8 +57,6 @@ class FramePageState extends State<FramePage> {

@override
Widget build(BuildContext context) {
const double restWidth = 40;

return LayoutBuilder(
builder: (context, constraints) {
final width = constraints.biggest.width;
Expand All @@ -62,13 +66,13 @@ class FramePageState extends State<FramePage> {
children: [
_Nav(selectedNav: widget.selectedNav),
Padding(
padding: const EdgeInsets.only(right: 8),
padding: const EdgeInsets.only(right: gapWidth),
child: Material(
child: Container(
padding: const EdgeInsets.all(8),
width: widget.leftPartWidth != null
? widget.leftPartWidth! - 64
: 256,
? widget.leftPartWidth! - navWidth
: defaultLeftPartWidth,
child: widget.leftPart,
),
),
Expand All @@ -95,7 +99,7 @@ class FramePageState extends State<FramePage> {
Material(
child: Container(
padding: const EdgeInsets.all(8),
width: width - 64 - 8 - restWidth,
width: width - navWidth - gapWidth - restWidth,
child: widget.leftPart,
),
),
Expand All @@ -105,15 +109,15 @@ class FramePageState extends State<FramePage> {
decoration: BoxDecoration(
color:
Theme.of(context).colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(12),
borderRadius: SpacingHelper.defaultBorderRadius,
),
child: widget.middlePart,
),
right: widget.rightPart != null
? Align(
alignment: Alignment.centerRight,
child: SizedBox(
width: width - 8 - restWidth,
width: width - gapWidth - restWidth,
child: widget.rightPart,
),
)
Expand All @@ -126,7 +130,7 @@ class FramePageState extends State<FramePage> {
children: [
_Nav(selectedNav: widget.selectedNav),
SizedBox(
width: width - 64,
width: width - navWidth,
child: widget.leftPart,
),
],
Expand All @@ -135,7 +139,7 @@ class FramePageState extends State<FramePage> {
? Align(
alignment: Alignment.centerRight,
child: SizedBox(
width: width - 8 - restWidth,
width: width - gapWidth - restWidth,
child: widget.rightPart,
),
)
Expand Down
156 changes: 63 additions & 93 deletions lib/view/pages/settings/session/session_manage_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import '../../../../l10n/l10n.dart';
import '../../../../model/common_model.dart';
import '../../../../route.dart';
import '../../../helper/duration_format.dart';
import '../../../helper/spacing.dart';
import '../../frame_page.dart';

class SessionManagePage extends StatelessWidget {
Expand Down Expand Up @@ -39,36 +38,32 @@ class SessionManagePage extends StatelessWidget {
margin: const EdgeInsets.only(bottom: 8),
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 36, 8, 36),
child: Row(
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
S.of(context).currentDevice,
style: TextStyle(
overflow: TextOverflow.ellipsis,
fontSize: 10,
color:
Theme.of(context).colorScheme.onPrimary),
maxLines: 2,
),
Text(
deviceInfo.deviceName.isNotEmpty ||
deviceInfo.systemVersion.isNotEmpty
? '${deviceInfo.deviceName} ${deviceInfo.systemVersion}'
: S.of(context).unknownDevice,
style: TextStyle(
overflow: TextOverflow.ellipsis,
color:
Theme.of(context).colorScheme.onPrimary),
maxLines: 2,
),
],
Text(
S.of(context).currentDevice,
style: TextStyle(
overflow: TextOverflow.ellipsis,
fontSize: 10,
color: Theme.of(context).colorScheme.onPrimary),
maxLines: 2,
),
]),
Text(
deviceInfo.deviceName.isNotEmpty ||
deviceInfo.systemVersion.isNotEmpty
? '${deviceInfo.deviceName} ${deviceInfo.systemVersion}'
: S.of(context).unknownDevice,
style: TextStyle(
overflow: TextOverflow.ellipsis,
color: Theme.of(context).colorScheme.onPrimary),
maxLines: 2,
),
],
),
),
),
),
ListView.builder(
Expand All @@ -92,77 +87,52 @@ class SessionManagePage extends StatelessWidget {
return const SizedBox();
}

return Card(
margin: const EdgeInsets.only(bottom: 8),
child: InkWell(
borderRadius: SpacingHelper.defaultBorderRadius,
onTap: openEditPage,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: Row(children: [
SizedBox(
width: 64,
height: 64,
child: _systemIcon(item.deviceInfo.systemType),
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.id.id.toHexString(),
style: TextStyle(
overflow: TextOverflow.ellipsis,
fontSize: 10,
color: Theme.of(context).disabledColor),
maxLines: 2,
),
Text(
item.deviceInfo.deviceName.isNotEmpty ||
item.deviceInfo.systemVersion.isNotEmpty
? '${item.deviceInfo.deviceName} ${item.deviceInfo.systemVersion}'
: S.of(context).unknownDevice,
),
Text(
item.deviceInfo.clientName.isNotEmpty ||
item.deviceInfo.clientVersion.isNotEmpty
? '${item.deviceInfo.clientName} ${item.deviceInfo.clientVersion}'
: S.of(context).unknownClient,
),
Text(
'${DurationHelper.recentString(
item.createTime.toDateTime(toLocal: true),
)}${item.expireTime.toDateTime(
toLocal: true,
).isBefore(
DateTime.now(),
) ? ' · ${S.of(context).loginExpired}' : ''}',
),
],
),
const Expanded(child: SizedBox()),
SizedBox(
width: 64,
height: 64,
child: IconButton(
onPressed: openEditPage,
icon: const Icon(Icons.edit),
),
),
]),
),
return ListTile(
title: Text(
item.id.id.toHexString(),
style: TextStyle(
overflow: TextOverflow.ellipsis,
fontSize: 10,
color: Theme.of(context).disabledColor),
maxLines: 2,
),
subtitle: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.deviceInfo.deviceName.isNotEmpty ||
item.deviceInfo.systemVersion.isNotEmpty
? '${item.deviceInfo.deviceName} ${item.deviceInfo.systemVersion}'
: S.of(context).unknownDevice,
),
Text(
item.deviceInfo.clientName.isNotEmpty ||
item.deviceInfo.clientVersion.isNotEmpty
? '${item.deviceInfo.clientName} ${item.deviceInfo.clientVersion}'
: S.of(context).unknownClient,
),
Text(
'${DurationHelper.recentString(
item.createTime.toDateTime(toLocal: true),
)}${item.expireTime.toDateTime(
toLocal: true,
).isBefore(
DateTime.now(),
) ? ' · ${S.of(context).loginExpired}' : ''}',
),
],
),
leading: _systemIcon(item.deviceInfo.systemType),
trailing: IconButton(
onPressed: openEditPage,
icon: const Icon(Icons.edit),
),
onTap: openEditPage,
);
},
),
]),
]),
floatingActionButton: FloatingActionButton(
onPressed: () {
context.read<TipherethBloc>().add(TipherethLoadSessionsEvent());
},
child: const Icon(Icons.refresh),
),
);
});
}
Expand Down
15 changes: 6 additions & 9 deletions lib/view/pages/yesod/yesod_preview_card.dart
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ class YesodPreviewCard extends StatelessWidget {
return LayoutBuilder(builder: (context, constraints) {
const maxTitleLines = 2;
const maxDescriptionLines = 3;
const cardPaddingV = 16.0;
const cardPaddingH = 16.0;
const cardPaddingV = 12.0;
const cardPaddingH = 12.0;
const imgPadding = 8;
const iconSize = 18.0;
final double leftImageSize =
Expand Down Expand Up @@ -88,12 +88,8 @@ class YesodPreviewCard extends StatelessWidget {
child: ClipRect(
child: Flex(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: listType == FeedItemListType.table
? CrossAxisAlignment.center
: CrossAxisAlignment.start,
direction: listType == FeedItemListType.table
? Axis.horizontal
: Axis.vertical,
crossAxisAlignment: CrossAxisAlignment.start,
direction: Axis.vertical,
children: [
SizedBox(
height: iconSize + 2,
Expand Down Expand Up @@ -132,7 +128,8 @@ class YesodPreviewCard extends StatelessWidget {
fontSize: 17, fontWeight: FontWeight.bold),
),
),
if (description != null)
if (listType != FeedItemListType.table &&
description != null)
Padding(
padding: const EdgeInsets.only(bottom: 4.0),
child: Text(
Expand Down
2 changes: 1 addition & 1 deletion lib/view/pages/yesod/yesod_recent_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ class YesodRecentPageState extends State<YesodRecentPage> {
closedBuilder: (context, openContainer) {
return YesodPreviewCard(
name:
'${item.feedConfigName} ${DurationHelper.recentString(item.publishedParsedTime.toDateTime())}',
'${item.feedConfigName} | ${DurationHelper.recentString(item.publishedParsedTime.toDateTime())}',
title: item.title,
callback: () {
openContainer();
Expand Down
6 changes: 3 additions & 3 deletions lib/view/specialized/right_panel_form.dart
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import 'package:smooth_scroll_multiplatform/smooth_scroll_multiplatform.dart';

import '../../l10n/l10n.dart';
import '../components/toast.dart';
import '../helper/app_bar.dart';
import '../helper/spacing.dart';

class RightPanelForm extends StatefulWidget {
Expand Down Expand Up @@ -51,10 +52,9 @@ class _RightPanelFormState extends State<RightPanelForm> {
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(8)),
),
title: widget.title,
shape: AppBarHelper.defaultShape,
leading: AppBarHelper.defaultRightLeading(context),
),
body: DynMouseScroll(builder: (context, controller, physics) {
return SingleChildScrollView(
Expand Down

0 comments on commit d512981

Please sign in to comment.