maddy/Kifi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Barcode Printing Utility Done

Browse Source
This commit is contained in:
Narayanan Madaswamy
2026-09-04 18:30:26 +05:30
parent 5e9b3f2122
commit 2c04a993f7
33 changed files with 8481 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

189
kifi-app/lib/features/barcode_designer/presentation/widgets/designer_toolbox.dart Normal file
View File

@@ -0,0 +1,189 @@
import 'package:flutter/material.dart';
import 'package:lucide_icons_flutter/lucide_icons.dart';
import '../../domain/label_document.dart';
class ToolboxItemData {
final ElementType type;
final String label;
final IconData icon;
final Color color;
final String description;
const ToolboxItemData({
required this.type,
required this.label,
required this.icon,
required this.color,
required this.description,
});
}
class DesignerToolbox extends StatelessWidget {
final Function(ElementType type) onAddElement;
const DesignerToolbox({
super.key,
required this.onAddElement,
});
static const List<ToolboxItemData> items = [
ToolboxItemData(
type: ElementType.text,
label: 'Text',
icon: LucideIcons.type,
color: Colors.blue,
description: 'Static label text (default: kifi)',
),
ToolboxItemData(
type: ElementType.dynamicText,
label: 'Dynamic Field',
icon: LucideIcons.variable,
color: Colors.purple,
description: 'Bound product placeholder',
),
ToolboxItemData(
type: ElementType.barcode,
label: 'Barcode',
icon: LucideIcons.barcode,
color: Colors.indigo,
description: 'Code 128, EAN-13, SKU barcode',
),
ToolboxItemData(
type: ElementType.qrCode,
label: 'QR Code',
icon: LucideIcons.qrCode,
color: Colors.teal,
description: '2D matrix barcode or URL',
),
ToolboxItemData(
type: ElementType.rectangle,
label: 'Rectangle',
icon: LucideIcons.square,
color: Colors.amber,
description: 'Bordered or filled box',
),
ToolboxItemData(
type: ElementType.line,
label: 'Line Divider',
icon: LucideIcons.minus,
color: Colors.blueGrey,
description: 'Horizontal or vertical line',
),
];
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
return ListView(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 6),
child: Text(
'TOOLBOX',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.bold,
letterSpacing: 1.1,
color: Colors.grey.shade500,
),
),
),
...items.map((item) {
return Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Draggable<ElementType>(
data: item.type,
feedback: Material(
elevation: 6,
borderRadius: BorderRadius.circular(12),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
decoration: BoxDecoration(
color: item.color,
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(item.icon, color: Colors.white, size: 18),
const SizedBox(width: 8),
Text(
item.label,
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 13,
),
),
],
),
),
),
childWhenDragging: Opacity(
opacity: 0.4,
child: _buildItemCard(context, item, isDark),
),
child: InkWell(
onTap: () => onAddElement(item.type),
borderRadius: BorderRadius.circular(12),
child: _buildItemCard(context, item, isDark),
),
),
);
}),
],
);
}
Widget _buildItemCard(BuildContext context, ToolboxItemData item, bool isDark) {
return Container(
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: isDark ? const Color(0xFF1E293B) : Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: isDark ? Colors.white10 : Colors.grey.shade200,
),
),
child: Row(
children: [
Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: item.color.withValues(alpha: 0.12),
borderRadius: BorderRadius.circular(8),
),
child: Icon(item.icon, color: item.color, size: 18),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.label,
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 13,
),
),
Text(
item.description,
style: TextStyle(
color: Colors.grey.shade500,
fontSize: 10.5,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
),
),
Icon(LucideIcons.gripVertical, size: 14, color: Colors.grey.shade400),
],
),
);
}
}