list copy.dart 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495
  1. import 'package:flutter/material.dart';
  2. class ListPage extends StatelessWidget {
  3. const ListPage({Key? key}) : super(key: key);
  4. @override
  5. Widget build(BuildContext context) {
  6. var items = [
  7. 'Foods & Drinks',
  8. 'Services',
  9. 'Additional',
  10. 'First Aid',
  11. 'Ticket',
  12. 'Vacation',
  13. 'Transportation'
  14. ];
  15. return Scaffold(
  16. appBar: AppBar(
  17. backgroundColor: Color(0xff078C84),
  18. ),
  19. resizeToAvoidBottomInset: false,
  20. body: ListView(
  21. children: [
  22. Card(
  23. child: Column(
  24. children: [
  25. Row(
  26. children: [
  27. Text(
  28. 'Top Menu',
  29. textAlign: TextAlign.left,
  30. style: TextStyle(
  31. fontWeight: FontWeight.w500,
  32. color: Color(0xff292D32)),
  33. ),
  34. Expanded(child: Container()),
  35. ElevatedButton(
  36. style: ElevatedButton.styleFrom(
  37. backgroundColor:
  38. Color(0xff078C84).withOpacity(0.1)),
  39. onPressed: () {
  40. print('Done');
  41. },
  42. child: Text(
  43. 'Done',
  44. style: TextStyle(
  45. color: Color(0xff078C84),
  46. fontWeight: FontWeight.w300),
  47. ))
  48. ],
  49. ),
  50. Padding(
  51. padding: const EdgeInsets.all(8.0),
  52. child: Row(
  53. children: [
  54. Container(
  55. decoration: BoxDecoration(
  56. border: Border.all(color: Color(0xffCCA600)),
  57. borderRadius:
  58. BorderRadius.all(Radius.circular(20)),
  59. color: Color(0xffCCA600).withOpacity(0.4)),
  60. padding: const EdgeInsets.all(10.0),
  61. child: Image.asset(
  62. 'assets/images/food.png',
  63. width: 36,
  64. height: 36,
  65. fit: BoxFit.cover,
  66. ),
  67. ),
  68. Padding(
  69. padding: const EdgeInsets.all(8.0),
  70. child: Column(
  71. crossAxisAlignment: CrossAxisAlignment.start,
  72. children: [
  73. Text(
  74. 'Foods & Drinks',
  75. style: TextStyle(fontSize: 14),
  76. ),
  77. Text(
  78. 'Description of foods & drink',
  79. style: TextStyle(fontSize: 12),
  80. ),
  81. ],
  82. ),
  83. ),
  84. Expanded(child: Container()),
  85. IconDelete()
  86. ],
  87. ),
  88. ),
  89. Padding(
  90. padding: const EdgeInsets.all(8.0),
  91. child: Row(
  92. children: [
  93. Container(
  94. decoration: BoxDecoration(
  95. border: Border.all(color: Color(0xff90D8F9)),
  96. borderRadius:
  97. BorderRadius.all(Radius.circular(20)),
  98. color: Color(0xff90D8F9).withOpacity(0.22)),
  99. padding: const EdgeInsets.all(10.0),
  100. child: Image.asset(
  101. 'assets/images/service.png',
  102. width: 36,
  103. height: 36,
  104. fit: BoxFit.cover,
  105. ),
  106. ),
  107. Padding(
  108. padding: const EdgeInsets.all(8.0),
  109. child: Column(
  110. crossAxisAlignment: CrossAxisAlignment.start,
  111. children: [
  112. Text(
  113. 'Services',
  114. style: TextStyle(fontSize: 14),
  115. ),
  116. Text(
  117. 'Description of services',
  118. style: TextStyle(fontSize: 12),
  119. ),
  120. ],
  121. ),
  122. ),
  123. Expanded(child: Container()),
  124. IconDelete()
  125. ],
  126. ),
  127. ),
  128. Padding(
  129. padding: const EdgeInsets.all(8.0),
  130. child: Row(
  131. children: [
  132. Container(
  133. decoration: BoxDecoration(
  134. border: Border.all(color: Color(0xffAACEE0)),
  135. borderRadius:
  136. BorderRadius.all(Radius.circular(20)),
  137. color: Color(0xffAACEE0).withOpacity(0.31)),
  138. padding: const EdgeInsets.all(10.0),
  139. child: Image.asset(
  140. 'assets/images/additional.png',
  141. width: 36,
  142. height: 36,
  143. fit: BoxFit.cover,
  144. ),
  145. ),
  146. Padding(
  147. padding: const EdgeInsets.all(8.0),
  148. child: Column(
  149. crossAxisAlignment: CrossAxisAlignment.start,
  150. children: [
  151. Text(
  152. 'Additional',
  153. style: TextStyle(fontSize: 14),
  154. ),
  155. Text(
  156. 'Description of additional',
  157. style: TextStyle(fontSize: 12),
  158. ),
  159. ],
  160. ),
  161. ),
  162. Expanded(child: Container()),
  163. IconDelete()
  164. ],
  165. ),
  166. ),
  167. Padding(
  168. padding: const EdgeInsets.all(8.0),
  169. child: Row(
  170. children: [
  171. Container(
  172. decoration: BoxDecoration(
  173. border: Border.all(color: Color(0xffFF1111)),
  174. borderRadius:
  175. BorderRadius.all(Radius.circular(20)),
  176. color: Color(0xffFF1111).withOpacity(0.15)),
  177. padding: const EdgeInsets.all(10.0),
  178. child: Image.asset(
  179. 'assets/images/firstaid.png',
  180. width: 36,
  181. height: 36,
  182. fit: BoxFit.cover,
  183. ),
  184. ),
  185. Padding(
  186. padding: const EdgeInsets.all(8.0),
  187. child: Column(
  188. crossAxisAlignment: CrossAxisAlignment.start,
  189. children: [
  190. Text(
  191. 'First Aid',
  192. style: TextStyle(fontSize: 14),
  193. ),
  194. Text(
  195. 'Description of first aid',
  196. style: TextStyle(fontSize: 12),
  197. ),
  198. ],
  199. ),
  200. ),
  201. Expanded(child: Container()),
  202. IconDelete()
  203. ],
  204. ),
  205. ),
  206. Padding(
  207. padding: const EdgeInsets.all(8.0),
  208. child: Row(
  209. children: [
  210. Container(
  211. decoration: BoxDecoration(
  212. border: Border.all(color: Color(0xff5ED8F6)),
  213. borderRadius:
  214. BorderRadius.all(Radius.circular(20)),
  215. color: Color(0xff5ED8F6).withOpacity(0.26)),
  216. padding: const EdgeInsets.all(10.0),
  217. child: Image.asset(
  218. 'assets/images/ticket.png',
  219. width: 36,
  220. height: 36,
  221. fit: BoxFit.cover,
  222. ),
  223. ),
  224. Padding(
  225. padding: const EdgeInsets.all(8.0),
  226. child: Column(
  227. crossAxisAlignment: CrossAxisAlignment.start,
  228. children: [
  229. Text(
  230. 'Ticket',
  231. style: TextStyle(fontSize: 14),
  232. ),
  233. Text(
  234. 'Description of ticket',
  235. style: TextStyle(fontSize: 12),
  236. ),
  237. ],
  238. ),
  239. ),
  240. Expanded(child: Container()),
  241. IconDelete()
  242. ],
  243. ),
  244. ),
  245. Padding(
  246. padding: const EdgeInsets.all(8.0),
  247. child: Row(
  248. children: [
  249. Container(
  250. decoration: BoxDecoration(
  251. border: Border.all(color: Color(0xffCCA600)),
  252. borderRadius:
  253. BorderRadius.all(Radius.circular(20)),
  254. color: Color(0xffCCA600).withOpacity(0.2)),
  255. padding: const EdgeInsets.all(10.0),
  256. child: Image.asset(
  257. 'assets/images/vacation.png',
  258. width: 36,
  259. height: 36,
  260. fit: BoxFit.cover,
  261. ),
  262. ),
  263. Padding(
  264. padding: const EdgeInsets.all(8.0),
  265. child: Column(
  266. crossAxisAlignment: CrossAxisAlignment.start,
  267. children: [
  268. Text(
  269. 'Vacation',
  270. style: TextStyle(fontSize: 14),
  271. ),
  272. Text(
  273. 'Description of vacation',
  274. style: TextStyle(fontSize: 12),
  275. ),
  276. ],
  277. ),
  278. ),
  279. Expanded(child: Container()),
  280. IconDelete()
  281. ],
  282. ),
  283. ),
  284. Padding(
  285. padding: const EdgeInsets.all(8.0),
  286. child: Row(
  287. children: [
  288. Container(
  289. decoration: BoxDecoration(
  290. border: Border.all(color: Color(0xff6C8BA5)),
  291. borderRadius:
  292. BorderRadius.all(Radius.circular(20)),
  293. color: Color(0xff6C8BA5).withOpacity(0.24)),
  294. padding: const EdgeInsets.all(10.0),
  295. child: Image.asset(
  296. 'assets/images/transportation.png',
  297. width: 36,
  298. height: 36,
  299. fit: BoxFit.cover,
  300. ),
  301. ),
  302. Padding(
  303. padding: const EdgeInsets.all(8.0),
  304. child: Column(
  305. crossAxisAlignment: CrossAxisAlignment.start,
  306. children: [
  307. Text(
  308. 'Transportation',
  309. style: TextStyle(fontSize: 14),
  310. ),
  311. Text(
  312. 'Description of transportation',
  313. style: TextStyle(fontSize: 12),
  314. ),
  315. ],
  316. ),
  317. ),
  318. Expanded(child: Container()),
  319. IconDelete()
  320. ],
  321. ),
  322. ),
  323. ],
  324. ),
  325. ),
  326. Card(
  327. child: Column(
  328. children: [
  329. Row(
  330. children: [
  331. Text(
  332. 'Available Menu',
  333. textAlign: TextAlign.left,
  334. ),
  335. ],
  336. ),
  337. Padding(
  338. padding: const EdgeInsets.all(8.0),
  339. child: Row(
  340. children: [
  341. Container(
  342. decoration: BoxDecoration(
  343. border: Border.all(color: Color(0xffCCA600)),
  344. borderRadius:
  345. BorderRadius.all(Radius.circular(20)),
  346. color: Color(0xffCCA600).withOpacity(0.2)),
  347. padding: const EdgeInsets.all(10.0),
  348. child: Image.asset(
  349. 'assets/images/food.png',
  350. width: 36,
  351. height: 36,
  352. fit: BoxFit.cover,
  353. ),
  354. ),
  355. Padding(
  356. padding: const EdgeInsets.all(8.0),
  357. child: Column(
  358. crossAxisAlignment: CrossAxisAlignment.start,
  359. children: [
  360. Text(
  361. 'Foods & Drinks',
  362. style: TextStyle(fontSize: 14),
  363. ),
  364. Text(
  365. 'Description of foods & drink',
  366. style: TextStyle(fontSize: 12),
  367. ),
  368. ],
  369. ),
  370. ),
  371. Expanded(child: Container()),
  372. IconAdd(),
  373. ],
  374. ),
  375. ),
  376. Padding(
  377. padding: const EdgeInsets.all(8.0),
  378. child: Row(
  379. children: [
  380. Container(
  381. decoration: BoxDecoration(
  382. border: Border.all(color: Color(0xff90D8F9)),
  383. borderRadius:
  384. BorderRadius.all(Radius.circular(20)),
  385. color: Color(0xff90D8F9).withOpacity(0.22)),
  386. padding: const EdgeInsets.all(10.0),
  387. child: Image.asset(
  388. 'assets/images/service.png',
  389. width: 36,
  390. height: 36,
  391. fit: BoxFit.cover,
  392. ),
  393. ),
  394. Padding(
  395. padding: const EdgeInsets.all(8.0),
  396. child: Column(
  397. crossAxisAlignment: CrossAxisAlignment.start,
  398. children: [
  399. Text(
  400. 'Services',
  401. style: TextStyle(fontSize: 14),
  402. ),
  403. Text(
  404. 'Description of services',
  405. style: TextStyle(fontSize: 12),
  406. ),
  407. ],
  408. ),
  409. ),
  410. Expanded(child: Container()),
  411. IconAdd(),
  412. ],
  413. ),
  414. ),
  415. Padding(
  416. padding: const EdgeInsets.all(8.0),
  417. child: Row(
  418. children: [
  419. Container(
  420. decoration: BoxDecoration(
  421. border: Border.all(color: Color(0xffAACEE0)),
  422. borderRadius:
  423. BorderRadius.all(Radius.circular(20)),
  424. color: Color(0xffAACEE0).withOpacity(0.31)),
  425. padding: const EdgeInsets.all(10.0),
  426. child: Image.asset(
  427. 'assets/images/additional.png',
  428. width: 36,
  429. height: 36,
  430. fit: BoxFit.cover,
  431. ),
  432. ),
  433. Padding(
  434. padding: const EdgeInsets.all(8.0),
  435. child: Column(
  436. crossAxisAlignment: CrossAxisAlignment.start,
  437. children: [
  438. Text(
  439. 'Additional',
  440. style: TextStyle(fontSize: 14),
  441. ),
  442. Text(
  443. 'Description of additional',
  444. style: TextStyle(fontSize: 12),
  445. ),
  446. ],
  447. ),
  448. ),
  449. Expanded(child: Container()),
  450. IconAdd(),
  451. ],
  452. ),
  453. ),
  454. ],
  455. ),
  456. ),
  457. ],
  458. ));
  459. }
  460. }
  461. class IconAdd extends StatelessWidget {
  462. const IconAdd({
  463. Key? key,
  464. }) : super(key: key);
  465. @override
  466. Widget build(BuildContext context) {
  467. return Icon(
  468. Icons.add_circle,
  469. color: Colors.red,
  470. );
  471. }
  472. }
  473. class IconDelete extends StatelessWidget {
  474. const IconDelete({
  475. Key? key,
  476. }) : super(key: key);
  477. @override
  478. Widget build(BuildContext context) {
  479. return Row(
  480. children: [
  481. Icon(
  482. Icons.do_not_disturb_on,
  483. color: Colors.red,
  484. ),
  485. Icon(Icons.dehaze),
  486. ],
  487. );
  488. }
  489. }