custom_card.dart 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. import 'package:flutter/material.dart';
  2. class CustomProductCard extends StatelessWidget {
  3. final String? imageURL;
  4. final String? titulo;
  5. final String? precio;
  6. final int? cantidad;
  7. const CustomProductCard(
  8. {super.key,
  9. this.imageURL,
  10. required this.titulo,
  11. required this.precio,
  12. required this.cantidad});
  13. @override
  14. Widget build(BuildContext context) {
  15. return Container(
  16. padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 10),
  17. decoration: BoxDecoration(
  18. color: Colors.white,
  19. borderRadius: BorderRadius.circular(10),
  20. border: Border.all(color: Colors.grey.shade200),
  21. ),
  22. child: Row(
  23. children: [
  24. // Imagen del producto
  25. ClipRRect(
  26. borderRadius: BorderRadius.circular(5),
  27. child: Image.network(
  28. 'https://picsum.photos/200/300?random=3',
  29. width: 80,
  30. height: 80,
  31. fit: BoxFit.cover,
  32. ),
  33. ),
  34. const SizedBox(width: 10),
  35. // Contenido del texto (título)
  36. Expanded(
  37. child: Column(
  38. crossAxisAlignment: CrossAxisAlignment.start,
  39. mainAxisSize: MainAxisSize.min,
  40. children: [
  41. Text(
  42. titulo ?? "Titulo Producto",
  43. softWrap: true,
  44. maxLines: 2,
  45. overflow: TextOverflow.ellipsis,
  46. style: const TextStyle(
  47. fontWeight: FontWeight.bold,
  48. fontSize: 14,
  49. color: Colors.black87,
  50. ),
  51. ),
  52. const SizedBox(height: 4),
  53. // Precio
  54. Row(
  55. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  56. mainAxisSize: MainAxisSize.max,
  57. children: [
  58. Text(
  59. '\$$precio',
  60. style: TextStyle(
  61. fontSize: 16,
  62. fontWeight: FontWeight.bold,
  63. color: Colors.green[700],
  64. ),
  65. ),
  66. Text(
  67. "${cantidad}x",
  68. style: TextStyle(
  69. fontSize: 16,
  70. fontWeight: FontWeight.w500,
  71. color: Colors.grey[600],
  72. ),
  73. ),
  74. ],
  75. ),
  76. ],
  77. ),
  78. ),
  79. // Cantidad
  80. ],
  81. ),
  82. );
  83. }
  84. }