343 lines
12 KiB
Dart
343 lines
12 KiB
Dart
|
import 'package:avatar_stack/avatar_stack.dart';
|
||
|
|
import 'package:avatar_stack/positions.dart';
|
||
|
|
import 'package:flutter/cupertino.dart';
|
||
|
|
import 'package:flutter/material.dart';
|
||
|
|
import 'package:flutter/widgets.dart';
|
||
|
|
import 'package:konectar_events/utils/util.dart';
|
||
|
|
import 'package:konectar_events/view/eventstab.dart';
|
||
|
|
import 'package:konectar_events/widgets/customtextfield.dart';
|
||
|
|
import 'package:konectar_events/widgets/responsive_utils.dart';
|
||
|
|
import 'package:konectar_events/widgets/typography.dart';
|
||
|
|
|
||
|
|
class EventsGrid extends StatelessWidget {
|
||
|
|
final Color iconColor;
|
||
|
|
VoidCallback addtoFav;
|
||
|
|
EventsGrid({super.key, required this.iconColor, required this.addtoFav});
|
||
|
|
|
||
|
|
@override
|
||
|
|
Widget build(BuildContext context) {
|
||
|
|
final textTheme = Theme.of(context)
|
||
|
|
.textTheme
|
||
|
|
.apply(displayColor: Theme.of(context).colorScheme.onSurface);
|
||
|
|
|
||
|
|
// Set the default number of columns to 3.
|
||
|
|
int columnsCount = 2;
|
||
|
|
|
||
|
|
// Define the icon size based on the screen width
|
||
|
|
|
||
|
|
// Use the ResponsiveUtils class to determine the device's screen size.
|
||
|
|
if (ResponsiveUtils.isMobile(context)) {
|
||
|
|
columnsCount = 1;
|
||
|
|
} else if (ResponsiveUtils.isDesktop(context)) {
|
||
|
|
columnsCount = 3;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Build the grid view using the number of columns.
|
||
|
|
return Expanded(
|
||
|
|
child: GridView.builder(
|
||
|
|
// Set padding and spacing between cards.
|
||
|
|
padding: const EdgeInsets.symmetric(vertical: 5),
|
||
|
|
scrollDirection: Axis.vertical,
|
||
|
|
|
||
|
|
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||
|
|
// Set the number of columns based on the device's screen size.
|
||
|
|
crossAxisCount: columnsCount,
|
||
|
|
|
||
|
|
// Set the aspect ratio of each card.
|
||
|
|
// childAspectRatio: isTablet ? 2 : 2,
|
||
|
|
// crossAxisSpacing: isTablet ? 30 : 20,
|
||
|
|
// mainAxisSpacing: isTablet ? 40 : 20,
|
||
|
|
|
||
|
|
childAspectRatio: isTablet ? 2 : 2.2,
|
||
|
|
crossAxisSpacing: isTablet ? 30 : 1,
|
||
|
|
mainAxisSpacing: isTablet ? 40 : 4,
|
||
|
|
),
|
||
|
|
// Set the number of items in the grid view.
|
||
|
|
itemCount: 20,
|
||
|
|
itemBuilder: (BuildContext context, int index) {
|
||
|
|
// Build each card in the grid view.
|
||
|
|
return InkWell(
|
||
|
|
// onTap: () {
|
||
|
|
// Navigator.of(context).push(MaterialPageRoute(
|
||
|
|
// builder: (context) => EventsTab(),
|
||
|
|
// ));
|
||
|
|
// },
|
||
|
|
child: Card(child: buildCardView(context)));
|
||
|
|
},
|
||
|
|
// Set the grid view to shrink wrap its contents.
|
||
|
|
shrinkWrap: true,
|
||
|
|
// Disable scrolling in the grid view.
|
||
|
|
// physics: const NeverScrollableScrollPhysics(),
|
||
|
|
),
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
buildCardView(BuildContext context) {
|
||
|
|
double height = isTablet
|
||
|
|
? MediaQuery.of(context).size.height * 0.35
|
||
|
|
: MediaQuery.of(context).size.height * 0.65;
|
||
|
|
return Container(
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
// color: Color.fromARGB(179, 248, 238, 238),
|
||
|
|
color: Colors.white,
|
||
|
|
borderRadius: BorderRadius.all(Radius.circular(20))),
|
||
|
|
height: height,
|
||
|
|
padding: isTablet
|
||
|
|
? EdgeInsets.symmetric(horizontal: 8.0, vertical: 2.0)
|
||
|
|
: EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
|
||
|
|
child: Column(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||
|
|
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||
|
|
children: [
|
||
|
|
SizedBox(
|
||
|
|
height: isTablet ? 1 : 3,
|
||
|
|
),
|
||
|
|
Container(
|
||
|
|
// height: isTablet ? height * 0.50 : height * 0.30,
|
||
|
|
padding: const EdgeInsets.only(top: 5.0),
|
||
|
|
width: double.maxFinite,
|
||
|
|
child: Column(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||
|
|
children: [
|
||
|
|
Text(
|
||
|
|
'2024 Hematology/Oncology Pharmacy Association Annual Conference (HOPA)',
|
||
|
|
style: TextStyle(
|
||
|
|
// decoration: TextDecoration.underline,
|
||
|
|
// decorationColor: Colors.blue,
|
||
|
|
color: Colors.black,
|
||
|
|
//fontWeight: FontWeight.bold,
|
||
|
|
fontSize: isTablet ? 22 : 18,
|
||
|
|
fontFamily: "SourceSerif",
|
||
|
|
),
|
||
|
|
maxLines: isTablet ? 3 : 3,
|
||
|
|
softWrap: true,
|
||
|
|
overflow: TextOverflow.ellipsis,
|
||
|
|
),
|
||
|
|
SizedBox(
|
||
|
|
height: 20.0,
|
||
|
|
),
|
||
|
|
Row(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.end,
|
||
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
|
|
children: [
|
||
|
|
Column(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||
|
|
children: [
|
||
|
|
RichText(
|
||
|
|
text: TextSpan(
|
||
|
|
children: [
|
||
|
|
WidgetSpan(
|
||
|
|
child: Icon(Icons.location_on, size: 18),
|
||
|
|
),
|
||
|
|
TextSpan(
|
||
|
|
text: 'Tampa,Florida,United States',
|
||
|
|
style: TextStyle(
|
||
|
|
color: Colors.black,
|
||
|
|
fontStyle: FontStyle.italic,
|
||
|
|
fontFamily: "SourceSerif",
|
||
|
|
fontSize: isTablet ? 20 : 16),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
SizedBox(
|
||
|
|
height: 5.0,
|
||
|
|
),
|
||
|
|
RichText(
|
||
|
|
text: TextSpan(
|
||
|
|
children: [
|
||
|
|
WidgetSpan(
|
||
|
|
child: Icon(Icons.calendar_month, size: 18),
|
||
|
|
),
|
||
|
|
TextSpan(
|
||
|
|
text: ' 06-10-2024 - 10-10-2024',
|
||
|
|
style: TextStyle(
|
||
|
|
color: Colors.black,
|
||
|
|
fontStyle: FontStyle.italic,
|
||
|
|
fontFamily: "SourceSerif",
|
||
|
|
fontSize: isTablet ? 20 : 16),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.bottomRight,
|
||
|
|
child: SizedBox(
|
||
|
|
height: 30,
|
||
|
|
child: OutlinedButton(
|
||
|
|
onPressed: () => addtoFav,
|
||
|
|
child: Icon(
|
||
|
|
Icons.favorite_border_outlined,
|
||
|
|
size: isTablet ? 20 : 18,
|
||
|
|
color: iconColor,
|
||
|
|
),
|
||
|
|
style: OutlinedButton.styleFrom(
|
||
|
|
shape: CircleBorder(),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
|
||
|
|
// Image.asset(
|
||
|
|
// "assets/images/events2.jpg",
|
||
|
|
// fit: BoxFit.cover,
|
||
|
|
// ),
|
||
|
|
),
|
||
|
|
// Divider(
|
||
|
|
// color: Colors.blueGrey,
|
||
|
|
// thickness: 2,
|
||
|
|
// height: 2,
|
||
|
|
// ),
|
||
|
|
|
||
|
|
// SizedBox(
|
||
|
|
// height: 5,
|
||
|
|
// ),
|
||
|
|
// Text(
|
||
|
|
// 'Organizer: Hematology/Oncology Pharmacy Association (HOPA)',
|
||
|
|
// style: TextStyle(
|
||
|
|
// color: Colors.black,
|
||
|
|
// fontStyle: FontStyle.italic,
|
||
|
|
// fontFamily: "SourceSerif",
|
||
|
|
// fontSize: isTablet ? 18 : 14),
|
||
|
|
// maxLines: 2,
|
||
|
|
// softWrap: true,
|
||
|
|
// overflow: TextOverflow.ellipsis,
|
||
|
|
// ),
|
||
|
|
// SizedBox(
|
||
|
|
// // height: 100,
|
||
|
|
// child: Padding(
|
||
|
|
// padding: const EdgeInsets.symmetric(vertical: 4.0),
|
||
|
|
// child: Column(
|
||
|
|
// mainAxisAlignment: MainAxisAlignment.start,
|
||
|
|
// crossAxisAlignment: CrossAxisAlignment.start,
|
||
|
|
// children: [
|
||
|
|
// Row(
|
||
|
|
// children: [],
|
||
|
|
// ),
|
||
|
|
|
||
|
|
// RichText(
|
||
|
|
// text: TextSpan(
|
||
|
|
// children: [
|
||
|
|
// WidgetSpan(
|
||
|
|
// child: SizedBox(
|
||
|
|
// width: 80,
|
||
|
|
// height: 18,
|
||
|
|
// child: WidgetStack(
|
||
|
|
// stackedWidgets: [
|
||
|
|
// for (var n = 0; n < 5; n++)
|
||
|
|
// CircleAvatar(
|
||
|
|
// child: Icon(
|
||
|
|
// Icons.person,
|
||
|
|
// size: 14,
|
||
|
|
// color: Colors.blueGrey[300],
|
||
|
|
// ))
|
||
|
|
// ],
|
||
|
|
// positions: RestrictedPositions(
|
||
|
|
// maxCoverage: 0.3,
|
||
|
|
// minCoverage: 0.4,
|
||
|
|
// ),
|
||
|
|
// buildInfoWidget: (surplus) {
|
||
|
|
// return Center(
|
||
|
|
// child: Text(
|
||
|
|
// '+$surplus',
|
||
|
|
// style: Theme.of(context).textTheme.headline5,
|
||
|
|
// ));
|
||
|
|
// },
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// TextSpan(
|
||
|
|
// text: '5',
|
||
|
|
// style: TextStyle(
|
||
|
|
// color: Colors.black,
|
||
|
|
// fontFamily: "SourceSerif",
|
||
|
|
// fontSize: 16),
|
||
|
|
// ),
|
||
|
|
// TextSpan(
|
||
|
|
// text: ' attendees',
|
||
|
|
// style: TextStyle(
|
||
|
|
// color: Colors.black,
|
||
|
|
// fontFamily: "SourceSerif",
|
||
|
|
// fontSize: 14),
|
||
|
|
// ),
|
||
|
|
// ],
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// RichText(
|
||
|
|
// text: TextSpan(
|
||
|
|
// children: [
|
||
|
|
// WidgetSpan(
|
||
|
|
// child: SizedBox(
|
||
|
|
// width: 50,
|
||
|
|
// height: 18,
|
||
|
|
// child: WidgetStack(
|
||
|
|
// stackedWidgets: [
|
||
|
|
// for (var n = 0; n < 3; n++)
|
||
|
|
// CircleAvatar(
|
||
|
|
// child: Icon(
|
||
|
|
// Icons.person,
|
||
|
|
// size: 14,
|
||
|
|
// color: Colors.blueGrey[300],
|
||
|
|
// ))
|
||
|
|
// ],
|
||
|
|
// positions: RestrictedPositions(
|
||
|
|
// maxCoverage: 0.3,
|
||
|
|
// minCoverage: 0.4,
|
||
|
|
// ),
|
||
|
|
// buildInfoWidget: (surplus) {
|
||
|
|
// return Center(
|
||
|
|
// child: Text(
|
||
|
|
// '+$surplus',
|
||
|
|
// style: Theme.of(context).textTheme.headline5,
|
||
|
|
// ));
|
||
|
|
// },
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// TextSpan(
|
||
|
|
// text: '3',
|
||
|
|
// style: TextStyle(
|
||
|
|
// color: Colors.black,
|
||
|
|
// fontFamily: "SourceSerif",
|
||
|
|
// fontSize: 16),
|
||
|
|
// ),
|
||
|
|
// TextSpan(
|
||
|
|
// text: ' client attendees',
|
||
|
|
// style: TextStyle(
|
||
|
|
// color: Colors.black,
|
||
|
|
// fontFamily: "SourceSerif",
|
||
|
|
// fontSize: 14),
|
||
|
|
// ),
|
||
|
|
// ],
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ],
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// Row(
|
||
|
|
// children: [
|
||
|
|
// SizedBox(
|
||
|
|
// height: 30,
|
||
|
|
// child: OutlinedButton(
|
||
|
|
// onPressed: () {},
|
||
|
|
// child: Text('Add to My Events'),
|
||
|
|
// style: OutlinedButton.styleFrom(
|
||
|
|
// shape: StadiumBorder(),
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ),
|
||
|
|
// ],
|
||
|
|
// )
|
||
|
|
],
|
||
|
|
),
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|