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

Rebuild Noo as a full Nextcloud client: auth, media, and Material You UI

Browse Source 
Replaces the starter template with Login Flow v2 auth, WebDAV-backed
Files/Photos/Activity tabs, a swipeable media viewer with PDF/text/video
preview, Material You dynamic theming, a frosted-glass floating nav bar,
and a rebranded app icon/identity (com.example -> family.nasa).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
ayushya
2026-09-15 16:07:02 -04:00
co-authored by Claude Sonnet 5
parent 54f80a65e7
commit f62d912ef7
47 changed files with 5083 additions and 1571 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/widgets/floating_bottom_bar.dart
+110 -115
View File
@@ -1,145 +1,140 @@
import 'dart:ui';
import 'package:flutter/material.dart';
import 'frosted_glass_container.dart';
class FloatingNavItem {
final String label;
final IconData icon;
final IconData selectedIcon;
final String? badge;
const FloatingNavItem({
required this.label,
required this.icon,
required this.selectedIcon,
this.badge,
});
const FloatingNavItem({required this.label, required this.icon});
}
/// A floating pill-shaped bottom navigation bar in the style of Google
/// Photos' 2026 redesign: unselected destinations collapse to just their
/// icon, the selected destination expands into an icon+label capsule, and
/// a detached circular action (search) sits just outside the pill.
class FloatingBottomNavBar extends StatelessWidget {
final int selectedIndex;
final ValueChanged<int> onDestinationSelected;
final List<FloatingNavItem> items;
final bool isVisible;
final VoidCallback? onSearchTap;
final double opacity;
final double blurSigma;
const FloatingBottomNavBar({
super.key,
required this.selectedIndex,
required this.onDestinationSelected,
required this.items,
this.isVisible = true,
this.onSearchTap,
this.opacity = 0.55,
this.blurSigma = 28,
});
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final colorScheme = theme.colorScheme;
final colorScheme = Theme.of(context).colorScheme;
return AnimatedSlide(
duration: const Duration(milliseconds: 300),
curve: Curves.easeInOutCubic,
offset: isVisible ? Offset.zero : const Offset(0, 1.5),
child: AnimatedOpacity(
duration: const Duration(milliseconds: 250),
opacity: isVisible ? 1.0 : 0.0,
child: SafeArea(
child: Align(
alignment: Alignment.bottomCenter,
child: Container(
margin: const EdgeInsets.only(bottom: 20, left: 24, right: 24),
constraints: const BoxConstraints(maxWidth: 460),
height: 68,
child: ClipRRect(
borderRadius: BorderRadius.circular(34),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
decoration: BoxDecoration(
color: colorScheme.surfaceContainerHighest.withValues(alpha: 0.82),
borderRadius: BorderRadius.circular(34),
border: Border.all(
color: colorScheme.outlineVariant.withValues(alpha: 0.3),
width: 1,
),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.12),
blurRadius: 24,
offset: const Offset(0, 8),
),
],
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: List.generate(items.length, (index) {
final item = items[index];
final isSelected = selectedIndex == index;
return Expanded(
child: InkWell(
onTap: () => onDestinationSelected(index),
borderRadius: BorderRadius.circular(28),
splashColor: colorScheme.primary.withValues(alpha: 0.12),
highlightColor: Colors.transparent,
child: AnimatedContainer(
duration: const Duration(milliseconds: 250),
curve: Curves.easeInOutCubic,
margin: const EdgeInsets.symmetric(horizontal: 4),
padding: const EdgeInsets.symmetric(vertical: 6),
decoration: BoxDecoration(
color: isSelected
? colorScheme.primaryContainer
: Colors.transparent,
borderRadius: BorderRadius.circular(24),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
AnimatedScale(
duration: const Duration(milliseconds: 200),
scale: isSelected ? 1.12 : 1.0,
child: Icon(
isSelected ? item.selectedIcon : item.icon,
size: 22,
color: isSelected
? colorScheme.onPrimaryContainer
: colorScheme.onSurfaceVariant,
),
),
const SizedBox(height: 3),
AnimatedDefaultTextStyle(
duration: const Duration(milliseconds: 200),
style: TextStyle(
fontSize: 11,
fontWeight: isSelected
? FontWeight.w700
: FontWeight.w500,
color: isSelected
? colorScheme.onPrimaryContainer
: colorScheme.onSurfaceVariant,
letterSpacing: 0.1,
),
child: Text(
item.label,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
],
),
),
),
);
}),
),
),
),
),
return SafeArea(
child: Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.only(bottom: 20, left: 20, right: 20),
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 480),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
_buildPill(context, colorScheme),
const SizedBox(width: 10),
_buildSearchButton(context, colorScheme),
],
),
),
),
),
);
}
Widget _buildPill(BuildContext context, ColorScheme colorScheme) {
return FrostedGlassContainer(
opacity: opacity,
blurSigma: blurSigma,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 6),
child: Row(
mainAxisSize: MainAxisSize.min,
children: List.generate(items.length, (index) {
final item = items[index];
final isSelected = selectedIndex == index;
return InkWell(
onTap: () => onDestinationSelected(index),
borderRadius: BorderRadius.circular(26),
splashColor: colorScheme.primary.withValues(alpha: 0.12),
highlightColor: Colors.transparent,
child: AnimatedContainer(
duration: const Duration(milliseconds: 250),
curve: Curves.easeInOutCubic,
padding: EdgeInsets.symmetric(
horizontal: isSelected ? 16 : 12,
vertical: 12,
),
decoration: BoxDecoration(
color: isSelected ? colorScheme.primary : Colors.transparent,
borderRadius: BorderRadius.circular(26),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
item.icon,
size: 22,
color: isSelected
? colorScheme.onPrimary
: colorScheme.onSurfaceVariant,
),
if (isSelected) ...[
const SizedBox(width: 8),
Text(
item.label,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w700,
color: colorScheme.onPrimary,
letterSpacing: 0.1,
),
),
],
],
),
),
);
}),
),
),
);
}
Widget _buildSearchButton(BuildContext context, ColorScheme colorScheme) {
return FrostedGlassContainer(
opacity: opacity,
blurSigma: blurSigma,
child: SizedBox(
width: 52,
height: 52,
child: InkWell(
onTap: onSearchTap,
borderRadius: BorderRadius.circular(32),
splashColor: colorScheme.primary.withValues(alpha: 0.12),
child: Icon(
Icons.search_rounded,
color: colorScheme.onSurfaceVariant,
size: 24,
),
),
),
);
}
}