flutter 如何删除图片后面白色空白

r1wp621o 于 2023-02-13 发布在 Flutter

关注(0)|答案(1)|浏览(179)

我怎样才能使图片周围的背景透明。

下面是屏幕的代码：

body: Column(
          children: [
            Expanded(child: SingleChildScrollView(child: Text("loooong text"))),
            TypeChallengeWidget(),
          ],
        )

这是类型挑战小部件：

Widget build(BuildContext context) {
    final screenHeight = MediaQuery.of(context).size.height;
    final screenWidth = MediaQuery.of(context).size.width;
    return Stack(
      children: [
        Container(
          margin: EdgeInsets.only(top: screenHeight * 0.1 / 2),
          decoration: BoxDecoration(
            color: Colors.transparent.withOpacity(0.5),
            borderRadius: BorderRadius.only(topLeft: Radius.circular(15), topRight: Radius.circular(15))),
          child: Padding(
            padding: EdgeInsets.symmetric(vertical: screenHeight * 0.1/1.5, horizontal: 20),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text("Test:"),
                Row(children: [
                  const Flexible(child: TextField(keyboardType: TextInputType.name, autocorrect: false,)),
                  ElevatedButton(
                    style: ElevatedButton.styleFrom(
                      backgroundColor: Colors.green,
                      shape: const CircleBorder(),
                      padding: const EdgeInsets.all(20),
                    ),
                    onPressed: (){}, 
                    child: const Text(">"))
                ],)
                
              ],
            ),
          ),
        ),
        Align(
          alignment: Alignment.topCenter,
          child: SvgPicture.asset("img", height: screenHeight*0.1,)),
      ]
      );
  }

我试着把堆栈到容器，使它透明，但它不工作.

flutter

来源：https://stackoverflow.com/questions/75403742/how-to-remove-white-space-behind-the-picture

1条答案

按热度按时间

iszxjhcz1#

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    final screenHeight = MediaQuery.of(context).size.height;
    final screenWidth = MediaQuery.of(context).size.width;
    return Column(
      children: [
        Expanded(
          child: SingleChildScrollView(
            child: Wrap(
              children: List.generate(300, (index) => Text("loooong text")),
            ),
          ),
        ),
        Stack(
          alignment: Alignment.topCenter,
          fit: StackFit.passthrough,
          clipBehavior: Clip.none,
          children: [
            Container(
              // margin: EdgeInsets.only(top: screenHeight * 0.1 / 2),
              decoration: BoxDecoration(
                color: Colors.transparent.withOpacity(0.5),
                borderRadius: const BorderRadius.only(
                  topLeft: Radius.circular(15),
                  topRight: Radius.circular(15),
                ),
              ),
              child: Padding(
                padding: EdgeInsets.symmetric(
                    vertical: screenHeight * 0.1 / 1.5, horizontal: 20),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text("Test:"),
                    Row(
                      children: [
                        const Flexible(
                            child: TextField(
                          keyboardType: TextInputType.name,
                          autocorrect: false,
                        )),
                        ElevatedButton(
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Colors.green,
                              shape: const CircleBorder(),
                              padding: const EdgeInsets.all(20),
                            ),
                            onPressed: () {},
                            child: const Text(">"))
                      ],
                    )
                  ],
                ),
              ),
            ),
            Positioned(
              top: -(screenHeight * 0.1 / 2),
              child: SvgPicture.asset(
                "assets/report.svg",
                height: screenHeight * 0.1,
              ),
            ),
          ],
        ),
      ],
    );
  }
}

您可以向堆栈小部件对齐方式添加2个参数：对齐方式. top居中，剪切行为：夹子。没有，
以及重构具有定位的图像小部件，并从容器中移除到最上面定位的小部件的边距

我希望这会有所帮助

赞(0）回复(0）举报 2023-02-13

我来回答

flutter 如何删除图片后面白色空白

1条答案

相关问题

热门标签

最新问答