flutter - Flutter - 将小部件一直对齐到卡片视图的末尾。（包括查看图片）

Question

我怎样才能让扁平按钮填充分隔线下方的区域一直到卡的末端，它似乎无法再往下走。

看到 FlatButton 下的空白区域了吗？我希望它看起来像 FlatButton 是结束。

不必是平面按钮，任何带有 onTap/press/（或带有手势检测器的黑客）监听器的小部件都可以。

飞镖代码是 ->

Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(4.0),
      child: Card(
        elevation: 5,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(15))
        ),
        child: Container(
          child: Column(
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.only(top: 24, bottom: 16),
                child: Text(_label, style: TextStyle(fontSize: 24, color: Color.fromARGB(190, 0, 0, 0), fontWeight: FontWeight.bold)),
              ),
              Divider(color: Colors.black26, height: 2,),
              Padding(
                padding: const EdgeInsets.all(24.0),
                child: Text(_information, style: TextStyle(fontSize: 20, color: Colors.black87)),
              ),
              Divider(color: Colors.black26, height: 2,),
              SizedBox(width: double.infinity, child: FlatButton(onPressed: () => _onTap(), color: Color.fromARGB(50, 100, 100, 100), child: Text('Done', style: TextStyle()), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5))))
            ],
          ),
        ),
      ),
    );
  }

标签： flutteruser-interfacedart

Answer 1

请看下面的代码，我正在使用 InkWell & Container ：

import 'package:flutter/material.dart';

final Color darkBlue = const Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      //theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    String _label = "";
    String _information = "";
    return Padding(
      padding: const EdgeInsets.all(4.0),
      child: Card(
        elevation: 5,
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(Radius.circular(15))),
        child: Container(
          child: Column(
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.only(top: 24, bottom: 16),
                child: Text(_label,
                    style: TextStyle(
                        fontSize: 24,
                        color: Color.fromARGB(190, 0, 0, 0),
                        fontWeight: FontWeight.bold)),
              ),
              Divider(
                color: Colors.black26,
                height: 2,
              ),
              Padding(
                padding: const EdgeInsets.all(24.0),
                child: Text(_information,
                    style: TextStyle(fontSize: 20, color: Colors.black87)),
              ),
              Divider(
                color: Colors.black26,
                height: 2,
              ),
              Spacer(),
              InkWell(
                onTap: () {}, //_onTap(),
                child: Container(
                  width: double.infinity,
                  height: 40,
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(5),
                      color: const Color.fromARGB(50, 100, 100, 100)),
                  child: const Center(child: Text('Done', style: TextStyle())),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}