Skip to content

Commit

Permalink
fix: improve UI experience
Browse files Browse the repository at this point in the history
  • Loading branch information
MuZhou233 committed Oct 13, 2023
1 parent 4f31704 commit 1cd5bb2
Show file tree
Hide file tree
Showing 16 changed files with 506 additions and 451 deletions.
28 changes: 28 additions & 0 deletions lib/view/helper/duration_format.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
class DurationHelper {
static String recentString(DateTime dateTime) {
final duration = DateTime.now().difference(dateTime);
return format(duration);
}

static String format(Duration duration) {
final minutes = duration.inMinutes;
final hours = duration.inHours;
final days = duration.inDays;
final months = duration.inDays ~/ 30;
const maxMinutes = 60;
const maxHours = 24;
const maxDays = 30;

if (minutes <= 1) {
return '刚刚';
} else if (minutes < maxMinutes) {
return '$minutes 分钟前';
} else if (hours < maxHours) {
return '$hours 小时前';
} else if (days < maxDays) {
return '$days 天前';
} else {
return '$months 个月前';
}
}
}
2 changes: 1 addition & 1 deletion lib/view/layout/overlapping_panels.dart
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ class OverlappingPanels extends StatefulWidget {
{this.left,
required this.main,
this.right,
this.restWidth = 64,
this.restWidth = 40,
this.onSideChange,
super.key});

Expand Down
10 changes: 7 additions & 3 deletions lib/view/pages/frame_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ class FramePage extends StatelessWidget {

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

return LayoutBuilder(
builder: (context, constraints) {
final width = constraints.biggest.width;
Expand All @@ -50,18 +52,21 @@ class FramePage extends StatelessWidget {
if (width <= BootstrapBreakpoints.sm) {
content = rightPart != null
? OverlappingPanels(
restWidth: restWidth,
left: Row(
children: [
_Nav(selectedNav: selectedNav),
SizedBox(
width: width - 128,
width: width - 64 - restWidth,
child: leftPart,
),
],
),
main: DecoratedBox(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceVariant),
color: Theme.of(context).colorScheme.surfaceVariant,
borderRadius: BorderRadius.circular(12),
),
child: rightPart,
),
)
Expand All @@ -80,7 +85,6 @@ class FramePage extends StatelessWidget {

return Scaffold(
body: SafeArea(
bottom: false,
maintainBottomViewPadding: true,
child: Column(
children: [
Expand Down
2 changes: 1 addition & 1 deletion lib/view/pages/gebura/gebura_library_detail.dart
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,7 @@ class AppDetails extends StatelessWidget {
end: FractionalOffset.bottomCenter,
colors: [
const Color.fromRGBO(0, 0, 0, 0),
Theme.of(context).colorScheme.surface,
Theme.of(context).colorScheme.surfaceVariant,
],
),
),
Expand Down
27 changes: 16 additions & 11 deletions lib/view/pages/gebura/gebura_nav.dart
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,16 @@ class GeburaNav extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
SizedBox(
height: 64,
child: RailTile(
body: Container(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceTint.withAlpha(24),
borderRadius: BorderRadius.circular(12),
),
margin: const EdgeInsets.symmetric(horizontal: 8),
padding: const EdgeInsets.all(8),
child: Column(
children: [
RailTile(
leading: const Icon(
Icons.shopping_cart,
),
Expand All @@ -31,12 +36,12 @@ class GeburaNav extends StatelessWidget {
title: const Text('Store'),
selected: function == 'store',
),
),
SpacingHelper.defaultDivider,
Expanded(
child: GeburaLibraryListPage(selectedAppID: selectedAppID),
)
],
SpacingHelper.defaultDivider,
Expanded(
child: GeburaLibraryListPage(selectedAppID: selectedAppID),
)
],
),
),
);
}
Expand Down
116 changes: 61 additions & 55 deletions lib/view/pages/gebura/gebura_store.dart
Original file line number Diff line number Diff line change
Expand Up @@ -61,61 +61,67 @@ class _GeburaStorePageState extends State<GeburaStorePage>

@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.transparent,
body: _buildStatePage(),
appBar: AppBar(
title: BootstrapContainer(
children: [
BootstrapColumn(
xxs: 12,
md: 6,
child: LayoutBuilder(builder: (context, constrains) {
final width = constrains.maxWidth; // 父级宽度
const height = 45.0;
return Container(
width: width,
height: height,
decoration: BoxDecoration(
border: Border.all(color: Theme.of(context).primaryColor),
borderRadius: BorderRadius.circular(height)),
child: TextField(
controller: controller,
decoration: InputDecoration(
hintText: '搜索',
hintStyle: const TextStyle(
color: Colors.grey, fontSize: height / 3),
contentPadding: const EdgeInsets.only(top: height / 5),
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
fillColor: Colors.transparent,
hoverColor: Colors.transparent,
icon: Padding(
padding: const EdgeInsets.only(left: 10, top: 4),
child: Icon(
Icons.search,
return Padding(
padding: const EdgeInsets.all(8),
child: Scaffold(
backgroundColor: Colors.transparent,
body: _buildStatePage(),
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.surfaceVariant,
title: BootstrapContainer(
children: [
BootstrapColumn(
xxs: 12,
md: 6,
child: LayoutBuilder(builder: (context, constrains) {
final width = constrains.maxWidth; // 父级宽度
const height = 45.0;
return Container(
width: width,
height: height,
decoration: BoxDecoration(
border:
Border.all(color: Theme.of(context).primaryColor),
borderRadius: BorderRadius.circular(height)),
child: TextField(
controller: controller,
decoration: InputDecoration(
hintText: '搜索',
hintStyle: const TextStyle(
color: Colors.grey, fontSize: height / 3),
contentPadding:
const EdgeInsets.only(top: height / 5),
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
fillColor: Colors.transparent,
hoverColor: Colors.transparent,
icon: Padding(
padding: const EdgeInsets.only(left: 10, top: 4),
child: Icon(
Icons.search,
size: 18,
color: Theme.of(context).primaryColor,
)),
suffixIcon: IconButton(
icon: const Icon(
Icons.close,
size: 18,
color: Theme.of(context).primaryColor,
)),
suffixIcon: IconButton(
icon: const Icon(
Icons.close,
size: 18,
),
onPressed: () {
controller.text = '';
loadStore();
},
splashColor: Theme.of(context).primaryColor,
color: Theme.of(context).primaryColor,
)),
onEditingComplete: loadStore,
),
);
}),
)
],
),
onPressed: () {
controller.text = '';
loadStore();
},
splashColor: Theme.of(context).primaryColor,
color: Theme.of(context).primaryColor,
)),
onEditingComplete: loadStore,
),
);
}),
)
],
),
),
),
);
Expand Down Expand Up @@ -146,7 +152,7 @@ class StoreList extends StatelessWidget {
(context, index) {
final app = data.apps.elementAt(index);
return Padding(
padding: const EdgeInsets.all(4),
padding: const EdgeInsets.only(bottom: 8),
child: OpenContainer(
openBuilder: (context, closedContainer) {
return Container(
Expand Down
Loading

0 comments on commit 1cd5bb2

Please sign in to comment.