add home page and navigation

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

Binary file not shown.

After

Width:  |  Height:  |  Size: 411 KiB

View File

@ -0,0 +1,32 @@
import 'package:get/get.dart';
import '../pages/login/login_view.dart';
import '../services/appwrite_service.dart';
class HomeController extends GetxController {
final szHeaderHome = 'Home Page'.obs;
late AppWriteProvider appwriteProvider;
@override
void onInit() {
appwriteProvider = AppWriteProvider();
super.onInit();
}
@override
void onReady() {}
@override
void onClose() {}
void goToLoginPage() async {
if (await appwriteProvider.logout()) {
Get.snackbar(
'Logout Successful',
'You have been logged out successfully.',
snackPosition: SnackPosition.BOTTOM,
);
await Get.offAllNamed(LoginPage.namedRoute);
}
}
}

View File

@ -1,8 +1,10 @@
import 'package:appwrite/models.dart';
import 'package:flutter/material.dart';
import 'package:flutter_template_getx_provider/services/appwrite_service.dart';
import 'package:get/get.dart';
import '../pages/home/home_view.dart';
import '../services/appwrite_service.dart';
class LoginController extends GetxController {
final szHeaderLogin = 'Login Page'.obs;
final szHeaderSignin = 'Signin Page'.obs;
@ -65,6 +67,8 @@ class LoginController extends GetxController {
'You have been logged in successfully.',
snackPosition: SnackPosition.BOTTOM,
);
// Navigate to home or another page if needed
_goToHomePage();
} else {
Get.snackbar(
'Login Failed',
@ -142,4 +146,8 @@ class LoginController extends GetxController {
}
return isLoggedOut;
}
void _goToHomePage() async {
await Get.offAllNamed(HomePage.namedRoute);
}
}

View File

@ -1,5 +1,6 @@
import 'package:get/get.dart';
import '../controllers/home_controller.dart';
import '../controllers/login_controller.dart';
@ -9,6 +10,7 @@ class SampleBindings extends Bindings {
void dependencies() {
// Define your dependencies here
Get.lazyPut<LoginController>(() => LoginController());
Get.lazyPut<HomeController>(() => HomeController());
}
}

View File

@ -1,4 +1,5 @@
import 'package:get/get.dart';
import '../pages/home/home_view.dart';
import '../pages/login/login_view.dart';
import './sample_bindings.dart';
@ -13,6 +14,11 @@ class SampleRouts {
page: () => const LoginPage(),
binding: sampleBindings,
),
GetPage(
name: HomePage.namedRoute,
page: () => const HomePage(),
binding: sampleBindings,
),
];

View 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,
),
),
),
),
),
),
);
}
}

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());
}
}

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,
),
),
),
);
}
}