flutter - Flutter Carousel no Image 等一些困难

问题描述

我是 Flutter 和应用程序开发的新手。我试图实现一个 STAEFUL 轮播，当单击轮播中的图像时，它会响应并重定向到某个链接。

以下是我面临的问题。

如果我实施手势检测器或 Inkwell，我不知道如何使轮播图像有状态？
每个图像都必须在 [LIST] 中进行标记，还是整个轮播都可以使用单个墨水池或手势检测器进行标记？
请看一下代码，是否可以将重定向地址映射为列表！（这会更容易添加图像，但这里困扰我的是，每次添加新图像地址和相应的重定向链接时，我是否必须重新编译并将应用程序上传到 AppStore？）
最重要的是，轮播不只显示图片的 URL

这些在这部分代码中是什么意思？

[列表].map((i) {}

和

'文本 $i'

 items: [imgList].map((i) {
          return Container(
              width: MediaQuery.of(context).size.width,
              margin: EdgeInsets.symmetric(horizontal: 5.0),
              decoration: BoxDecoration(color: Colors.blueAccent),
              child: Text('text $i', style: TextStyle(fontSize: 16.0),)
          );

这是整个代码


import 'package:flutter/material.dart';
import 'package:carousel_slider/carousel_slider.dart';
//import 'package:carousel_slider/carousel_controller.dart';
import 'package:carousel_slider/carousel_options.dart';






 List<String> imgList =

 [
   'https://static.scientificamerican.com/sciam/cache/file/92E141F8-36E4-4331-BB2EE42AC8674DD3_source.jpg',
   'https://icatcare.org/app/uploads/2018/07/Thinking-of-getting-a-cat.png',
];







 List<String> redirectList =
 [
   'img 1 redirect link',
   'img 2 redirect link',
 ];      //yet to be configured








class VerticalSliderDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: CarouselSlider(

        options: CarouselOptions(
          aspectRatio: 2.0,
          enlargeCenterPage: true,
          scrollDirection: Axis.horizontal,
          autoPlay: true,
          autoPlayInterval: Duration(seconds: 3),
          autoPlayAnimationDuration: Duration(milliseconds: 800),
          autoPlayCurve: Curves.fastOutSlowIn,

        ),


        items: [imgList].map((i) {
          return Container(
              width: MediaQuery.of(context).size.width,
              margin: EdgeInsets.symmetric(horizontal: 5.0),
              decoration: BoxDecoration(color: Colors.blueAccent),
              child: Text('text $i', style: TextStyle(fontSize: 16.0),)
          );
        }
        ).toList(),
      ),

    );
  }
}

标签： flutterdartcarousel

https://github.com/Amit506/courouselexample

在这个链接中，我上传了正确的工作盘滑块。如果您想知道文本小部件和图像小部件之间的区别，您应该参考flutter的官方文档，他们已经编写了小部件的所有信息。 https://api.flutter.dev/flutter/widgets/Image-class.html

https://github.com/Amit506/dart-foods/blob/main/lib/TabBars.dart/TabBar1.dart

在这个链接中，我在我的一个项目中使用了 corousel builder，您可以参考它来获取高级 corousel 滑块。

flutter - Flutter Carousel no Image 等一些困难

问题描述

解决方案

推荐阅读