ayushya/noo
1
0
Fork 0
Code Pull Requests Actions Packages Projects Releases 14 Activity

Remove scrollbar thumb and restructure Settings profile card

Browse Source 
- Revert the scrollbar-thumb feature entirely (per-view Scrollbar
  wrappers and the ScrollbarThemeData override) - back to plain
  scrollables with no visible thumb
- Settings: move the logout button into the profile card (next to the
  name/email), and move the ONLINE/OFFLINE badge + "Connected to..."
  text out of the top row into a combined line at the bottom of the
  card, instead of split between the AppBar and the top of the screen
- Update architecture.md/styling.md to drop the stale scrollbar-theme
  documentation

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
ayushya
2026-09-16 12:28:11 -04:00
co-authored by Claude Sonnet 5
parent 1fbdc1f8d0
commit 73e05f8d22
11 changed files with 698 additions and 760 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.claude/context/architecture.md
+2 -2
View File
@@ -101,8 +101,8 @@ owns the app's share-intent listener (`receive_sharing_intent`): both
Five of the six tabs (all but Files) plus each tab's own controls share Five of the six tabs (all but Files) plus each tab's own controls share
[`SyncedHeaderScaffold`](../../lib/widgets/synced_header_scaffold.dart) — a [`SyncedHeaderScaffold`](../../lib/widgets/synced_header_scaffold.dart) — a
`CustomScrollView` with a pull-down "sync status" header (Google `CustomScrollView` with a pull-down "sync status" header (Google
Photos-style), a `Scrollbar`, and a classic Material refresh spinner shown Photos-style) and a classic Material refresh spinner shown during a
during a pull-triggered sync. `SearchView`, `AccountView` (Settings), the pull-triggered sync. `SearchView`, `AccountView` (Settings), the
file-details sheet, the share sheet, and `ShareUploadView` (the file-details sheet, the share sheet, and `ShareUploadView` (the
share-to-upload destination picker) are pushed on top via share-to-upload destination picker) are pushed on top via
`Navigator`/`showModalBottomSheet`/`showGradualBottomSheet` rather than `Navigator`/`showModalBottomSheet`/`showGradualBottomSheet` rather than
.claude/context/styling.md
+4 -7
View File
@@ -29,13 +29,10 @@ widgets. Key points:
- Dark theme supports an `amoled` flag that flattens every surface tone to - Dark theme supports an `amoled` flag that flattens every surface tone to
pure black — extend `colorScheme.copyWith(...)` there if a new surface pure black — extend `colorScheme.copyWith(...)` there if a new surface
role needs the same treatment, don't hardcode `Colors.black` at call sites. role needs the same treatment, don't hardcode `Colors.black` at call sites.
- **Scrollbars**: a project-wide `scrollbarTheme` (`AppTheme._scrollbarTheme`) - **Scrollbars are deliberately not shown** — every scrollable list in the
gives every `Scrollbar` in the app a thick, rounded, always-visible, app is a plain `ListView`/`CustomScrollView` with no `Scrollbar` wrapper
draggable thumb (Android fast-scroll style) derived from and no `scrollbarTheme` override (tried once, explicitly reverted). Don't
`colorScheme.onSurfaceVariant` — don't pass per-instance `thickness`/ reintroduce one without being asked.
`radius`/`thumbVisibility`/`interactive`, just wrap scrollable content in a
plain `Scrollbar(child: ...)` (pass `controller:` matching the scrollable's
own when one exists) and it picks up the theme automatically.
## Reusable chrome ## Reusable chrome
lib/theme/app_theme.dart
-33
View File
@@ -30,37 +30,6 @@ class AppTheme {
Color(0xFF2E7D32), // Emerald Green Color(0xFF2E7D32), // Emerald Green
]; ];
// Flutter's default Scrollbar renders a ~6px hairline that's easy to miss
// and hard to grab. This tunes it to read like Android's standard
// draggable fast-scroll thumb: thicker, pill-shaped, and always at least
// faintly visible (not just flashing in on scroll), while still getting
// a touch more visible/opaque while actively hovered or dragged.
static ScrollbarThemeData _scrollbarTheme(ColorScheme colorScheme) {
final thumbColor = colorScheme.onSurfaceVariant;
return ScrollbarThemeData(
thickness: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.dragged) ||
states.contains(WidgetState.hovered)) {
return 10.0;
}
return 8.0;
}),
radius: const Radius.circular(8),
thumbColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.dragged)) {
return thumbColor.withValues(alpha: 0.9);
}
if (states.contains(WidgetState.hovered)) {
return thumbColor.withValues(alpha: 0.8);
}
return thumbColor.withValues(alpha: 0.6);
}),
thumbVisibility: const WidgetStatePropertyAll(true),
trackVisibility: const WidgetStatePropertyAll(false),
interactive: true,
);
}
static ThemeData light( static ThemeData light(
Color seedColor, { Color seedColor, {
ColorScheme? dynamicScheme, ColorScheme? dynamicScheme,
@@ -80,7 +49,6 @@ class AppTheme {
scaffoldBackgroundColor: colorScheme.surface, scaffoldBackgroundColor: colorScheme.surface,
pageTransitionsTheme: _pageTransitionsTheme, pageTransitionsTheme: _pageTransitionsTheme,
sliderTheme: _sliderTheme, sliderTheme: _sliderTheme,
scrollbarTheme: _scrollbarTheme(colorScheme),
textTheme: GoogleFonts.interTextTheme(ThemeData.light().textTheme) textTheme: GoogleFonts.interTextTheme(ThemeData.light().textTheme)
.copyWith( .copyWith(
headlineMedium: GoogleFonts.inter( headlineMedium: GoogleFonts.inter(
@@ -147,7 +115,6 @@ class AppTheme {
scaffoldBackgroundColor: colorScheme.surface, scaffoldBackgroundColor: colorScheme.surface,
pageTransitionsTheme: _pageTransitionsTheme, pageTransitionsTheme: _pageTransitionsTheme,
sliderTheme: _sliderTheme, sliderTheme: _sliderTheme,
scrollbarTheme: _scrollbarTheme(colorScheme),
textTheme: GoogleFonts.interTextTheme(ThemeData.dark().textTheme) textTheme: GoogleFonts.interTextTheme(ThemeData.dark().textTheme)
.copyWith( .copyWith(
headlineMedium: GoogleFonts.inter( headlineMedium: GoogleFonts.inter(
lib/views/account_view.dart
+383 -378
View File
@@ -25,423 +25,428 @@ class AccountView extends StatelessWidget {
final quota = provider.quota; final quota = provider.quota;
return Scaffold( return Scaffold(
appBar: AppBar( appBar: AppBar(title: const Text('Settings')),
title: const Text('Settings'),
actions: [
IconButton(
onPressed: () => _showLogoutConfirmation(context, provider),
icon: const Icon(Icons.logout_rounded),
tooltip: 'Log Out',
color: colorScheme.error,
),
],
),
body: SafeArea( body: SafeArea(
child: Scrollbar( child: ListView(
child: ListView( padding: const EdgeInsets.fromLTRB(20, 8, 20, 32),
padding: const EdgeInsets.fromLTRB(20, 8, 20, 32), physics: const BouncingScrollPhysics(),
physics: const BouncingScrollPhysics(), children: [
children: [ // User Profile & Storage Card
Text( Container(
'Connected to ${provider.serverUrl}', padding: const EdgeInsets.all(20),
style: theme.textTheme.bodyMedium?.copyWith( decoration: BoxDecoration(
color: colorScheme.onSurfaceVariant, color: colorScheme.primaryContainer.withValues(alpha: 0.4),
borderRadius: BorderRadius.circular(28),
border: Border.all(
color: colorScheme.primary.withValues(alpha: 0.2),
), ),
), ),
const SizedBox(height: 20), child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
// User Profile & Storage Card children: [
Container( Row(
padding: const EdgeInsets.all(20), children: [
decoration: BoxDecoration( CircleAvatar(
color: colorScheme.primaryContainer.withValues(alpha: 0.4), radius: 28,
borderRadius: BorderRadius.circular(28), backgroundColor: colorScheme.primary,
border: Border.all( child: Text(
color: colorScheme.primary.withValues(alpha: 0.2), (quota?.userName ?? provider.username)
.substring(0, 1)
.toUpperCase(),
style: theme.textTheme.headlineSmall?.copyWith(
color: colorScheme.onPrimary,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
quota?.userName ?? provider.username,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 2),
Text(
quota?.email ?? provider.username,
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
],
),
),
IconButton(
onPressed: () =>
_showLogoutConfirmation(context, provider),
icon: const Icon(Icons.logout_rounded),
tooltip: 'Log Out',
color: colorScheme.error,
),
],
), ),
), const SizedBox(height: 20),
const Divider(height: 1),
const SizedBox(height: 16),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Storage Quota',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w600,
),
),
Text(
quota != null
? (quota.totalBytes > 0
? '${_formatBytes(quota.usedBytes)} of ${_formatBytes(quota.totalBytes)}'
: '${_formatBytes(quota.usedBytes)} (Unlimited)')
: 'Live Server Storage',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500,
),
),
],
),
const SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(6),
child: LinearProgressIndicator(
value: quota != null && quota.totalBytes > 0
? quota.usagePercentage
: 0.1,
minHeight: 10,
backgroundColor: colorScheme.surfaceContainerHighest,
valueColor: AlwaysStoppedAnimation<Color>(
colorScheme.primary,
),
),
),
const SizedBox(height: 8),
Text(
quota != null
? (quota.totalBytes > 0
? '${(quota.usagePercentage * 100).toStringAsFixed(1)}% used'
: 'Unlimited Storage Plan')
: 'WebDAV connection active',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 11,
),
),
const SizedBox(height: 16),
const Divider(height: 1),
const SizedBox(height: 12),
Row(
children: [
Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: provider.isLoggedIn
? Colors.green.withValues(alpha: 0.2)
: Colors.red.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(12),
),
child: Text(
provider.isLoggedIn ? 'ONLINE' : 'OFFLINE',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.bold,
color: provider.isLoggedIn
? Colors.green.shade800
: Colors.red.shade800,
),
),
),
const SizedBox(width: 8),
Expanded(
child: Text(
'Connected to ${provider.serverUrl}',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
),
],
),
],
),
),
const SizedBox(height: 24),
// Accounts Section
Text(
'Accounts',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 10),
const _AccountsCard(),
const SizedBox(height: 24),
// Server Credentials Section
Text(
'Server Connection Info',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 10),
Card(
child: Column(
children: [
ListTile(
leading: const Icon(Icons.dns_rounded),
title: const Text('Nextcloud Host'),
subtitle: Text(provider.serverUrl),
),
const Divider(height: 1, indent: 16, endIndent: 16),
ListTile(
leading: const Icon(Icons.person_rounded),
title: const Text('Logged In User'),
subtitle: Text(provider.username),
),
const Divider(height: 1, indent: 16, endIndent: 16),
ListTile(
leading: const Icon(Icons.refresh_rounded),
title: const Text('Refresh WebDAV Cache'),
onTap: () async {
await provider.refreshData();
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Refreshed WebDAV directory data'),
behavior: SnackBarBehavior.floating,
),
);
}
},
),
],
),
),
const SizedBox(height: 24),
// Material You Design Settings
Text(
'Material You Aesthetics',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 10),
Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text(
'Accent Color',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 4),
Text(
provider.useDynamicColor
? 'Matching your wallpaper'
: 'Custom color',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 12),
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [ children: [
CircleAvatar( _AccentSwatch(
radius: 28, isSelected: provider.useDynamicColor,
backgroundColor: colorScheme.primary, onTap: () => provider.setUseDynamicColor(true),
child: Text( borderColor: colorScheme.onSurface,
(quota?.userName ?? provider.username) background: colorScheme.surfaceContainerHighest,
.substring(0, 1) child: Icon(
.toUpperCase(), Icons.wallpaper_rounded,
style: theme.textTheme.headlineSmall?.copyWith( color: colorScheme.onSurfaceVariant,
color: colorScheme.onPrimary, size: 20,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
quota?.userName ?? provider.username,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 2),
Text(
quota?.email ?? provider.username,
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
],
),
),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: provider.isLoggedIn
? Colors.green.withValues(alpha: 0.2)
: Colors.red.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(12),
),
child: Text(
provider.isLoggedIn ? 'ONLINE' : 'OFFLINE',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.bold,
color: provider.isLoggedIn
? Colors.green.shade800
: Colors.red.shade800,
),
), ),
), ),
...AppTheme.seedColors.map((color) {
final isSelected =
!provider.useDynamicColor &&
provider.seedColor == color;
return _AccentSwatch(
isSelected: isSelected,
onTap: () => provider.setSeedColor(color),
borderColor: colorScheme.onSurface,
background: color,
child: isSelected
? const Icon(
Icons.check_rounded,
color: Colors.white,
size: 20,
)
: null,
);
}),
], ],
), ),
const SizedBox(height: 20), const SizedBox(height: 20),
const Divider(height: 1), const Divider(height: 1),
const SizedBox(height: 16), const SizedBox(height: 16),
Row( Text(
mainAxisAlignment: MainAxisAlignment.spaceBetween, 'Theme Mode',
children: [ style: theme.textTheme.titleSmall?.copyWith(
Text( fontWeight: FontWeight.w600,
'Storage Quota', ),
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w600,
),
),
Text(
quota != null
? (quota.totalBytes > 0
? '${_formatBytes(quota.usedBytes)} of ${_formatBytes(quota.totalBytes)}'
: '${_formatBytes(quota.usedBytes)} (Unlimited)')
: 'Live Server Storage',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500,
),
),
],
), ),
const SizedBox(height: 10), const SizedBox(height: 12),
ClipRRect( SizedBox(
borderRadius: BorderRadius.circular(6), width: double.infinity,
child: LinearProgressIndicator( child: SegmentedButton<ThemeMode>(
value: quota != null && quota.totalBytes > 0 segments: const [
? quota.usagePercentage ButtonSegment(
: 0.1, value: ThemeMode.system,
minHeight: 10, icon: Icon(Icons.brightness_auto_rounded),
backgroundColor: colorScheme.surfaceContainerHighest, label: Text('System'),
valueColor: AlwaysStoppedAnimation<Color>( ),
colorScheme.primary, ButtonSegment(
), value: ThemeMode.light,
icon: Icon(Icons.light_mode_rounded),
label: Text('Light'),
),
ButtonSegment(
value: ThemeMode.dark,
icon: Icon(Icons.dark_mode_rounded),
label: Text('Dark'),
),
],
selected: {provider.themeMode},
onSelectionChanged: (set) =>
provider.setThemeMode(set.first),
), ),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
Text( SwitchListTile(
quota != null contentPadding: EdgeInsets.zero,
? (quota.totalBytes > 0 title: const Text('AMOLED Black'),
? '${(quota.usagePercentage * 100).toStringAsFixed(1)}% used' subtitle: const Text(
: 'Unlimited Storage Plan') 'Use pure black backgrounds in dark mode',
: 'WebDAV connection active',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 11,
), ),
value: provider.amoledDark,
onChanged: provider.setAmoledDark,
), ),
], ],
), ),
), ),
const SizedBox(height: 24), ),
const SizedBox(height: 24),
// Accounts Section // UI Settings
Text( Text(
'Accounts', 'UI',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 10), ),
const _AccountsCard(), const SizedBox(height: 10),
const SizedBox(height: 24), const _BottomBarAppearanceCard(),
const SizedBox(height: 12),
Card(
child: SwitchListTile(
title: const Text('Tap Tab to Scroll to Top'),
subtitle: const Text(
'Tapping the current bottom bar tab scrolls its list back to the top',
),
value: provider.tapTabToScrollTop,
onChanged: provider.setTapTabToScrollTop,
),
),
const SizedBox(height: 24),
// Server Credentials Section // Bottom Nav Tabs
Text( Text(
'Server Connection Info', 'Bottom Bar Tabs',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 10), ),
Card( const SizedBox(height: 4),
child: Column( Text(
children: [ 'Drag to reorder, tap the star to set the default, toggle to show or hide',
ListTile( style: theme.textTheme.bodySmall?.copyWith(
leading: const Icon(Icons.dns_rounded), color: colorScheme.onSurfaceVariant,
title: const Text('Nextcloud Host'),
subtitle: Text(provider.serverUrl),
),
const Divider(height: 1, indent: 16, endIndent: 16),
ListTile(
leading: const Icon(Icons.person_rounded),
title: const Text('Logged In User'),
subtitle: Text(provider.username),
),
const Divider(height: 1, indent: 16, endIndent: 16),
ListTile(
leading: const Icon(Icons.refresh_rounded),
title: const Text('Refresh WebDAV Cache'),
onTap: () async {
await provider.refreshData();
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Refreshed WebDAV directory data'),
behavior: SnackBarBehavior.floating,
),
);
}
},
),
],
),
), ),
const SizedBox(height: 24), ),
const SizedBox(height: 10),
const _TabSettingsCard(),
const SizedBox(height: 24),
// Material You Design Settings // Swipe Actions
Text( Text(
'Material You Aesthetics', 'Files Swipe Actions',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 10), ),
Card( const SizedBox(height: 4),
child: Padding( Text(
padding: const EdgeInsets.all(16), 'Choose what swiping a file left or right does in list view',
child: Column( style: theme.textTheme.bodySmall?.copyWith(
crossAxisAlignment: CrossAxisAlignment.start, color: colorScheme.onSurfaceVariant,
children: [
Text(
'Accent Color',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 4),
Text(
provider.useDynamicColor
? 'Matching your wallpaper'
: 'Custom color',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 12),
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_AccentSwatch(
isSelected: provider.useDynamicColor,
onTap: () => provider.setUseDynamicColor(true),
borderColor: colorScheme.onSurface,
background: colorScheme.surfaceContainerHighest,
child: Icon(
Icons.wallpaper_rounded,
color: colorScheme.onSurfaceVariant,
size: 20,
),
),
...AppTheme.seedColors.map((color) {
final isSelected =
!provider.useDynamicColor &&
provider.seedColor == color;
return _AccentSwatch(
isSelected: isSelected,
onTap: () => provider.setSeedColor(color),
borderColor: colorScheme.onSurface,
background: color,
child: isSelected
? const Icon(
Icons.check_rounded,
color: Colors.white,
size: 20,
)
: null,
);
}),
],
),
const SizedBox(height: 20),
const Divider(height: 1),
const SizedBox(height: 16),
Text(
'Theme Mode',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 12),
SizedBox(
width: double.infinity,
child: SegmentedButton<ThemeMode>(
segments: const [
ButtonSegment(
value: ThemeMode.system,
icon: Icon(Icons.brightness_auto_rounded),
label: Text('System'),
),
ButtonSegment(
value: ThemeMode.light,
icon: Icon(Icons.light_mode_rounded),
label: Text('Light'),
),
ButtonSegment(
value: ThemeMode.dark,
icon: Icon(Icons.dark_mode_rounded),
label: Text('Dark'),
),
],
selected: {provider.themeMode},
onSelectionChanged: (set) =>
provider.setThemeMode(set.first),
),
),
const SizedBox(height: 8),
SwitchListTile(
contentPadding: EdgeInsets.zero,
title: const Text('AMOLED Black'),
subtitle: const Text(
'Use pure black backgrounds in dark mode',
),
value: provider.amoledDark,
onChanged: provider.setAmoledDark,
),
],
),
),
), ),
const SizedBox(height: 24), ),
const SizedBox(height: 10),
const _SwipeActionsCard(),
const SizedBox(height: 24),
// UI Settings // Media Player
Text( Text(
'UI', 'Media Player',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 10), ),
const _BottomBarAppearanceCard(), const SizedBox(height: 4),
const SizedBox(height: 12), Text(
Card( 'Choose the seek bar style used when playing videos',
child: SwitchListTile( style: theme.textTheme.bodySmall?.copyWith(
title: const Text('Tap Tab to Scroll to Top'), color: colorScheme.onSurfaceVariant,
subtitle: const Text(
'Tapping the current bottom bar tab scrolls its list back to the top',
),
value: provider.tapTabToScrollTop,
onChanged: provider.setTapTabToScrollTop,
),
), ),
const SizedBox(height: 24), ),
const SizedBox(height: 10),
const _MediaPlayerCard(),
const SizedBox(height: 24),
// Bottom Nav Tabs // Files Cache
Text( Text(
'Bottom Bar Tabs', 'Files Cache',
style: theme.textTheme.titleMedium?.copyWith( style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 4), ),
Text( const SizedBox(height: 4),
'Drag to reorder, tap the star to set the default, toggle to show or hide', Text(
style: theme.textTheme.bodySmall?.copyWith( 'Reuse a folder\'s listing instead of refetching it on every visit',
color: colorScheme.onSurfaceVariant, style: theme.textTheme.bodySmall?.copyWith(
), color: colorScheme.onSurfaceVariant,
), ),
const SizedBox(height: 10), ),
const _TabSettingsCard(), const SizedBox(height: 10),
const SizedBox(height: 24), const _CacheSettingsCard(),
],
// Swipe Actions
Text(
'Files Swipe Actions',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 4),
Text(
'Choose what swiping a file left or right does in list view',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 10),
const _SwipeActionsCard(),
const SizedBox(height: 24),
// Media Player
Text(
'Media Player',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 4),
Text(
'Choose the seek bar style used when playing videos',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 10),
const _MediaPlayerCard(),
const SizedBox(height: 24),
// Files Cache
Text(
'Files Cache',
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 4),
Text(
'Reuse a folder\'s listing instead of refetching it on every visit',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 10),
const _CacheSettingsCard(),
],
),
), ),
), ),
); );
lib/views/search_view.dart
+18 -28
View File
@@ -18,7 +18,6 @@ class SearchView extends StatefulWidget {
class _SearchViewState extends State<SearchView> { class _SearchViewState extends State<SearchView> {
final _controller = TextEditingController(); final _controller = TextEditingController();
final _focusNode = FocusNode(); final _focusNode = FocusNode();
final _resultsScrollController = ScrollController();
Timer? _debounce; Timer? _debounce;
List<NextcloudItem> _results = []; List<NextcloudItem> _results = [];
@@ -31,7 +30,6 @@ class _SearchViewState extends State<SearchView> {
_debounce?.cancel(); _debounce?.cancel();
_controller.dispose(); _controller.dispose();
_focusNode.dispose(); _focusNode.dispose();
_resultsScrollController.dispose();
super.dispose(); super.dispose();
} }
@@ -187,32 +185,24 @@ class _SearchViewState extends State<SearchView> {
), ),
); );
} }
return Scrollbar( return ListView.builder(
controller: _resultsScrollController, padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
child: ListView.builder( itemCount: _results.length,
controller: _resultsScrollController, itemBuilder: (context, index) {
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8), final item = _results[index];
itemCount: _results.length, return ListTile(
itemBuilder: (context, index) { leading: Icon(_iconFor(item.type), color: colorScheme.primary),
final item = _results[index]; title: Text(item.name, maxLines: 1, overflow: TextOverflow.ellipsis),
return ListTile( subtitle: Text(
leading: Icon(_iconFor(item.type), color: colorScheme.primary), item.isFolder
title: Text( ? item.path
item.name, : DateFormat.yMMMd().format(item.lastModified),
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
subtitle: Text( onTap: () => _openResult(item),
item.isFolder );
? item.path },
: DateFormat.yMMMd().format(item.lastModified),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
onTap: () => _openResult(item),
);
},
),
); );
} }
} }
lib/views/share_upload_view.dart
+15 -19
View File
@@ -142,25 +142,21 @@ class _ShareUploadViewState extends State<ShareUploadView> {
), ),
), ),
) )
: Scrollbar( : ListView.builder(
child: ListView.builder( itemCount: folders.length,
itemCount: folders.length, itemBuilder: (context, index) {
itemBuilder: (context, index) { final folder = folders[index];
final folder = folders[index]; return ListTile(
return ListTile( leading: Icon(
leading: Icon( Icons.folder_rounded,
Icons.folder_rounded, color: colorScheme.primary,
color: colorScheme.primary, ),
), title: Text(folder.name),
title: Text(folder.name), trailing: const Icon(Icons.chevron_right_rounded),
trailing: const Icon( onTap: () =>
Icons.chevron_right_rounded, provider.navigateToFolder(folder.path),
), );
onTap: () => },
provider.navigateToFolder(folder.path),
);
},
),
), ),
), ),
], ],
lib/widgets/details/details_activity_tab.dart
+82 -84
View File
@@ -53,92 +53,90 @@ class _DetailsActivityTabState extends State<DetailsActivityTab> {
); );
} }
return Scrollbar( return ListView.builder(
child: ListView.builder( padding: const EdgeInsets.fromLTRB(20, 12, 20, 24),
padding: const EdgeInsets.fromLTRB(20, 12, 20, 24), itemCount: _activities.length,
itemCount: _activities.length, itemBuilder: (context, index) {
itemBuilder: (context, index) { final act = _activities[index];
final act = _activities[index]; return Padding(
return Padding( padding: const EdgeInsets.only(bottom: 12),
padding: const EdgeInsets.only(bottom: 12), child: Container(
child: Container( padding: const EdgeInsets.all(16),
padding: const EdgeInsets.all(16), decoration: BoxDecoration(
decoration: BoxDecoration( color: colorScheme.surfaceContainerLow,
color: colorScheme.surfaceContainerLow, borderRadius: BorderRadius.circular(20),
borderRadius: BorderRadius.circular(20), border: Border.all(
border: Border.all( color: colorScheme.outlineVariant.withValues(alpha: 0.2),
color: colorScheme.outlineVariant.withValues(alpha: 0.2),
),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: colorScheme.primaryContainer,
shape: BoxShape.circle,
),
child: Icon(
act.icon,
color: colorScheme.onPrimaryContainer,
size: 20,
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
act.title,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w600,
fontSize: 14,
),
),
),
const SizedBox(width: 8),
Text(
DateFormat.jm().format(act.timestamp),
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 11,
),
),
],
),
const SizedBox(height: 4),
Text(
act.subject,
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 13,
),
),
const SizedBox(height: 6),
Text(
'By ${act.author} • ${DateFormat.MMMd().format(act.timestamp)}',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.primary,
fontWeight: FontWeight.w500,
fontSize: 11,
),
),
],
),
),
],
), ),
), ),
); child: Row(
}, crossAxisAlignment: CrossAxisAlignment.start,
), children: [
Container(
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: colorScheme.primaryContainer,
shape: BoxShape.circle,
),
child: Icon(
act.icon,
color: colorScheme.onPrimaryContainer,
size: 20,
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
act.title,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w600,
fontSize: 14,
),
),
),
const SizedBox(width: 8),
Text(
DateFormat.jm().format(act.timestamp),
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 11,
),
),
],
),
const SizedBox(height: 4),
Text(
act.subject,
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.onSurfaceVariant,
fontSize: 13,
),
),
const SizedBox(height: 6),
Text(
'By ${act.author} • ${DateFormat.MMMd().format(act.timestamp)}',
style: theme.textTheme.bodySmall?.copyWith(
color: colorScheme.primary,
fontWeight: FontWeight.w500,
fontSize: 11,
),
),
],
),
),
],
),
),
);
},
); );
} }
} }
lib/widgets/details/details_info_tab.dart
+28 -31
View File
@@ -26,42 +26,39 @@ class DetailsInfoTab extends StatelessWidget {
('Favorite', item.isFavorite ? 'Yes' : 'No'), ('Favorite', item.isFavorite ? 'Yes' : 'No'),
]; ];
return Scrollbar( return ListView.separated(
controller: scrollController, controller: scrollController,
child: ListView.separated( padding: const EdgeInsets.fromLTRB(20, 12, 20, 24),
controller: scrollController, itemCount: rows.length,
padding: const EdgeInsets.fromLTRB(20, 12, 20, 24), separatorBuilder: (context, index) => const Divider(height: 1),
itemCount: rows.length, itemBuilder: (context, index) {
separatorBuilder: (context, index) => const Divider(height: 1), final (label, value) = rows[index];
itemBuilder: (context, index) { return Padding(
final (label, value) = rows[index]; padding: const EdgeInsets.symmetric(vertical: 12),
return Padding( child: Row(
padding: const EdgeInsets.symmetric(vertical: 12), crossAxisAlignment: CrossAxisAlignment.start,
child: Row( children: [
crossAxisAlignment: CrossAxisAlignment.start, SizedBox(
children: [ width: 96,
SizedBox( child: Text(
width: 96, label,
child: Text( style: theme.textTheme.bodyMedium?.copyWith(
label, color: colorScheme.onSurfaceVariant,
style: theme.textTheme.bodyMedium?.copyWith(
color: colorScheme.onSurfaceVariant,
),
), ),
), ),
Expanded( ),
child: Text( Expanded(
value, child: Text(
style: theme.textTheme.bodyMedium?.copyWith( value,
fontWeight: FontWeight.w500, style: theme.textTheme.bodyMedium?.copyWith(
), fontWeight: FontWeight.w500,
), ),
), ),
], ),
), ],
); ),
}, );
), },
); );
} }
} }
lib/widgets/details/details_versions_tab.dart
+36 -38
View File
@@ -118,45 +118,43 @@ class _DetailsVersionsTabState extends State<DetailsVersionsTab> {
..._versions, ..._versions,
]; ];
return Scrollbar( return ListView.separated(
child: ListView.separated( padding: const EdgeInsets.fromLTRB(20, 12, 20, 24),
padding: const EdgeInsets.fromLTRB(20, 12, 20, 24), itemCount: items.length,
itemCount: items.length, separatorBuilder: (context, index) => const SizedBox(height: 4),
separatorBuilder: (context, index) => const SizedBox(height: 4), itemBuilder: (context, index) {
itemBuilder: (context, index) { final version = items[index];
final version = items[index]; return ListTile(
return ListTile( contentPadding: EdgeInsets.zero,
contentPadding: EdgeInsets.zero, leading: CircleAvatar(
leading: CircleAvatar( backgroundColor: colorScheme.primaryContainer,
backgroundColor: colorScheme.primaryContainer, child: Icon(
child: Icon( Icons.history_rounded,
Icons.history_rounded, color: colorScheme.onPrimaryContainer,
color: colorScheme.onPrimaryContainer, size: 20,
size: 20,
),
), ),
title: Text( ),
version.isCurrent title: Text(
? 'Current version' version.isCurrent
: DateFormat.yMMMd().add_jm().format(version.timestamp), ? 'Current version'
), : DateFormat.yMMMd().add_jm().format(version.timestamp),
subtitle: Text( ),
'${DateFormat.yMMMd().format(version.timestamp)} • ${formatBytes(version.size)}', subtitle: Text(
), '${DateFormat.yMMMd().format(version.timestamp)} • ${formatBytes(version.size)}',
trailing: version.isCurrent ),
? null trailing: version.isCurrent
: PopupMenuButton<String>( ? null
onSelected: (value) => value == 'restore' : PopupMenuButton<String>(
? _restore(version) onSelected: (value) => value == 'restore'
: _download(version), ? _restore(version)
itemBuilder: (context) => const [ : _download(version),
PopupMenuItem(value: 'restore', child: Text('Restore')), itemBuilder: (context) => const [
PopupMenuItem(value: 'download', child: Text('Download')), PopupMenuItem(value: 'restore', child: Text('Restore')),
], PopupMenuItem(value: 'download', child: Text('Download')),
), ],
); ),
}, );
), },
); );
} }
} }
lib/widgets/share_sheet.dart
+91 -98
View File
@@ -299,115 +299,108 @@ class _ShareSheetState extends State<ShareSheet> {
.toList(); .toList();
final internalLink = internalLinkFor(provider.serverUrl, widget.item.id); final internalLink = internalLinkFor(provider.serverUrl, widget.item.id);
return Scrollbar( return ListView(
controller: widget.scrollController, controller: widget.scrollController,
child: ListView( padding: const EdgeInsets.fromLTRB(20, 12, 20, 24),
controller: widget.scrollController, children: [
padding: const EdgeInsets.fromLTRB(20, 12, 20, 24), Text(
children: [ widget.item.name,
Text( maxLines: 1,
widget.item.name, overflow: TextOverflow.ellipsis,
maxLines: 1, style: theme.textTheme.titleMedium?.copyWith(
overflow: TextOverflow.ellipsis, fontWeight: FontWeight.w700,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
),
), ),
const SizedBox(height: 16), ),
_sectionHeader('Internal shares'), const SizedBox(height: 16),
const SizedBox(height: 8), _sectionHeader('Internal shares'),
TextField( const SizedBox(height: 8),
controller: _searchController, TextField(
decoration: InputDecoration( controller: _searchController,
hintText: 'Type names or teams', decoration: InputDecoration(
prefixIcon: const Icon(Icons.search_rounded), hintText: 'Type names or teams',
suffixIcon: _isSearching prefixIcon: const Icon(Icons.search_rounded),
? const Padding( suffixIcon: _isSearching
padding: EdgeInsets.all(14), ? const Padding(
child: SizedBox( padding: EdgeInsets.all(14),
width: 16, child: SizedBox(
height: 16, width: 16,
child: CircularProgressIndicator(strokeWidth: 2), height: 16,
), child: CircularProgressIndicator(strokeWidth: 2),
) ),
: null, )
border: OutlineInputBorder( : null,
borderRadius: BorderRadius.circular(16), border: OutlineInputBorder(borderRadius: BorderRadius.circular(16)),
), filled: true,
filled: true, fillColor: colorScheme.surfaceContainerLow,
fillColor: colorScheme.surfaceContainerLow,
),
onChanged: _search,
), ),
for (final sharee in _searchResults) onChanged: _search,
ListTile( ),
contentPadding: EdgeInsets.zero, for (final sharee in _searchResults)
leading: Icon( ListTile(
sharee.type == ShareeType.group contentPadding: EdgeInsets.zero,
? Icons.groups_rounded leading: Icon(
: Icons.person_rounded, sharee.type == ShareeType.group
), ? Icons.groups_rounded
title: Text(sharee.label), : Icons.person_rounded,
subtitle: sharee.subtitle != null ? Text(sharee.subtitle!) : null,
onTap: () => _addSharee(sharee),
), ),
for (final share in userGroupShares) _shareRow(share), title: Text(sharee.label),
if (_inherited.isNotEmpty) subtitle: sharee.subtitle != null ? Text(sharee.subtitle!) : null,
ExpansionTile( onTap: () => _addSharee(sharee),
tilePadding: EdgeInsets.zero,
leading: const Icon(Icons.more_horiz_rounded),
title: Text('Others with access (${_inherited.length})'),
children: [
for (final share in _inherited)
_shareRow(share, removable: false),
],
),
if (internalLink != null)
ListTile(
contentPadding: EdgeInsets.zero,
leading: const Icon(Icons.link_rounded),
title: const Text('Internal link'),
subtitle: const Text('For people who already have access'),
trailing: IconButton(
icon: const Icon(Icons.copy_rounded),
tooltip: 'Copy link',
onPressed: () => _copy(internalLink, 'internal link'),
),
),
const SizedBox(height: 20),
const Divider(),
const SizedBox(height: 12),
_sectionHeader('External shares'),
const SizedBox(height: 8),
TextField(
controller: _emailController,
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
hintText: 'Type an email',
prefixIcon: const Icon(Icons.email_outlined),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(16),
),
filled: true,
fillColor: colorScheme.surfaceContainerLow,
),
onSubmitted: (_) => _addEmailShare(),
), ),
for (final share in emailShares) _shareRow(share), for (final share in userGroupShares) _shareRow(share),
const SizedBox(height: 8), if (_inherited.isNotEmpty)
for (final share in publicLinkShares) _shareRow(share, copyUrl: true), ExpansionTile(
tilePadding: EdgeInsets.zero,
leading: const Icon(Icons.more_horiz_rounded),
title: Text('Others with access (${_inherited.length})'),
children: [
for (final share in _inherited)
_shareRow(share, removable: false),
],
),
if (internalLink != null)
ListTile( ListTile(
contentPadding: EdgeInsets.zero, contentPadding: EdgeInsets.zero,
leading: const Icon(Icons.link_rounded), leading: const Icon(Icons.link_rounded),
title: const Text('Create public link'), title: const Text('Internal link'),
subtitle: const Text('For people who already have access'),
trailing: IconButton( trailing: IconButton(
icon: const Icon(Icons.add_rounded), icon: const Icon(Icons.copy_rounded),
tooltip: 'Create public link', tooltip: 'Copy link',
onPressed: _createPublicLink, onPressed: () => _copy(internalLink, 'internal link'),
), ),
), ),
], const SizedBox(height: 20),
), const Divider(),
const SizedBox(height: 12),
_sectionHeader('External shares'),
const SizedBox(height: 8),
TextField(
controller: _emailController,
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
hintText: 'Type an email',
prefixIcon: const Icon(Icons.email_outlined),
border: OutlineInputBorder(borderRadius: BorderRadius.circular(16)),
filled: true,
fillColor: colorScheme.surfaceContainerLow,
),
onSubmitted: (_) => _addEmailShare(),
),
for (final share in emailShares) _shareRow(share),
const SizedBox(height: 8),
for (final share in publicLinkShares) _shareRow(share, copyUrl: true),
ListTile(
contentPadding: EdgeInsets.zero,
leading: const Icon(Icons.link_rounded),
title: const Text('Create public link'),
trailing: IconButton(
icon: const Icon(Icons.add_rounded),
tooltip: 'Create public link',
onPressed: _createPublicLink,
),
),
],
); );
} }
} }
lib/widgets/synced_header_scaffold.dart
+39 -42
View File
@@ -161,50 +161,47 @@ class _SyncedHeaderScaffoldState extends State<SyncedHeaderScaffold> {
children: [ children: [
NotificationListener<ScrollNotification>( NotificationListener<ScrollNotification>(
onNotification: _handleScrollNotification, onNotification: _handleScrollNotification,
child: Scrollbar( child: CustomScrollView(
controller: widget.scrollController, controller: widget.scrollController,
child: CustomScrollView( // Plain BouncingScrollPhysics only bounces/overscrolls
controller: widget.scrollController, // reliably once content already fills the viewport — with
// Plain BouncingScrollPhysics only bounces/overscrolls // too little content (e.g. a single item) the pull gesture
// reliably once content already fills the viewport — with // can fail to register at all. AlwaysScrollableScrollPhysics
// too little content (e.g. a single item) the pull gesture // keeps the pull (and therefore the sync header) working
// can fail to register at all. AlwaysScrollableScrollPhysics // regardless of content length.
// keeps the pull (and therefore the sync header) working physics: const AlwaysScrollableScrollPhysics(
// regardless of content length. parent: BouncingScrollPhysics(),
physics: const AlwaysScrollableScrollPhysics(
parent: BouncingScrollPhysics(),
),
slivers: [
SliverAppBar(
pinned: true,
stretch: true,
expandedHeight: _headerLocked ? 190 : kToolbarHeight,
collapsedHeight: kToolbarHeight,
backgroundColor: colorScheme.surfaceContainer,
surfaceTintColor: colorScheme.surfaceContainer,
scrolledUnderElevation: 0,
automaticallyImplyLeading: false,
leadingWidth: _headerLocked ? 56 : 160,
leading: leadingWidget,
actions: widget.actions,
flexibleSpace: FlexibleSpaceBar(
background: _SyncedStretchPanel(
provider: provider,
forceVisible: _headerLocked,
),
),
),
DecoratedSliver(
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: const BorderRadius.vertical(
top: Radius.circular(28),
),
),
sliver: SliverMainAxisGroup(slivers: widget.contentSlivers),
),
],
), ),
slivers: [
SliverAppBar(
pinned: true,
stretch: true,
expandedHeight: _headerLocked ? 190 : kToolbarHeight,
collapsedHeight: kToolbarHeight,
backgroundColor: colorScheme.surfaceContainer,
surfaceTintColor: colorScheme.surfaceContainer,
scrolledUnderElevation: 0,
automaticallyImplyLeading: false,
leadingWidth: _headerLocked ? 56 : 160,
leading: leadingWidget,
actions: widget.actions,
flexibleSpace: FlexibleSpaceBar(
background: _SyncedStretchPanel(
provider: provider,
forceVisible: _headerLocked,
),
),
),
DecoratedSliver(
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: const BorderRadius.vertical(
top: Radius.circular(28),
),
),
sliver: SliverMainAxisGroup(slivers: widget.contentSlivers),
),
],
), ),
), ),
// The classic Material pull-to-refresh "bubble" — a floating // The classic Material pull-to-refresh "bubble" — a floating