颤动时屏幕尺寸变小的屏幕尺寸问题

Question

在上面的代码中，我的 UI 运行正常，但是当屏幕尺寸变小时，UI 无法正常工作。如果屏幕尺寸变小，我不想使其可滚动。我想在屏幕尺寸变小时保持 UI 不变。UI 会很小，但一切都会像图像一样。

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Snake and Ladder'),
      ),
      body: Center(
        child: Stack(
          children: [
            Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Container(
                  margin: const EdgeInsets.symmetric(vertical: 20.0),
                  height: MediaQuery.of(context).size.height * 0.7, // Adjust the height as needed
                  child: GridView.builder(
                    padding: const EdgeInsets.all(5.0),
                    gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 10,
                      mainAxisSpacing: 10.0,
                      crossAxisSpacing: 0.1,
                      childAspectRatio: 0.8,
                    ),
                    itemCount: totalCells,
                    physics: const NeverScrollableScrollPhysics(),
                    itemBuilder: (context, index) {
                      .....
                   
                    },
                  ),
                ),
                GestureDetector(
                  onTap: () {
                    setState(() {
                      ....
                  },
                  child: Card(
                    margin: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
                    color: _getPlayerColor(_buildCell1),
                    child: Padding(
                      padding: const EdgeInsets.all(10.0),
                      child: Image.asset(
                        'assets/images/dice-$_diceNumber.png',
                        width: 50,
                      ),
                    ),
                  ),
                ),
              ],
            ),
            Positioned(
              top: 375.0, // Adjust the positioning as needed
              left: 220.0, // Adjust the positioning as needed
              child: Image.asset(
                'assets/images/snake-1.png',
                width: 100.0,
                height: 100.0,
              ),
            ),
            Positioned(
              top: 440.0, // Adjust the positioning as needed
              left: 20.0, // Adjust the positioning as needed
              child: Image.asset(
                'assets/images/snake-1.png',
                width: 100.0,
                height: 100.0,
              ),
            ),
            Positioned(
              top: 170.0, // Adjust the positioning as needed
              left: 260.0, // Adjust the positioning as needed
              child: Image.asset(
                'assets/images/snake-3.png',
                width: 100.0,
                height: 100.0,
              ),
            ),
            Positioned(
              top: 170.0, // Adjust the positioning as needed
              left: 160.0, // Adjust the positioning as needed
              child: Image.asset(
                'assets/images/snake-2.png',
                width: 100.0,
                height: 100.0,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildCell(int cellNumber, bool isPlayerLocation1, bool isPlayerLocation2) {
    bool isSnake = snakes.containsKey(cellNumber);
    return Container(
      decoration: BoxDecoration(
        border: Border.all(
          color: Colors.black,
          width: 1.0,
        ),
        color: _getCellColor(cellNumber),
      ),
      child: Center(
        child: Stack(
          children: [
            Icon(
              _locationIcon,
              size: 30.0,
              color: isPlayerLocation1 ? Colors.red : Colors.transparent,
            ),
            Icon(
              _locationIcon2,
              size: 30.0,
              color: isPlayerLocation2 ? Color.fromARGB(255, 199, 75, 248) : Colors.transparent,
            ),
            if (isSnake)
              Icon(
                Icons.arrow_downward,
                size: 20.0,
                color: Colors.brown,
              ),
            Text(
              '$cellNumber',
              style: const TextStyle(fontSize: 10.0),
            ),
          ],
        ),
      ),
    );
  }

Answer 1

只需将所有大部件放入 FittedBox 小部件中即可 在每一个中放入：，fit：BoxFit.contain，

FittedBox(fit: BoxFit.contain, 
 child: //your widget
),
 FittedBox(fit: BoxFit.contain, 
 child: //your widget
),
.......