v2.31 — Login, Einstellungen & Cloud Sync Redesign
- Login-Screen im Melo-Design (Schwarz+Rot) mit Baka-Auth JWT
- AuthService fuer Token-Management ueber baka-net.de/auth
- Registrierungs-Modus + 'Ohne Login fortfahren'
- Navidrome-Credentials optional im Login aufklappbar
- SettingsScreen ersetzt AlertDialog
- BottomNav navigiert statt Dialog zu triggern
- Cloud Sync, Server verbinden, Diagnosedaten, App-Info, Abmelden
- CloudEinstellungen-Dialog entfernt, alles in CloudScreen konsolidiert
- Hardcode login('Baka','') entfernt → AuthService.benutzer
- Gradient-Statuskarte, animierte Segment-Intervall-Auswahl
- JWT Authorization statt Klartext-Passwort
- AppConfig: API-Key defaultValue entfernt (kein Fallback-Leak)
- Build crasht ohne --dart-define MELO_API_KEY
Build: split APK (arm64 19.6M, armeabi 17.1M, x86_64 21.1M)
This commit is contained in:
Dustin
@@ -0,0 +1,231 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import '../config/app_config.dart';
|
||||
import '../utils/farb_theme.dart';
|
||||
import 'cloud_screen.dart';
|
||||
import '../services/cloud_service.dart';
|
||||
|
||||
/// Vollwertiger Einstellungen-Screen – kein Popup mehr
|
||||
class SettingsScreen extends StatefulWidget {
|
||||
const SettingsScreen({super.key});
|
||||
|
||||
@override
|
||||
State<SettingsScreen> createState() => _SettingsScreenState();
|
||||
}
|
||||
|
||||
class _SettingsScreenState extends State<SettingsScreen> {
|
||||
bool _diagnose = AppConfig.sendeDiagnosedaten;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: MeloTheme.schwarz,
|
||||
appBar: AppBar(
|
||||
backgroundColor: MeloTheme.dunkel1,
|
||||
leading: IconButton(
|
||||
icon: const Icon(Icons.arrow_back, color: Colors.white, size: 22),
|
||||
onPressed: () => Navigator.pop(context),
|
||||
),
|
||||
title: const Row(
|
||||
children: [
|
||||
Icon(Icons.settings, color: MeloTheme.rot, size: 20),
|
||||
SizedBox(width: 10),
|
||||
Text(
|
||||
'Einstellungen',
|
||||
style: TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.w600),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
body: ListView(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
children: [
|
||||
// ─── Sektion: Verbindung ───
|
||||
_sektionHeader('Verbindung'),
|
||||
_einstellungsKachel(
|
||||
icon: Icons.cloud_outlined,
|
||||
titel: 'Cloud Sync',
|
||||
untertitel: 'Auto-Sync, Upload & Download',
|
||||
onTap: () {
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (_) => CloudScreen(cloud: CloudService()),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
_einstellungsKachel(
|
||||
icon: Icons.dns_outlined,
|
||||
titel: 'Server verbinden',
|
||||
untertitel: 'Navidrome Musik-Server',
|
||||
onTap: () {
|
||||
// Signal zum Öffnen des Server-Browsers
|
||||
Navigator.pop(context, 'server');
|
||||
},
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// ─── Sektion: Daten ───
|
||||
_sektionHeader('Daten & Privatsphäre'),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: MeloTheme.dunkel1,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
border: Border.all(color: MeloTheme.dunkel2),
|
||||
),
|
||||
child: SwitchListTile(
|
||||
title: const Text(
|
||||
'Diagnosedaten senden',
|
||||
style: TextStyle(color: Colors.white, fontSize: 14),
|
||||
),
|
||||
subtitle: const Text(
|
||||
'Absturz-Logs & anonyme Nutzungsdaten',
|
||||
style: TextStyle(color: MeloTheme.textSekundaer, fontSize: 12),
|
||||
),
|
||||
value: _diagnose,
|
||||
activeColor: MeloTheme.rot,
|
||||
onChanged: (v) {
|
||||
setState(() => _diagnose = v);
|
||||
AppConfig.sendeDiagnosedaten = v;
|
||||
},
|
||||
secondary: const Icon(Icons.bug_report_outlined, color: MeloTheme.rot, size: 22),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// ─── Sektion: Info ───
|
||||
_sektionHeader('Info'),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: MeloTheme.dunkel1,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
border: Border.all(color: MeloTheme.dunkel2),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
_infoZeile('Version', '2.31'),
|
||||
const Divider(color: MeloTheme.dunkel2, height: 1),
|
||||
_infoZeile('Theme', 'Schwarz + Rot'),
|
||||
const Divider(color: MeloTheme.dunkel2, height: 1),
|
||||
_infoZeile('Auth', AppConfig.authUrl),
|
||||
const Divider(color: MeloTheme.dunkel2, height: 1),
|
||||
_infoZeile('Cloud', AppConfig.cloudUrl),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// ─── Abmelden ───
|
||||
SizedBox(
|
||||
width: double.infinity,
|
||||
height: 48,
|
||||
child: OutlinedButton.icon(
|
||||
onPressed: () {
|
||||
Navigator.pop(context, 'logout');
|
||||
},
|
||||
icon: const Icon(Icons.logout, size: 18),
|
||||
label: const Text('Abmelden', style: TextStyle(fontSize: 14)),
|
||||
style: OutlinedButton.styleFrom(
|
||||
foregroundColor: MeloTheme.rot,
|
||||
side: const BorderSide(color: MeloTheme.rot),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14)),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _sektionHeader(String titel) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(4, 16, 4, 8),
|
||||
child: Text(
|
||||
titel,
|
||||
style: const TextStyle(
|
||||
color: MeloTheme.textSekundaer,
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w600,
|
||||
letterSpacing: 1.2,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _einstellungsKachel({
|
||||
required IconData icon,
|
||||
required String titel,
|
||||
required String untertitel,
|
||||
required VoidCallback onTap,
|
||||
}) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 8),
|
||||
child: Material(
|
||||
color: MeloTheme.dunkel1,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
border: Border.all(color: MeloTheme.dunkel2),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
color: MeloTheme.dunkel2,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Icon(icon, color: MeloTheme.rot, size: 20),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
titel,
|
||||
style: const TextStyle(color: Colors.white, fontSize: 14, fontWeight: FontWeight.w500),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
untertitel,
|
||||
style: const TextStyle(color: MeloTheme.textSekundaer, fontSize: 12),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const Icon(Icons.chevron_right, color: MeloTheme.textSekundaer, size: 20),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _infoZeile(String label, String wert) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: const TextStyle(color: MeloTheme.textSekundaer, fontSize: 13),
|
||||
),
|
||||
const Spacer(),
|
||||
Text(
|
||||
wert,
|
||||
style: const TextStyle(color: Colors.white70, fontSize: 13),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user