Initial commit: Eventify frontend
This commit is contained in:
Rishad7594
946
lib/screens/home_screen.dart
Normal file
946
lib/screens/home_screen.dart
Normal file
@@ -0,0 +1,946 @@
|
||||
// lib/screens/home_screen.dart
|
||||
import 'dart:async';
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:shared_preferences/shared_preferences.dart';
|
||||
|
||||
import '../features/events/models/event_models.dart';
|
||||
import '../features/events/services/events_service.dart';
|
||||
import 'calendar_screen.dart';
|
||||
import 'profile_screen.dart';
|
||||
import 'contribute_screen.dart';
|
||||
import 'learn_more_screen.dart';
|
||||
import 'search_screen.dart';
|
||||
import '../core/app_decoration.dart';
|
||||
|
||||
class HomeScreen extends StatefulWidget {
|
||||
const HomeScreen({Key? key}) : super(key: key);
|
||||
@override
|
||||
_HomeScreenState createState() => _HomeScreenState();
|
||||
}
|
||||
|
||||
/// Main screen that hosts 4 tabs in an IndexedStack (Home, Calendar, Contribute, Profile).
|
||||
class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateMixin {
|
||||
int _selectedIndex = 0;
|
||||
String _username = '';
|
||||
String _location = '';
|
||||
String _pincode = 'all';
|
||||
|
||||
final EventsService _eventsService = EventsService();
|
||||
|
||||
// backend-driven
|
||||
List<EventModel> _events = [];
|
||||
List<EventTypeModel> _types = [];
|
||||
int _selectedTypeId = -1; // -1 == All
|
||||
|
||||
bool _loading = true;
|
||||
|
||||
// Hero carousel
|
||||
final PageController _heroPageController = PageController();
|
||||
int _heroCurrentPage = 0;
|
||||
Timer? _autoScrollTimer;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_loadUserDataAndEvents();
|
||||
_startAutoScroll();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_autoScrollTimer?.cancel();
|
||||
_heroPageController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _startAutoScroll() {
|
||||
_autoScrollTimer?.cancel();
|
||||
_autoScrollTimer = Timer.periodic(const Duration(seconds: 3), (timer) {
|
||||
if (_heroEvents.isEmpty) return;
|
||||
final nextPage = (_heroCurrentPage + 1) % _heroEvents.length;
|
||||
if (_heroPageController.hasClients) {
|
||||
_heroPageController.animateToPage(
|
||||
nextPage,
|
||||
duration: const Duration(milliseconds: 500),
|
||||
curve: Curves.easeInOut,
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Future<void> _loadUserDataAndEvents() async {
|
||||
setState(() => _loading = true);
|
||||
final prefs = await SharedPreferences.getInstance();
|
||||
_username = prefs.getString('display_name') ?? prefs.getString('username') ?? '';
|
||||
_location = prefs.getString('location') ?? 'Whitefield, Bengaluru';
|
||||
_pincode = prefs.getString('pincode') ?? 'all';
|
||||
|
||||
try {
|
||||
final types = await _events_service_getEventTypesSafe();
|
||||
final events = await _events_service_getEventsSafe(_pincode);
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_types = types;
|
||||
_events = events;
|
||||
_selectedTypeId = -1;
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
if (mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(e.toString())));
|
||||
}
|
||||
} finally {
|
||||
if (mounted) setState(() => _loading = false);
|
||||
}
|
||||
}
|
||||
|
||||
Future<List<EventTypeModel>> _events_service_getEventTypesSafe() async {
|
||||
try {
|
||||
return await _eventsService.getEventTypes();
|
||||
} catch (_) {
|
||||
return <EventTypeModel>[];
|
||||
}
|
||||
}
|
||||
|
||||
Future<List<EventModel>> _events_service_getEventsSafe(String pincode) async {
|
||||
try {
|
||||
return await _eventsService.getEventsByPincode(pincode);
|
||||
} catch (_) {
|
||||
return <EventModel>[];
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _refresh() async {
|
||||
await _loadUserDataAndEvents();
|
||||
}
|
||||
|
||||
void _bookEventAtIndex(int index) {
|
||||
if (index >= 0 && index < _events.length) {
|
||||
setState(() => _events.removeAt(index));
|
||||
}
|
||||
}
|
||||
|
||||
Widget _categoryChip({
|
||||
required String label,
|
||||
required bool selected,
|
||||
required VoidCallback onTap,
|
||||
IconData? icon,
|
||||
}) {
|
||||
final theme = Theme.of(context);
|
||||
return InkWell(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
height: 40,
|
||||
alignment: Alignment.center,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: selected ? theme.colorScheme.primary : theme.cardColor,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(
|
||||
color: selected ? theme.colorScheme.primary : theme.dividerColor,
|
||||
width: 1,
|
||||
),
|
||||
boxShadow: selected
|
||||
? [
|
||||
BoxShadow(
|
||||
color: theme.colorScheme.primary.withOpacity(0.3),
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 4),
|
||||
)
|
||||
]
|
||||
: [],
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
if (icon != null) ...[
|
||||
Icon(icon, size: 16, color: selected ? Colors.white : theme.colorScheme.primary),
|
||||
const SizedBox(width: 6),
|
||||
],
|
||||
Text(
|
||||
label,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: selected ? Colors.white : theme.textTheme.bodyLarge?.color,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _openLocationSearch() async {
|
||||
final selected = await Navigator.of(context).push(PageRouteBuilder(
|
||||
opaque: false,
|
||||
pageBuilder: (context, animation, secondaryAnimation) => const SearchScreen(),
|
||||
transitionsBuilder: (context, animation, secondaryAnimation, child) {
|
||||
return FadeTransition(opacity: animation, child: child);
|
||||
},
|
||||
transitionDuration: const Duration(milliseconds: 220),
|
||||
));
|
||||
|
||||
if (selected != null && selected is String) {
|
||||
final prefs = await SharedPreferences.getInstance();
|
||||
await prefs.setString('location', selected);
|
||||
setState(() {
|
||||
_location = selected;
|
||||
});
|
||||
await _refresh();
|
||||
}
|
||||
}
|
||||
|
||||
void _openEventSearch() {
|
||||
final theme = Theme.of(context);
|
||||
showModalBottomSheet(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
backgroundColor: Colors.transparent,
|
||||
builder: (ctx) {
|
||||
return DraggableScrollableSheet(
|
||||
expand: false,
|
||||
initialChildSize: 0.6,
|
||||
minChildSize: 0.3,
|
||||
maxChildSize: 0.95,
|
||||
builder: (context, scrollController) {
|
||||
String query = '';
|
||||
List<EventModel> results = List.from(_events);
|
||||
return StatefulBuilder(builder: (context, setModalState) {
|
||||
void _onQueryChanged(String v) {
|
||||
query = v.trim().toLowerCase();
|
||||
final r = _events.where((e) {
|
||||
final title = (e.title ?? e.name ?? '').toLowerCase();
|
||||
return title.contains(query);
|
||||
}).toList();
|
||||
setModalState(() {
|
||||
results = r;
|
||||
});
|
||||
}
|
||||
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
color: theme.cardColor,
|
||||
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
|
||||
),
|
||||
child: SafeArea(
|
||||
top: false,
|
||||
child: SingleChildScrollView(
|
||||
controller: scrollController,
|
||||
padding: const EdgeInsets.fromLTRB(16, 12, 16, 24),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Center(
|
||||
child: Container(
|
||||
width: 48,
|
||||
height: 6,
|
||||
decoration: BoxDecoration(color: theme.dividerColor, borderRadius: BorderRadius.circular(6)),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Container(
|
||||
height: 48,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
decoration: BoxDecoration(color: theme.cardColor, borderRadius: BorderRadius.circular(12), border: Border.all(color: theme.dividerColor)),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.search, color: theme.hintColor),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
style: theme.textTheme.bodyLarge,
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search events by name',
|
||||
hintStyle: theme.textTheme.bodyMedium?.copyWith(color: theme.hintColor),
|
||||
border: InputBorder.none,
|
||||
),
|
||||
autofocus: true,
|
||||
onChanged: _onQueryChanged,
|
||||
textInputAction: TextInputAction.search,
|
||||
onSubmitted: (v) => _onQueryChanged(v),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
IconButton(
|
||||
icon: Icon(Icons.close, color: theme.iconTheme.color),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
)
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
if (_loading)
|
||||
Center(child: CircularProgressIndicator(color: theme.colorScheme.primary))
|
||||
else if (results.isEmpty)
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 24),
|
||||
child: Center(child: Text(query.isEmpty ? 'Type to search events' : 'No events found', style: theme.textTheme.bodyMedium?.copyWith(color: theme.hintColor))),
|
||||
)
|
||||
else
|
||||
ListView.separated(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemBuilder: (ctx, idx) {
|
||||
final ev = results[idx];
|
||||
final img = (ev.thumbImg != null && ev.thumbImg!.isNotEmpty) ? ev.thumbImg! : (ev.images.isNotEmpty ? ev.images.first.image : null);
|
||||
final title = ev.title ?? ev.name ?? '';
|
||||
final subtitle = ev.startDate ?? '';
|
||||
return ListTile(
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 0, vertical: 8),
|
||||
leading: img != null && img.isNotEmpty
|
||||
? ClipRRect(borderRadius: BorderRadius.circular(8), child: Image.network(img, width: 56, height: 56, fit: BoxFit.cover))
|
||||
: Container(width: 56, height: 56, decoration: BoxDecoration(color: theme.dividerColor, borderRadius: BorderRadius.circular(8)), child: Icon(Icons.event, color: theme.hintColor)),
|
||||
title: Text(title, maxLines: 1, overflow: TextOverflow.ellipsis, style: theme.textTheme.bodyLarge),
|
||||
subtitle: Text(subtitle, maxLines: 1, overflow: TextOverflow.ellipsis, style: theme.textTheme.bodyMedium?.copyWith(color: theme.hintColor)),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop();
|
||||
if (ev.id != null) {
|
||||
Navigator.of(context).push(MaterialPageRoute(builder: (_) => LearnMoreScreen(eventId: ev.id)));
|
||||
}
|
||||
},
|
||||
);
|
||||
},
|
||||
separatorBuilder: (_, __) => Divider(color: theme.dividerColor),
|
||||
itemCount: results.length,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
});
|
||||
},
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: theme.scaffoldBackgroundColor,
|
||||
body: Stack(
|
||||
children: [
|
||||
// IndexedStack keeps each tab alive and preserves state.
|
||||
IndexedStack(
|
||||
index: _selectedIndex,
|
||||
children: [
|
||||
_buildHomeContent(), // index 0
|
||||
const CalendarScreen(), // index 1
|
||||
const ContributeScreen(), // index 2 (full page, scrollable)
|
||||
const ProfileScreen(), // index 3
|
||||
],
|
||||
),
|
||||
|
||||
// Floating bottom navigation (always visible)
|
||||
Positioned(
|
||||
left: 16,
|
||||
right: 16,
|
||||
bottom: 16,
|
||||
child: _buildFloatingBottomNav(),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildFloatingBottomNav() {
|
||||
final theme = Theme.of(context);
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.cardColor,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
boxShadow: [BoxShadow(color: theme.shadowColor.withOpacity(0.06), blurRadius: 12)],
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||
children: [
|
||||
_bottomNavItem(0, Icons.home, 'Home'),
|
||||
_bottomNavItem(1, Icons.calendar_today, 'Calendar'),
|
||||
_bottomNavItem(2, Icons.volunteer_activism, 'Contribute'),
|
||||
_bottomNavItem(3, Icons.person, 'Profile'),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _bottomNavItem(int index, IconData icon, String label) {
|
||||
final theme = Theme.of(context);
|
||||
bool active = _selectedIndex == index;
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_selectedIndex = index;
|
||||
});
|
||||
},
|
||||
child: Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: active ? theme.colorScheme.primary.withOpacity(0.08) : Colors.transparent,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(icon, color: active ? theme.colorScheme.primary : theme.iconTheme.color),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(label, style: theme.textTheme.bodySmall?.copyWith(color: active ? theme.colorScheme.primary : theme.iconTheme.color, fontSize: 12)),
|
||||
]),
|
||||
);
|
||||
}
|
||||
|
||||
// Get hero events (first 4 events for the carousel)
|
||||
List<EventModel> get _heroEvents => _events.take(4).toList();
|
||||
|
||||
Widget _buildHomeContent() {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
// Get current hero event image for full-screen blurred background
|
||||
String? currentBgImage;
|
||||
if (_heroEvents.isNotEmpty && _heroCurrentPage < _heroEvents.length) {
|
||||
final event = _heroEvents[_heroCurrentPage];
|
||||
if (event.thumbImg != null && event.thumbImg!.isNotEmpty) {
|
||||
currentBgImage = event.thumbImg;
|
||||
} else if (event.images.isNotEmpty && event.images.first.image.isNotEmpty) {
|
||||
currentBgImage = event.images.first.image;
|
||||
}
|
||||
}
|
||||
|
||||
return Stack(
|
||||
children: [
|
||||
// Full-screen blurred background of current event image OR the AppDecoration blue gradient if no image
|
||||
Positioned.fill(
|
||||
child: currentBgImage != null
|
||||
? Image.network(
|
||||
currentBgImage,
|
||||
fit: BoxFit.cover,
|
||||
errorBuilder: (context, error, stackTrace) => Container(decoration: AppDecoration.blueGradient),
|
||||
)
|
||||
: Container(
|
||||
decoration: AppDecoration.blueGradient,
|
||||
),
|
||||
),
|
||||
|
||||
// Blur overlay on background (applies both when an image is present and when using the blue gradient)
|
||||
Positioned.fill(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 40, sigmaY: 40),
|
||||
child: Container(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Hero section with cards
|
||||
_buildHeroSection(),
|
||||
|
||||
// Draggable bottom sheet
|
||||
DraggableScrollableSheet(
|
||||
initialChildSize: 0.28,
|
||||
minChildSize: 0.22,
|
||||
maxChildSize: 0.92,
|
||||
builder: (context, scrollController) {
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
color: theme.scaffoldBackgroundColor,
|
||||
borderRadius: const BorderRadius.vertical(top: Radius.circular(28)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, -5),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: _buildSheetContent(scrollController),
|
||||
);
|
||||
},
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeroSection() {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
// 0.5 cm gap approximation in logical pixels (approx. 32)
|
||||
const double gapBetweenLocationAndHero = 32.0;
|
||||
|
||||
return SafeArea(
|
||||
bottom: false,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// Top bar with location and search
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 12, 16, 0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
// Location pill
|
||||
GestureDetector(
|
||||
onTap: _openLocationSearch,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.2),
|
||||
borderRadius: BorderRadius.circular(25),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.3)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.location_on_outlined, color: Colors.white, size: 18),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
_location.length > 20 ? '${_location.substring(0, 20)}...' : _location,
|
||||
style: const TextStyle(color: Colors.white, fontSize: 14, fontWeight: FontWeight.w500),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
const Icon(Icons.keyboard_arrow_down, color: Colors.white, size: 18),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
// Search button
|
||||
GestureDetector(
|
||||
onTap: _openEventSearch,
|
||||
child: Container(
|
||||
width: 48,
|
||||
height: 48,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.2),
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.white.withOpacity(0.3)),
|
||||
),
|
||||
child: const Icon(Icons.search, color: Colors.white, size: 24),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// 0.5 cm gap (approx. 32 logical pixels)
|
||||
const SizedBox(height: gapBetweenLocationAndHero),
|
||||
|
||||
// Hero image carousel (PageView) and fixed indicators under it.
|
||||
_heroEvents.isEmpty
|
||||
? SizedBox(
|
||||
height: 360,
|
||||
child: Center(
|
||||
child: _loading ? const CircularProgressIndicator(color: Colors.white) : const Text('No events available', style: TextStyle(color: Colors.white70)),
|
||||
),
|
||||
)
|
||||
: Column(
|
||||
children: [
|
||||
// PageView with only the images/titles
|
||||
SizedBox(
|
||||
height: 360,
|
||||
child: PageView.builder(
|
||||
controller: _heroPageController,
|
||||
onPageChanged: (page) {
|
||||
setState(() => _heroCurrentPage = page);
|
||||
},
|
||||
itemCount: _heroEvents.length,
|
||||
itemBuilder: (context, index) {
|
||||
return _buildHeroEventImage(_heroEvents[index]);
|
||||
},
|
||||
),
|
||||
),
|
||||
|
||||
// fixed indicators (outside PageView)
|
||||
const SizedBox(height: 12),
|
||||
SizedBox(
|
||||
height: 28,
|
||||
child: Center(
|
||||
child: AnimatedBuilder(
|
||||
animation: _heroPageController,
|
||||
builder: (context, child) {
|
||||
double page = _heroCurrentPage.toDouble();
|
||||
if (_heroPageController.hasClients) {
|
||||
page = _heroPageController.page ?? page;
|
||||
}
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: List.generate(_heroEvents.length, (i) {
|
||||
final dx = (i - page).abs();
|
||||
final t = 1.0 - dx.clamp(0.0, 1.0); // 1 when focused, 0 when far
|
||||
final width = 10 + (36 - 10) * t; // interpolate between 10 and 36
|
||||
final opacity = 0.35 + (0.65 * t);
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
if (_heroPageController.hasClients) {
|
||||
_heroPageController.animateToPage(
|
||||
i,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
);
|
||||
}
|
||||
},
|
||||
child: Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: 8),
|
||||
width: width,
|
||||
height: 10,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(opacity),
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
),
|
||||
),
|
||||
);
|
||||
}),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// spacing so the sheet handle doesn't overlap the indicator
|
||||
const SizedBox(height: 8),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// Build a hero image card (image + gradient + title).
|
||||
/// If there's no image, show the AppDecoration blue gradient rounded background
|
||||
/// and a black overlay gradient for contrast.
|
||||
Widget _buildHeroEventImage(EventModel event) {
|
||||
String? img;
|
||||
if (event.thumbImg != null && event.thumbImg!.isNotEmpty) {
|
||||
img = event.thumbImg;
|
||||
} else if (event.images.isNotEmpty && event.images.first.image.isNotEmpty) {
|
||||
img = event.images.first.image;
|
||||
}
|
||||
|
||||
final radius = 24.0;
|
||||
final startDate = event.startDate ?? '';
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
if (event.id != null) {
|
||||
Navigator.push(context, MaterialPageRoute(builder: (_) => LearnMoreScreen(eventId: event.id)));
|
||||
}
|
||||
},
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(radius),
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
// If image available show it; otherwise use AppDecoration blue gradient.
|
||||
if (img != null && img.isNotEmpty)
|
||||
Image.network(
|
||||
img,
|
||||
fit: BoxFit.cover,
|
||||
errorBuilder: (context, error, stackTrace) => Container(decoration: AppDecoration.blueGradientRounded(radius)),
|
||||
)
|
||||
else
|
||||
Container(
|
||||
decoration: AppDecoration.blueGradientRounded(radius),
|
||||
),
|
||||
|
||||
// BLACK gradient overlay to darken bottom area for text (stronger to match your reference)
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.bottomCenter,
|
||||
end: Alignment.topCenter,
|
||||
colors: [
|
||||
Colors.black.withOpacity(0.72), // strong black near bottom for contrast
|
||||
Colors.black.withOpacity(0.38),
|
||||
Colors.black.withOpacity(0.08), // subtle near top
|
||||
],
|
||||
stops: const [0.0, 0.45, 1.0],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Title and date positioned bottom-left
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(20, 20, 20, 18),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
if (startDate.isNotEmpty)
|
||||
Text(
|
||||
startDate,
|
||||
style: TextStyle(
|
||||
color: Colors.white.withOpacity(0.9),
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
if (startDate.isNotEmpty) const SizedBox(height: 8),
|
||||
Text(
|
||||
event.title ?? event.name ?? '',
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 22,
|
||||
fontWeight: FontWeight.bold,
|
||||
height: 1.1,
|
||||
shadows: [
|
||||
Shadow(color: Colors.black38, blurRadius: 6, offset: Offset(0, 2)),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSheetContent(ScrollController scrollController) {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return ListView(
|
||||
controller: scrollController,
|
||||
padding: EdgeInsets.zero,
|
||||
children: [
|
||||
// Drag handle and "see more" text
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 12, bottom: 8),
|
||||
child: Column(
|
||||
children: [
|
||||
// Arrow up icon
|
||||
Icon(
|
||||
Icons.keyboard_arrow_up,
|
||||
color: theme.hintColor,
|
||||
size: 28,
|
||||
),
|
||||
Text(
|
||||
'see more',
|
||||
style: TextStyle(
|
||||
color: theme.hintColor,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// "Events Around You" header
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(20, 12, 20, 16),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'Events Around You',
|
||||
style: theme.textTheme.titleLarge?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 22,
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () {
|
||||
// View all action
|
||||
},
|
||||
child: Text(
|
||||
'View All',
|
||||
style: TextStyle(
|
||||
color: theme.colorScheme.primary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Category chips
|
||||
SizedBox(
|
||||
height: 48,
|
||||
child: ListView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
children: [
|
||||
_categoryChip(
|
||||
label: 'All Events',
|
||||
icon: Icons.grid_view_rounded,
|
||||
selected: _selectedTypeId == -1,
|
||||
onTap: () => _onSelectType(-1),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
for (final t in _types) ...[
|
||||
_categoryChip(
|
||||
label: t.name,
|
||||
icon: _getIconForType(t.name),
|
||||
selected: _selectedTypeId == t.id,
|
||||
onTap: () => _onSelectType(t.id),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Event cards
|
||||
if (_loading)
|
||||
const Padding(
|
||||
padding: EdgeInsets.all(40),
|
||||
child: Center(child: CircularProgressIndicator()),
|
||||
)
|
||||
else if (_events.isEmpty)
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(40),
|
||||
child: Center(
|
||||
child: Text(
|
||||
'No events found',
|
||||
style: theme.textTheme.bodyLarge?.copyWith(color: theme.hintColor),
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Column(
|
||||
children: [
|
||||
for (int i = 0; i < _events.length; i++) ...[
|
||||
_buildEventCard(_events[i], i),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Bottom padding for nav bar
|
||||
const SizedBox(height: 100),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
IconData _getIconForType(String typeName) {
|
||||
final name = typeName.toLowerCase();
|
||||
if (name.contains('music')) return Icons.music_note;
|
||||
if (name.contains('art') || name.contains('comedy')) return Icons.palette;
|
||||
if (name.contains('festival')) return Icons.celebration;
|
||||
if (name.contains('heritage') || name.contains('history')) return Icons.account_balance;
|
||||
if (name.contains('sport')) return Icons.sports;
|
||||
if (name.contains('food')) return Icons.restaurant;
|
||||
return Icons.event;
|
||||
}
|
||||
|
||||
void _onSelectType(int id) async {
|
||||
setState(() {
|
||||
_selectedTypeId = id;
|
||||
});
|
||||
|
||||
try {
|
||||
final all = await _eventsService.getEventsByPincode(_pincode);
|
||||
final filtered = id == -1 ? all : all.where((e) => e.eventTypeId == id).toList();
|
||||
if (mounted) setState(() => _events = filtered);
|
||||
} catch (e) {
|
||||
if (mounted) ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(e.toString())));
|
||||
}
|
||||
}
|
||||
|
||||
Widget _buildEventCard(EventModel e, int index) {
|
||||
final theme = Theme.of(context);
|
||||
String? img;
|
||||
if (e.thumbImg != null && e.thumbImg!.isNotEmpty) {
|
||||
img = e.thumbImg;
|
||||
} else if (e.images.isNotEmpty && e.images.first.image.isNotEmpty) {
|
||||
img = e.images.first.image;
|
||||
}
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
if (e.id != null) {
|
||||
Navigator.push(context, MaterialPageRoute(builder: (_) => LearnMoreScreen(eventId: e.id)));
|
||||
}
|
||||
},
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(bottom: 18),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.cardColor,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(color: theme.shadowColor.withOpacity(0.12), blurRadius: 18, offset: const Offset(0, 8)),
|
||||
BoxShadow(color: theme.shadowColor.withOpacity(0.04), blurRadius: 6, offset: const Offset(0, 2)),
|
||||
],
|
||||
),
|
||||
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
|
||||
ClipRRect(
|
||||
borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
|
||||
child: img != null && img.isNotEmpty
|
||||
? Image.network(img, fit: BoxFit.cover, width: double.infinity, height: 160)
|
||||
: Image.asset('assets/images/event1.jpg', fit: BoxFit.cover, width: double.infinity, height: 160),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(12, 12, 12, 12),
|
||||
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
|
||||
Text(
|
||||
e.title ?? e.name ?? '',
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: theme.textTheme.titleMedium?.copyWith(fontWeight: FontWeight.bold, fontSize: 16),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.calendar_today, size: 14, color: theme.colorScheme.primary),
|
||||
const SizedBox(width: 6),
|
||||
Flexible(
|
||||
flex: 2,
|
||||
child: Text(
|
||||
'${e.startDate ?? ''}',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: theme.textTheme.bodySmall?.copyWith(color: theme.textTheme.bodySmall?.color?.withOpacity(0.9), fontSize: 13),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8.0),
|
||||
child: Text('•', style: TextStyle(color: theme.textTheme.bodySmall?.color?.withOpacity(0.4))),
|
||||
),
|
||||
Icon(Icons.location_on, size: 14, color: theme.colorScheme.primary),
|
||||
const SizedBox(width: 6),
|
||||
Flexible(
|
||||
flex: 3,
|
||||
child: Text(
|
||||
e.place ?? '',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: theme.textTheme.bodySmall?.copyWith(color: theme.textTheme.bodySmall?.color?.withOpacity(0.9), fontSize: 13),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
]),
|
||||
)
|
||||
]),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _getShortEmailLabel() {
|
||||
try {
|
||||
final parts = _username.split('@');
|
||||
if (parts.isNotEmpty && parts[0].isNotEmpty) return parts[0];
|
||||
} catch (_) {}
|
||||
return 'You';
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user