ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-07-14 17:25:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixed overflow issue for add widget

Browse Source
This commit is contained in:
hannathkadher
2024-11-26 15:39:34 +04:00
parent 6fca5afd6b
commit da17d6d289
1 changed files with 54 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
lib/pages/spaces_management/widgets/add_device_type_widget.dart
View File

@ -46,40 +46,50 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
Widget build(BuildContext context) { Widget build(BuildContext context) {
final size = MediaQuery.of(context).size; final size = MediaQuery.of(context).size;
// Adjust the GridView properties based on screen width
final crossAxisCount = size.width > 1200
? 8
: size.width > 800
? 5
: 3;
return AlertDialog( return AlertDialog(
title: const Text('Add Devices'), title: const Text('Add Devices'),
backgroundColor: ColorsManager.whiteColors, backgroundColor: ColorsManager.whiteColors,
content: Container( content: SingleChildScrollView(
width: size.width * 0.65, child: Container(
height: size.height * 0.57, width: size.width * 0.9,
color: ColorsManager.textFieldGreyColor, height: size.height * 0.65,
child: Column( color: ColorsManager.textFieldGreyColor,
children: [ child: Column(
const SizedBox(height: 16), children: [
Expanded( const SizedBox(height: 16),
child: Padding( Expanded(
padding: const EdgeInsets.symmetric(horizontal: 20.0), child: Padding(
child: Scrollbar( padding: const EdgeInsets.symmetric(horizontal: 20.0),
controller: _scrollController, child: Scrollbar(
thumbVisibility: false,
child: GridView.builder(
controller: _scrollController, controller: _scrollController,
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( thumbVisibility: false,
crossAxisCount: 6, child: GridView.builder(
mainAxisSpacing: 10, shrinkWrap: true,
crossAxisSpacing: 10, controller: _scrollController,
childAspectRatio: 0.7, gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: crossAxisCount,
mainAxisSpacing: 6,
crossAxisSpacing: 4,
childAspectRatio: .8,
),
itemCount: widget.products?.length ?? 0,
itemBuilder: (context, index) {
final product = widget.products![index];
return _buildDeviceTypeTile(product, size);
},
), ),
itemCount: widget.products?.length ?? 0,
itemBuilder: (context, index) {
final product = widget.products![index];
return _buildDeviceTypeTile(product);
},
), ),
), ),
), ),
), ],
], ),
), ),
), ),
actions: [ actions: [
@ -101,15 +111,15 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
); );
} }
Widget _buildDeviceTypeTile(ProductModel product) { Widget _buildDeviceTypeTile(ProductModel product, Size size) {
final selectedProduct = productCounts.firstWhere( final selectedProduct = productCounts.firstWhere(
(p) => p.productId == product.uuid, (p) => p.productId == product.uuid,
orElse: () => SelectedProduct(productId: product.uuid, count: 0), orElse: () => SelectedProduct(productId: product.uuid, count: 0),
); );
return SizedBox( return SizedBox(
width: 75, width: size.width * 0.12,
height: 90, height: size.height * 0.15,
child: Card( child: Card(
elevation: 2, elevation: 2,
color: ColorsManager.whiteColors, color: ColorsManager.whiteColors,
@ -117,14 +127,15 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
borderRadius: BorderRadius.circular(8), borderRadius: BorderRadius.circular(8),
), ),
child: Padding( child: Padding(
padding: const EdgeInsets.all(6.0), padding: const EdgeInsets.all(4.0),
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
_buildDeviceIcon(product), _buildDeviceIcon(product, size),
const SizedBox(height: 8), const SizedBox(height: 4),
_buildDeviceName(product), _buildDeviceName(product, size),
const SizedBox(height: 8), const SizedBox(height: 4),
CounterWidget( CounterWidget(
initialCount: selectedProduct.count, initialCount: selectedProduct.count,
onCountChanged: (newCount) { onCountChanged: (newCount) {
@ -153,10 +164,10 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
); );
} }
Widget _buildDeviceIcon(ProductModel product) { Widget _buildDeviceIcon(ProductModel product, Size size) {
return Container( return Container(
height: 80, height: size.width > 800 ? 50 : 40,
width: 80, width: size.width > 800 ? 50 : 40,
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: ColorsManager.textFieldGreyColor, color: ColorsManager.textFieldGreyColor,
@ -168,16 +179,16 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
child: Center( child: Center(
child: SvgPicture.asset( child: SvgPicture.asset(
product.icon ?? Assets.sensors, product.icon ?? Assets.sensors,
width: 45, width: size.width > 800 ? 30 : 20,
height: 45, height: size.width > 800 ? 30 : 20,
), ),
), ),
); );
} }
Widget _buildDeviceName(ProductModel product) { Widget _buildDeviceName(ProductModel product, Size size) {
return SizedBox( return SizedBox(
height: 35, height: size.width > 800 ? 35 : 25,
child: Text( child: Text(
product.name ?? '', product.name ?? '',
style: context.textTheme.bodySmall?.copyWith(color: ColorsManager.blackColor), style: context.textTheme.bodySmall?.copyWith(color: ColorsManager.blackColor),
@ -195,7 +206,7 @@ class _AddDeviceWidgetState extends State<AddDeviceWidget> {
VoidCallback onPressed, VoidCallback onPressed,
) { ) {
return SizedBox( return SizedBox(
width: 200, width: 120,
child: DefaultButton( child: DefaultButton(
onPressed: onPressed, onPressed: onPressed,
backgroundColor: backgroundColor, backgroundColor: backgroundColor,