行縮小容器大小Flutter-有解無憂

我構建了以下手勢檢測器

GestureDetector(
child: Container(
    height: 9.h,
    decoration: BoxDecoration(
    color: Colors.black,
    shape: BoxShape.circle,
    boxShadow: [
        BoxShadow(
            color: Colors.grey.withOpacity(0.8),
            spreadRadius: 0,
                        blurRadius: 5,
                        offset: Offset(0, 4),),],),
    child: Center(child: Icon(CupertinoIcons.xmark, color: Colors.white, size:3.5.h,))),
        onTap: () {print("hey");},),

這會產生以下手勢檢測器
行縮小容器大小 Flutter

但是，當我用一行包裹它時，它變成了這樣：

行縮小容器大小 Flutter

為什么會發生這種情況，我該如何改變它？

謝謝！

uj5u.com熱心網友回復：

看看下面的代碼。我已經將它包裹在一個 Row 中。指定容器的高度和寬度您還可以將 GestureDetector 與 Expanded 包裹在 Row 內。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Material App Bar'),
        ),
        body: Row(
          children: [
            GestureDetector(
              child: Container(
                height: 300,
                width: 300,
                decoration: BoxDecoration(
                  color: Colors.black,
                  shape: BoxShape.circle,
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.8),
                      spreadRadius: 0,
                      blurRadius: 5,
                      offset: Offset(0, 4),
                    ),
                  ],
                ),
                child: Center(
                  child: Icon(
                    Icons.close,
                    color: Colors.white,
                    size: 100,
                  ),
                ),
              ),
              onTap: () {
                print("hey");
              },
            ),
          ],
        ),
      ),
    );
  }
}

轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/461118.html

標籤：扑用户界面

上一篇：沒有tkinter就不可能在python中創建GUI嗎？

下一篇：具有2種顏色WPF的對角拆分按鈕