124 lines
4.0 KiB
Dart
124 lines
4.0 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
|
|
class ShareBottomSheet extends StatelessWidget {
|
|
const ShareBottomSheet({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final shareItems = [
|
|
{'icon': 'assets/icons/whatsapp.png', 'title': 'WhatsApp'},
|
|
{'icon': 'assets/icons/insta.png', 'title': 'Direct'},
|
|
{'icon': 'assets/icons/snapchat.png', 'title': 'Snapchat'},
|
|
{'icon': 'assets/icons/skype.png', 'title': 'Skype'},
|
|
{'icon': 'assets/icons/truecaller.png', 'title': 'Truecaller'},
|
|
{'icon': 'assets/icons/indeed.png', 'title': 'Private Message'},
|
|
{'icon': 'assets/icons/indeed.png', 'title': 'Share In A Post'},
|
|
{'icon': 'assets/icons/facebook.png', 'title': 'News Feed'},
|
|
];
|
|
|
|
return Container(
|
|
padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 16.h),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.vertical(top: Radius.circular(12.r)),
|
|
),
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
// drag handle
|
|
Container(
|
|
height: 4.h,
|
|
width: 47.w,
|
|
margin: EdgeInsets.only(bottom: 16.h),
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFF222222),
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
),
|
|
|
|
// link field
|
|
TextField(
|
|
readOnly: true,
|
|
decoration: InputDecoration(
|
|
hintText: "https://www.linkedin.com/link",
|
|
suffixIcon: IconButton(
|
|
icon: const Icon(Icons.copy, color: Color(0xFF858585)),
|
|
onPressed: () {},
|
|
),
|
|
filled: true,
|
|
fillColor: const Color(0xffFEE7E7),
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(10),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
),
|
|
),
|
|
|
|
SizedBox(height: 20.h),
|
|
|
|
// grid
|
|
GridView.builder(
|
|
shrinkWrap: true,
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
itemCount: shareItems.length,
|
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 4,
|
|
mainAxisSpacing: 16,
|
|
crossAxisSpacing: 8,
|
|
childAspectRatio: 0.8,
|
|
),
|
|
itemBuilder: (context, index) {
|
|
final item = shareItems[index];
|
|
return Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
// FIXED SIZE ICON CONTAINER
|
|
Container(
|
|
width: 55.w,
|
|
height: 55.w,
|
|
alignment: Alignment.center,
|
|
child: Image.asset(
|
|
item['icon']!,
|
|
fit: BoxFit.contain,
|
|
),
|
|
),
|
|
SizedBox(height: 8.h),
|
|
Text(
|
|
item['title']!,
|
|
style: TextStyle(fontSize: 12.sp),
|
|
textAlign: TextAlign.center,
|
|
),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
|
|
const SizedBox(height: 20),
|
|
|
|
// page indicator
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: List.generate(
|
|
4,
|
|
(index) => Container(
|
|
margin: const EdgeInsets.symmetric(horizontal: 3),
|
|
width: 8.w,
|
|
height: 8.h,
|
|
decoration: BoxDecoration(
|
|
color: index == 0
|
|
? const Color(0xFF676363)
|
|
: Colors.white,
|
|
border: Border.all(color: const Color(0xFF676363)),
|
|
shape: BoxShape.circle,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
|
|
SizedBox(height: 10.h),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
} |