flutter 我如何使多个图标去不同的网址

u3r8eeie  于 2022-11-25  发布在  Flutter
关注(0)|答案(1)|浏览(180)

我的应用程序有一些图标,问题是我将图标设置为一个图标的扩展/父图标,所以当我将一个图标设置为转到一个URL时,所有其他图标也会转到该URL。但这不是我想要的,我希望每个图标都转到一个单独的URL。扩展图标的代码是:`

  1. Row(
  2. children: [
  3. Expanded(
  4. child: TaskCard(
  5. label: "Teachers",
  6. )),
  7. Expanded(
  8. child: TaskCard(
  9. imageUrl: "assets/school-bag.png",
  10. label: "EduPage",
  11. pageUrl: "https://willowcosta.edupage.org",
  12. )),

`
显示错误:x1c 0d1x,父图标的代码为:

  1. SizedBox(
  2. height: 20.0,
  3. ),
  4. Text(
  5. "Sections",
  6. style: TextStyle(
  7. fontSize: 20.0,
  8. fontWeight: FontWeight.bold,
  9. fontFamily: "SpaceGrotesk",
  10. color: Colors.black),
  11. ),
  12. //Here we set the "Shortcuts"
  13. //If you click Teachers it will take you the page where you can see the Teachers -
  14. //names a nd availabity alongs side the subject they teach
  15. //If you click EduPage it takes you to edupage
  16. //If you click Timetable it takes you to the Timetable generator
  17. //If you click Messages it asks you to join a messenger Gc of Students of your class
  18. Row(
  19. children: [
  20. Expanded(
  21. child: TaskCard(
  22. label: "Teachers",
  23. )),
  24. Expanded(
  25. child: TaskCard(
  26. imageUrl: "assets/school-bag.png",
  27. label: "EduPage",
  28. pageUrl: "https://willowcosta.edupage.org",
  29. )),
  30. Expanded(
  31. child: TaskCard(
  32. imageUrl: "assets/timetable.png",
  33. label: "Timetable",
  34. )),
  35. Expanded(
  36. child: TaskCard(
  37. imageUrl: "assets/message.png",
  38. label: "Messages",
  39. )),
  40. ],
  41. ),
  42. //Here we set the tasks that we have
  43. const SizedBox(
  44. height: 20.0,
  45. ),
  46. const Text(
  47. "You have 6 tasks for this week",
  48. style: TextStyle(
  49. fontSize: 20.0,
  50. fontWeight: FontWeight.bold,
  51. fontFamily: "SpaceGrotesk",
  52. color: Colors.black),
  53. ),
  54. const TaskContainer(),
  55. const TaskContainer(),
  56. const TaskContainer(),
  57. const TaskContainer(),
  58. const TaskContainer(),
  59. const TaskContainer(),
  60. const SizedBox(
  61. height: 100.0,
  62. ),
  63. ],
  64. ),
  65. ),
  66. ),
  67. bottomSheet: const BottomSheetCard(),
  68. );
  69. }
  70. }
  71. //hier the first class ends
  72. class TaskCard extends StatelessWidget {
  73. final String? imageUrl;
  74. final String? label;
  75. const TaskCard({Key? key, this.imageUrl, this.label}) : super(key: key);
  76. //Function to launch the selected url
  77. Future<void> goToWebPage(String urlString) async {
  78. final Uri _url = Uri.parse(urlString);
  79. if (!await launchUrl(_url)) {
  80. throw 'Could not launch $_url';
  81. }
  82. }
  83. @override
  84. Widget build(BuildContext context) {
  85. return Padding(
  86. //Here we set the properties of our Sections (Teachers etc)
  87. padding: const EdgeInsets.all(8.0),
  88. child: Column(
  89. children: [
  90. Container(
  91. height: 80.0,
  92. width: 76.1,
  93. decoration: BoxDecoration(
  94. color: Colors.white,
  95. borderRadius: BorderRadius.circular(20.0),
  96. boxShadow: [
  97. BoxShadow(
  98. color: Colors.grey, blurRadius: 2.0, spreadRadius: 0.5),
  99. ]),
  100. child: IconButton(
  101. onPressed: () async {
  102. await goToWebPage(pageUrl);
  103. },
  104. icon: Image.asset(
  105. imageUrl ?? "assets/teacher.png",
  106. height: 75.0,
  107. width: 70.0,
  108. ),
  109. ),
  110. ),
  111. SizedBox(
  112. height: 10.0,
  113. ),
  114. Text(
  115. label ?? "",
  116. style: TextStyle(fontSize: 16.0),
  117. )
  118. ],
  119. ),
  120. );
  121. }
  122. }

显示错误2:

我的应用程序看起来像这样:

我希望每个图标都能将我带到不同的网站

ldioqlga

ldioqlga1#

parent icon中,您可以在构造函数中定义新的字符串变量,并将其命名为pageUrl,就像其他两个变量imageUrllabel一样,现在使用它如下:

  1. onPressed: () async {
  2. await goToWebPage(pageUrl);
  3. },

然后像这样传递:

  1. Expanded(
  2. child: TaskCard(
  3. imageUrl: "assets/school-bag.png",
  4. label: "EduPage",
  5. pageUrl: "https://willowcosta.edupage.org",
  6. ),
  7. ),

任务卡类的完整示例:

  1. class TaskCard extends StatelessWidget {
  2. final String imageUrl;
  3. final String label;
  4. final String pageUrl;//<-- add this
  5. const TaskCard(
  6. {Key? key,
  7. required this.imageUrl,
  8. required this.label,
  9. required this.pageUrl})//<-- add this
  10. : super(key: key);
  11. @override
  12. Widget build(BuildContext context) {
  13. return Padding(
  14. padding: const EdgeInsets.all(8.0),
  15. child: Column(
  16. children: [
  17. Container(
  18. height: 80.0,
  19. width: 76.1,
  20. decoration: BoxDecoration(
  21. color: Colors.white,
  22. borderRadius: BorderRadius.circular(20.0),
  23. boxShadow: [
  24. BoxShadow(
  25. color: Colors.grey, blurRadius: 2.0, spreadRadius: 0.5),
  26. ]),
  27. child: IconButton(
  28. onPressed: () async {
  29. await goToWebPage(pageUrl);//<-- add this
  30. },
  31. icon: Image.asset(
  32. imageUrl ?? "assets/teacher.png",
  33. height: 75.0,
  34. width: 70.0,
  35. ),
  36. ),
  37. ),
  38. SizedBox(
  39. height: 10.0,
  40. ),
  41. Text(
  42. label ?? "",
  43. style: TextStyle(fontSize: 16.0),
  44. )
  45. ],
  46. ),
  47. );
  48. }
  49. }
展开查看全部

相关问题