代码之家  ›  专栏  ›  技术社区  ›  Jus10

颤振更改应用程序栏中大纲按钮的高度?

  •  1
  • Jus10  · 技术社区  · 6 年前

    只是想知道我如何改变 OutlineButton ?我想这也适用于其他按钮类型。

    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
        actions: <Widget> [
          SizedBox(
            width: 100.0,
            height: 8.0,
            child: OutlineButton(
              borderSide: BorderSide(width: 4.0)
              child: Text('Hi'),
              onPressed: (){},
            ),
          ),
        ],
       ),
      body: Container(),
    );
    

    我发现这个按钮对我的箱子来说太高了8像素,我想把它压扁一点。

    1 回复  |  直到 6 年前
        1
  •  5
  •   Phuc Tran    6 年前

    SizedBox 应该做这个工作。把你的纽扣用大号的盒子包起来。

    从文档中:

    如果给定了一个子对象,则此小部件将强制其子对象具有特定的宽度和/或高度(假定此小部件的父对象允许值)。如果宽度或高度为空,则该小部件将自行调整大小以匹配该维度中的子级大小。 如果没有给定子对象,这个小部件将自己调整到给定的宽度和高度,将空值视为零。

    这也适用于raisedbutton

    import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'My Layout',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: MyHomePage(),
        );
      }
    }
    
    class MyHomePage extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(
            title: new Text("SizedBox Demo"),
          ),
          body: new Center(
            child: new SizedBox(
              width: 200.0,
              height: 80.0,
              child: new OutlineButton(
                  borderSide: BorderSide(width: 4.0),
                  child: Text('I am a button'),
                  onPressed: (() {})),
            ),
          ),
        );
      }
    }
    

    更新日期(2018/05/26):

    如果你想降低AppBar中OutlineButton的高度,我想你可以使用填充

    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
        actions: <Widget> [
          Padding(
            child: OutlineButton(
              borderSide: BorderSide(width: 4.0)
              child: Text('Hi'),
              onPressed: (){},
              padding: EdgeInsets.all(10.0),
            ),
          ),
        ],
       ),
      body: Container(),
    );