josiadmin/flutter-template-getx-provider
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add home page and navigation

Browse Source
This commit is contained in:
Josef Seiringer
2025-11-03 13:45:43 +01:00
parent 212f5726db
commit 3aa7610867
9 changed files with 268 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
lib/pages/home/home_view.dart Normal file
View File

@@ -0,0 +1,49 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../controllers/home_controller.dart';
class HomePage extends GetView<HomeController> {
static const String namedRoute = '/home';
const HomePage({super.key});
@override
Widget build(BuildContext context) {
var homeCtrl = controller;
return PopScope(
canPop: false,
child: SafeArea(
child: Scaffold(
appBar: AppBar(
backgroundColor: Colors.grey.shade500,
leading: IconButton(
icon: Icon(Icons.arrow_back, color: Colors.grey.shade200),
onPressed: () {
// Verhindert das Zurücknavigieren
homeCtrl.goToLoginPage();
},
),
title: Text(
homeCtrl.szHeaderHome.value,
style: TextStyle(color: Colors.grey.shade200),
),
centerTitle: true,
),
body: Container(
decoration: BoxDecoration(color: Colors.grey.shade400),
padding: EdgeInsets.all(20),
child: Center(
child: Text(
'You are on the Home Page...\nPress the back arrow to logout.\nThis is a Template to use...',
style: TextStyle(
color: Colors.grey.shade800,
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
),
),
),
),
);
}
}

9
lib/pages/login/login_binding.dart
View File

@@ -1,9 +0,0 @@
import 'package:get/get.dart';
import '../../controllers/login_controller.dart';
class LoginBinding extends Bindings {
@override
void dependencies() {
Get.lazyPut<LoginController>(() => LoginController());
}
}

263
lib/pages/login/login_view.dart
View File

@@ -9,106 +9,149 @@ class LoginPage extends GetView<LoginController> {
@override
Widget build(BuildContext context) {
var loginCtrl = controller;
// LayoutBuilder ermöglicht dynamische Anpassung an verschiedene Bildschirmgrößen.
return SafeArea(
child: Scaffold(
body: Center(
child: SingleChildScrollView(
child: Container(
width: Get.width * 0.6,
padding: const EdgeInsets.all(40.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: const Color.fromARGB(64, 189, 189, 189),
),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
color: Colors.white.withAlpha(150),
borderRadius: BorderRadius.circular(100),
),
child: Obx(
() => loginCtrl.isLoginScreen.value
? IconButton(
onPressed: () => loginCtrl.logout(),
icon: Icon(Icons.login, size: 80),
color: Colors.pink.shade700,
)
: IconButton(
onPressed: () => loginCtrl.logout(),
icon: Icon(Icons.app_registration, size: 80),
color: Colors.pink.shade700,
),
),
body: LayoutBuilder(
builder: (context, constraints) {
final bool isSmall = constraints.maxWidth < 600;
final double cardWidth = isSmall
? constraints.maxWidth * 0.92
: (constraints.maxWidth * 0.6).clamp(0, 900);
return Stack(
children: [
// Hintergrundbild skaliert responsiv mit BoxFit.cover
Positioned.fill(
child: Image.asset(
'img/backgroundLogoInternorm.jpg',
fit: BoxFit.cover,
alignment: Alignment.center,
),
SizedBox(height: 80),
Obx(
() => loginCtrl.isLoginScreen.value
? Text(
loginCtrl.szHeaderLogin.value,
style: Theme.of(context).textTheme.headlineMedium,
)
: Text(
loginCtrl.szHeaderSignin.value,
style: Theme.of(context).textTheme.headlineMedium,
),
),
// halbtransparente Ebene; Opazität an Bildschirmgröße anpassen
Positioned.fill(
child: Container(
color: Colors.black.withAlpha(isSmall ? 50 : 100),
),
SizedBox(height: 40),
Form(
key: loginCtrl.loginFormKey,
child: Column(
children: [
Obx(
() => loginCtrl.isLoginScreen.value
? const SizedBox.shrink()
: _nameFormField(loginCtrl),
),
Center(
child: PopScope(
canPop: false,
child: SingleChildScrollView(
child: AnimatedContainer(
duration: const Duration(milliseconds: 250),
width: cardWidth,
padding: const EdgeInsets.all(40.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: const Color.fromARGB(223, 189, 189, 189),
),
SizedBox(height: 20),
_emailFormField(loginCtrl),
SizedBox(height: 20),
_passwdFormField(loginCtrl),
SizedBox(height: 40),
ElevatedButton(
onPressed: () {
// Handle login or signin action
loginCtrl.logOrSignIn();
},
child: Obx(
() => loginCtrl.isLoginScreen.value
? const Text('Login')
: const Text('Signin'),
),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
color: Colors.white.withAlpha(200),
borderRadius: BorderRadius.circular(100),
),
child: Obx(
() => loginCtrl.isLoginScreen.value
? IconButton(
onPressed: () => loginCtrl.logout(),
icon: const Icon(Icons.login, size: 80),
color: const Color.fromARGB(
255,
255,
0,
0,
),
)
: IconButton(
onPressed: () => loginCtrl.logout(),
icon: const Icon(
Icons.app_registration,
size: 80,
),
color: const Color.fromARGB(
255,
255,
0,
0,
),
),
),
),
const SizedBox(height: 80),
Obx(
() => loginCtrl.isLoginScreen.value
? Text(
loginCtrl.szHeaderLogin.value,
style: Theme.of(
context,
).textTheme.headlineMedium,
)
: Text(
loginCtrl.szHeaderSignin.value,
style: Theme.of(
context,
).textTheme.headlineMedium,
),
),
const SizedBox(height: 40),
Form(
key: loginCtrl.loginFormKey,
child: Column(
children: [
Obx(
() => loginCtrl.isLoginScreen.value
? const SizedBox.shrink()
: _nameFormField(loginCtrl),
),
const SizedBox(height: 20),
_emailFormField(loginCtrl),
const SizedBox(height: 20),
_passwdFormField(loginCtrl),
const SizedBox(height: 40),
_logOrSignInButton(loginCtrl),
],
),
),
const SizedBox(height: 10),
Obx(
() => loginCtrl.isLoginScreen.value
? TextButton(
child: Text(
'To Signin',
style: TextStyle(
color: Colors.blue.shade800,
),
),
onPressed: () {
loginCtrl.switchScreen();
},
)
: TextButton(
child: Text(
'To Login',
style: TextStyle(
color: Colors.blue.shade800,
),
),
onPressed: () {
loginCtrl.switchScreen();
},
),
),
],
),
],
),
),
),
SizedBox(height: 10),
Obx(
() => loginCtrl.isLoginScreen.value
? TextButton(
child: Text(
'To Signin',
style: TextStyle(color: Colors.blue.shade500),
),
onPressed: () {
loginCtrl.switchScreen();
},
)
: TextButton(
child: Text(
'To Login',
style: TextStyle(color: Colors.blue.shade500),
),
onPressed: () {
loginCtrl.switchScreen();
},
),
),
],
),
),
),
),
],
);
},
),
),
);
@@ -147,13 +190,45 @@ class LoginPage extends GetView<LoginController> {
return InputDecoration(
labelText: labelText,
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.pink.shade700),
borderSide: BorderSide(color: const Color.fromARGB(255, 255, 0, 0)),
borderRadius: BorderRadius.circular(5.0),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.pink.shade400),
borderSide: BorderSide(color: const Color.fromARGB(255, 255, 0, 0)),
borderRadius: BorderRadius.circular(5.0),
),
);
}
ElevatedButton _logOrSignInButton(LoginController loginCtrl) {
return ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: const Color.fromARGB(255, 255, 0, 0),
minimumSize: const Size(double.infinity, 50),
),
onPressed: () {
// Handle login or signin action
loginCtrl.logOrSignIn();
},
child: Obx(
() => loginCtrl.isLoginScreen.value
? const Text(
'Login',
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold,
),
)
: const Text(
'Signin',
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
);
}
}