b0esche/b0esche_cloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor HomePage layout for improved audio player visibility and navigation button arrangement

Browse Source
This commit is contained in:
Leon Bösche
2026-01-17 01:23:39 +01:00
parent c6eb497bfa
commit c2919facfd
1 changed files with 69 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
b0esche_cloud/lib/pages/home_page.dart
View File

@@ -405,7 +405,7 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
backgroundColor: AppTheme.primaryBackground,
body: Stack(
children: [
// Title and audio bar row
// Top bar: title, audio bar (if visible), nav buttons, all in a centered row
Positioned(
top: 0,
left: 0,
@@ -416,83 +416,77 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
left: 32,
right: 32,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
// Title
Builder(
builder: (context) {
final screenWidth = MediaQuery.of(context).size.width;
final fontSize = screenWidth < 600 ? 24.0 : 48.0;
return Text(
'b0esche.cloud',
style: TextStyle(
fontFamily: 'PixelatedElegance',
fontSize: fontSize,
color: AppTheme.primaryText,
decoration: TextDecoration.underline,
decorationColor: AppTheme.primaryText,
fontFeatures: const [FontFeature.slashedZero()],
),
);
},
),
const SizedBox(width: 32),
// Audio bar (centered between title and nav buttons)
Expanded(
child: AnimatedBuilder(
animation: _audioBarController,
builder: (context, child) {
return (_showAudioBar &&
_audioFileName != null &&
_audioFileUrl != null)
? Center(
child: FractionallySizedBox(
widthFactor: 0.7,
child: SlideTransition(
position: _audioBarOffset,
child: AudioPlayerBar(
fileName: _audioFileName!,
fileUrl: _audioFileUrl!,
onClose: () {
_audioBarController.reverse();
setState(() => _showAudioBar = false);
},
),
),
),
)
: const SizedBox.shrink();
child: Center(
child: Row(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
// Title
Builder(
builder: (context) {
final screenWidth = MediaQuery.of(context).size.width;
final fontSize = screenWidth < 600 ? 24.0 : 48.0;
return Text(
'b0esche.cloud',
style: TextStyle(
fontFamily: 'PixelatedElegance',
fontSize: fontSize,
color: AppTheme.primaryText,
decoration: TextDecoration.underline,
decorationColor: AppTheme.primaryText,
fontFeatures: const [FontFeature.slashedZero()],
),
);
},
),
),
const SizedBox(width: 32),
// Navigation buttons (Drive, Mail, Add, Profile)
BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
final isLoggedIn = state is AuthAuthenticated;
if (!isLoggedIn) {
return const SizedBox.shrink();
}
return Row(
mainAxisSize: MainAxisSize.min,
children: [
_buildNavButton('Drive', Icons.cloud),
const SizedBox(width: 16),
_buildNavButton('Mail', Icons.mail),
const SizedBox(width: 16),
_buildNavButton('Add', Icons.add),
const SizedBox(width: 16),
_buildNavButton(
'Profile',
Icons.person,
isAvatar: true,
// Audio player (if visible)
if (_showAudioBar &&
_audioFileName != null &&
_audioFileUrl != null) ...[
const SizedBox(width: 32),
FractionallySizedBox(
widthFactor: 0.5,
child: SlideTransition(
position: _audioBarOffset,
child: AudioPlayerBar(
fileName: _audioFileName!,
fileUrl: _audioFileUrl!,
onClose: () {
_audioBarController.reverse();
setState(() => _showAudioBar = false);
},
),
],
);
},
),
],
),
),
],
const SizedBox(width: 32),
// Navigation buttons
BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
final isLoggedIn = state is AuthAuthenticated;
if (!isLoggedIn) {
return const SizedBox.shrink();
}
return Row(
mainAxisSize: MainAxisSize.min,
children: [
_buildNavButton('Drive', Icons.cloud),
const SizedBox(width: 16),
_buildNavButton('Mail', Icons.mail),
const SizedBox(width: 16),
_buildNavButton('Add', Icons.add),
const SizedBox(width: 16),
_buildNavButton(
'Profile',
Icons.person,
isAvatar: true,
),
],
);
},
),
],
),
),
),
),