Android 使用“时如何根据手机大小调整图像大小”；旋转滑梯；然后把按钮文本放在图像上？

我正在尝试为我的应用程序创建简介漫游滑块，但我无法正确操作。使用pub.dev提供的旋转木马滑动条。我无法将图像填充到整个手机屏幕。它在左右两侧都留下了一些空白

使用旋转木马Pro，我无法在滑动图像上放置按钮或文本。我花了几个小时在一些小问题上，但没能实现我想要的

这是密码

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


void main() {
  runApp(MaterialApp(
    home: MyApp(), // Making initializing home sceen
  ));
}

List<String> imgList = [
  "lib/assets/images/sunset.jpg",
  "lib/assets/images/sample3.jpg",
  "lib/assets/images/sample2.jpg",
  "lib/assets/images/sunshine.jpg",
  "lib/assets/images/leaf.png",


];
int current = 0;

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  // var _userName = TextEditingController();

  @override
  Widget build(BuildContext context) {
    Container(
              child: ImageCarousel(),
            );
}


class ImageCarousel extends StatefulWidget {
  @override
  _ImageCarouselState createState() => _ImageCarouselState();
}

class _ImageCarouselState extends State<ImageCarousel> {
  @override
  Widget build(BuildContext context) {

// >>>>>>>>>>>>  C A R O U S E L    S L I D E R    C O D E

    return CarouselSlider(
      height: double.infinity,
      initialPage: 0,
      enableInfiniteScroll: false,
      onPageChanged: (index) {
        setState(() {
          current = index;
        });
      },
      items: imgList.map((imgUrl) {
        return Builder(
          builder: (BuildContext context) {
            return Container(
              //width: MediaQuery.of(context).size.width,
              width: double.infinity,
              margin: EdgeInsets.symmetric(horizontal: 1),
              decoration: BoxDecoration(
                color: Colors.green,
              ),
              child: Image(
                image: AssetImage(
                  imgUrl,
                ),
                fit: BoxFit.cover,
              ),
            );
          },
        );
      }).toList(),
    );
  }
}

import'package:carousel_slider/carousel_slider.dart'；
进口“包装：颤振/材料.省道”；
void main（）{
runApp（材料应用程序）(
home:MyApp（），//正在初始化home-sceen
));
}
列表imgList=[
“lib/assets/images/sunset.jpg”，
“lib/assets/images/sample3.jpg”，
“lib/assets/images/sample2.jpg”，
“lib/assets/images/sunshine.jpg”，
“lib/assets/images/leaf.png”，
];
int电流=0；
类MyApp扩展了StatefulWidget{
@凌驾
_MyAppState createState（）=>\u MyAppState（）；
}
类MyAppState扩展了状态{
//var_userName=TextEditingController（）；
@凌驾
小部件构建（构建上下文）{
容器(
子项：ImageCarousel（），
);
}
类ImageCarousel扩展StatefulWidget{
@凌驾
_ImageCarouseState createState（）=>\u ImageCarouseState（）；
}
类_ImageCarouselState扩展状态{
@凌驾
小部件构建（构建上下文）{
//>>>>>>>>>>>>>C A R O U S E L S L I D R C O D E
回程转盘滑翔机(
高度：双无限，
初始页：0，
启用无限滚动：false，
onPageChanged:（索引）{
设置状态（）{
电流=指数；
});
},
项目：imgList.map（（imgUrl）{
返回生成器(
生成器：（BuildContext上下文）{
返回容器(
//宽度：MediaQuery.of（context）.size.width，
宽度：double.infinity，
边缘：边缘组。对称（水平：1），
装饰：盒子装饰(
颜色：颜色。绿色，
),
孩子：图像(
图片：资产评估(
伊姆古尔，
),
适合：BoxFit.cover，
),
);
},
);
}).toList（），
);
}
}

下面是更多说明的屏幕截图

使用pub.dev提供的Carousel_Pro，如何在图像上放置文本或按钮

class ImageCarousel extends StatefulWidget {
  @override
  _ImageCarouselState createState() => _ImageCarouselState();
}

class _ImageCarouselState extends State<ImageCarousel> {
  @override
  Widget build(BuildContext context) {
    return Carousel(
          images: [
          AssetImage("lib/assets/images/sample2.jpg"),
          AssetImage("lib/assets/images/sample3.jpg"),
        ]
    );

类ImageCarousel扩展StatefulWidget{
@凌驾
_ImageCarouseState createState（）=>\u ImageCarouseState（）；
}
类_ImageCarouselState扩展状态{
@凌驾
小部件构建（构建上下文）{
回程转盘(
图像：[
AssetImage（“lib/assets/images/sample2.jpg”），
AssetImage（“lib/assets/images/sample3.jpg”），
]
);

---

顺便说一句，我已经在pubspec.yaml中安装了所有软件包和图像。

用于旋转木马滑块以填充整个页面集：

viewportFraction:1.0

要将内容放在图像创建堆栈的顶部，请执行以下操作：

CarouselSlider(
          height: double.infinity,
          viewportFraction: 1.0,
          initialPage: 0,
          enableInfiniteScroll: false,
          items: imgList.map((imgUrl) {
            return Stack(
              children: <Widget>[
                Image(
                  height: double.infinity,
                  image: NetworkImage(
                    imgUrl,
                  ),
                  fit: BoxFit.cover,
                ),
                Text("TEST")
              ],
            );
          }).toList(),
        ))

CarouselSlider(
高度：双无限，
视口分数：1.0，
初始页：0，
启用无限滚动：false，
项目：imgList.map（（imgUrl）{
返回堆栈(
儿童：[
形象(
高度：双无限，
图片：NetworkImage(
伊姆古尔，
),
适合：BoxFit.cover，
),
文本（“测试”）
],
);
}).toList（），
))

如果你去掉了

容器中的
边距
，那会去掉侧面的空白吗？谢谢你的回复@BenjaminS。不，边距不会去掉空白。我故意把它放在那里是为了澄清。一旦我解决了问题，我会把它去掉。你真是个传奇。非常感谢你