Flutter新手求助：制作含文本与右下角IconButton的闪卡容器

下面是修正后的完整代码，实现了删除按钮位于闪卡容器右下角的需求：

import 'package:flutter/material.dart';

void main() => runApp(const MaterialApp(home: Home()));

class Home extends StatelessWidget {
  const Home({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.deepPurple[600],
      appBar: AppBar(
        title: const Text(
          "FlashCards",
          style: TextStyle(
            fontSize: 25.0,
            fontWeight: FontWeight.bold,
            color: Colors.black,
            fontFamily: 'ZenDots',
          ),
        ),
        centerTitle: true,
        backgroundColor: Colors.deepOrange[300],
      ),
      body: Column(
        children: <Widget>[
          Container(
            padding: const EdgeInsets.fromLTRB(10, 60, 100, 80),
            margin: const EdgeInsets.all(30.0),
            decoration: const BoxDecoration(
              borderRadius: BorderRadius.circular(15.0),
              color: Colors.amber,
            ),
            child: Stack(
              children: [
                const Text(
                  "Title:- \n\n\n\nAnswer:- ",
                  style: TextStyle(fontFamily: 'ZenDots', fontSize: 12),
                ),
                Align(
                  alignment: Alignment.bottomRight,
                  child: IconButton(
                    onPressed: () {
                      // 此处添加删除闪卡的逻辑
                    },
                    icon: const Icon(Icons.delete, color: Colors.black),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 此处添加新建闪卡的逻辑
        },
        child: const Text("+", style: TextStyle(fontSize: 25.0, color: Colors.black)),
        backgroundColor: Colors.amber,
      ),
    );
  }
}

关键修改说明： #

• 将原本独立的删除按钮容器整合到闪卡容器内部，通过Stack组件实现文本与按钮的重叠布局
• 使用Align组件并设置alignment: Alignment.bottomRight，把删除按钮固定在容器右下角
• 修复原代码语法错误：补充文本组件末尾缺失的逗号，移除BoxDecoration内无效的floatingActionButton字段
• 保留原有的字体、配色和圆角样式，确保视觉效果符合需求

内容的提问来源于stack exchange，提问作者Udbhav Dwivedi