294 lines
15 KiB
Dart
294 lines
15 KiB
Dart
import 'package:bahla_front/ui/common/ReadMoreText.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:stacked/stacked.dart';
|
|
|
|
import 'event_details_viewmodel.dart';
|
|
import '../../common/post_card_widget.dart';
|
|
|
|
class EventDetailsView extends StackedView<EventDetailsViewModel> {
|
|
final int eventId;
|
|
const EventDetailsView({Key? key, required this.eventId}) : super(key: key);
|
|
|
|
@override
|
|
Widget builder(
|
|
BuildContext context,
|
|
EventDetailsViewModel viewModel,
|
|
Widget? child,
|
|
) {
|
|
return PopScope(
|
|
canPop: true,
|
|
onPopInvokedWithResult: (bool didPop, Object? result) {
|
|
viewModel.onBackPressed();
|
|
},
|
|
child: Stack(
|
|
children: [
|
|
DefaultTabController(
|
|
length: 2,
|
|
child: Scaffold(
|
|
backgroundColor: Colors.white,
|
|
body: NestedScrollView(
|
|
headerSliverBuilder: (context, innerBoxIsScrolled) => [
|
|
SliverToBoxAdapter(
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
width: double.infinity,
|
|
height: MediaQuery.of(context).size.width * 9 / 16,
|
|
child: const Image(
|
|
image: AssetImage('assets/images/Affiche.jpg'),
|
|
fit: BoxFit.cover,
|
|
alignment: Alignment.center,
|
|
),
|
|
),
|
|
Container(
|
|
color: Colors.white,
|
|
padding: const EdgeInsets.only(left: 16.0, right: 16.0, top: 16.0, bottom: 0.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
// Titre de l'événement
|
|
Text(
|
|
'Disc\'Octonelle 2',
|
|
style: Theme.of(context).textTheme.headlineLarge?.copyWith(
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Center(
|
|
child: Container(
|
|
width: MediaQuery.of(context).size.width * 0.8,
|
|
child: Table(
|
|
columnWidths: const {
|
|
0: FixedColumnWidth(80.0),
|
|
1: FlexColumnWidth(),
|
|
},
|
|
children: [
|
|
// Date
|
|
TableRow(
|
|
children: [
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Icon(
|
|
Icons.calendar_today,
|
|
size: 30,
|
|
color: Theme.of(context).colorScheme.tertiary,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Text(
|
|
'29.04.2023',
|
|
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
// Lieu
|
|
TableRow(
|
|
children: [
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Icon(
|
|
Icons.location_on,
|
|
size: 30,
|
|
color: Theme.of(context).colorScheme.tertiary,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'Anim-Halle',
|
|
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
|
|
color: Colors.black,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
Text(
|
|
'En Bas-les-Barres 6',
|
|
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
|
|
color: Colors.grey[800],
|
|
),
|
|
),
|
|
Text(
|
|
'2316 Les Ponts-de-martel',
|
|
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
|
|
color: Colors.grey[800],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
// Organisation
|
|
TableRow(
|
|
children: [
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Container(
|
|
width: 40,
|
|
height: 40,
|
|
child: Image.asset(
|
|
'images/OCTONELLE.jpg',
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
TableCell(
|
|
verticalAlignment: TableCellVerticalAlignment.middle,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Text(
|
|
'L\'Octonelle',
|
|
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
// TabBar
|
|
TabBar(
|
|
tabs: const [
|
|
Tab(text: 'Publications'),
|
|
Tab(text: 'À propos'),
|
|
],
|
|
labelColor: Theme.of(context).colorScheme.primary,
|
|
unselectedLabelColor: Colors.black,
|
|
indicatorColor: Theme.of(context).colorScheme.primary,
|
|
tabAlignment: TabAlignment.start,
|
|
isScrollable: true,
|
|
labelStyle: Theme.of(context).textTheme.titleLarge,
|
|
dividerColor: Colors.transparent,
|
|
onTap: (index) {
|
|
viewModel.setSelectedTab(index);
|
|
},
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
body: TabBarView(
|
|
children: [
|
|
// Tab 1: Publications
|
|
Container(
|
|
color: const Color(0xFFEFF0FF),
|
|
child: ListView.builder(
|
|
padding: const EdgeInsets.all(16.0),
|
|
itemCount: 10,
|
|
itemBuilder: (context, index) {
|
|
return PostCardWidget(
|
|
title: 'Publication ${index + 1}',
|
|
content: 'Voici le contenu de la publication ${index + 1}. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
|
|
authorName: 'L\'Octonelle',
|
|
authorImageUrl: '',
|
|
publishDate: DateTime.now().subtract(Duration(days: index)),
|
|
imageUrls: index % 3 == 0 ? ['assets/images/Affiche.jpg'] : null,
|
|
likesCount: (index + 1) * 5,
|
|
commentsCount: (index + 1) * 2,
|
|
aspectRatio: 4/5,
|
|
onLike: () {
|
|
print('Like publication ${index + 1}');
|
|
},
|
|
onComment: () {
|
|
print('Comment publication ${index + 1}');
|
|
},
|
|
onShare: () {
|
|
print('Share publication ${index + 1}');
|
|
},
|
|
);
|
|
},
|
|
),
|
|
),
|
|
// Tab 2: À propos
|
|
Container(
|
|
color: const Color(0xFFEFF0FF),
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: ReadMoreText(
|
|
'Bienvenue à Disc\'Octonelle 2 ! \n\nRejoignez-nous pour une soirée inoubliable de musique, de danse et de bonne humeur. \n\nQue vous soyez amateur de rock, de pop, de jazz ou d\'électro, il y en aura pour tous les goûts. \nVenez découvrir des artistes locaux et internationaux dans une ambiance conviviale et festive. \nNe manquez pas cette occasion unique de faire la fête et de créer des souvenirs mémorables avec vos amis. Nous avons hâte de vous accueillir à Disc\'Octonelle 2 !',
|
|
trimLines: 10,
|
|
collapsedText: '... Voir plus',
|
|
expandedText: ' Voir moins',
|
|
textStyle: Theme.of(context).textTheme.bodyMedium?.copyWith(
|
|
color: Colors.black,
|
|
height: 1.4,
|
|
),
|
|
),
|
|
),
|
|
Divider(height: 2, indent: 20, endIndent: 20, color: Theme.of(context).colorScheme.primary),
|
|
],
|
|
)
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
top: 20,
|
|
left: 20,
|
|
child: Container(
|
|
//padding: const EdgeInsets.all(8.0),
|
|
decoration: BoxDecoration(
|
|
color: Colors.black.withOpacity(0.6),
|
|
borderRadius: BorderRadius.circular(20),
|
|
),
|
|
child: IconButton(
|
|
onPressed: viewModel.onBackPressed,
|
|
icon: const Icon(Icons.arrow_back, size: 20),
|
|
)
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
EventDetailsViewModel viewModelBuilder(
|
|
BuildContext context,
|
|
) =>
|
|
EventDetailsViewModel();
|
|
}
|