首页 > 解决方案 > 样式问题,Container 或 SizedBox 中的斜边边框

问题描述

我正在尝试为学习而创建的应用程序中使用这种风格。现在我遇到的问题是我只能使用 RaisedButton 来制作它,但显然有时我需要它只是一个容器或 sizebox,没有点击效果。例如我使用这个代码:

Widget titleSettings(String title){
    return Container(
      margin: EdgeInsets.fromLTRB(80.0, 0.0, 80.0, 20.0),
      width: MediaQuery.of(context).size.width,
      child: new RaisedButton(
          padding: EdgeInsets.all(10.0),
          elevation: 0.0,
          color: Colors.white.withOpacity(.8),
          highlightElevation: 0.0,
          onPressed: () {
            print("titleSettingPressed");
          },
          splashColor: Colors.white.withOpacity(.8),
          highlightColor: Colors.white.withOpacity(.8),
          shape: BeveledRectangleBorder(
              side: BorderSide(color: Colors.black, width: 2.5),
              borderRadius: new BorderRadius.circular(15.0)),
          child: AutoSizeText("$title", style: TextStyle(fontSize: 30.0),),
      )
    );
  }

但在这种情况下,我不需要管理任何点击,它应该只包含一个像孩子一样的文本。 在此处输入图像描述

标签: dartflutter

解决方案


我从颤振包内的凸起按钮定义中提取了以下示例。检查它是否与您要达到的目标相同:

 child: Material(
  elevation: 0.0,
  type: MaterialType.button,
  color: Colors.white.withOpacity(.8),
  shape: BeveledRectangleBorder(
      side: BorderSide(color: Colors.black, width: 2.5),
      borderRadius: new BorderRadius.circular(15.0)),
  child: IconTheme.merge(
    data: IconThemeData(
      color: Colors.white.withOpacity(.8),
    ),
    child: Container(
      padding: EdgeInsets.all(10.0),
      child: Center(
        widthFactor: 1.0,
        heightFactor: 1.0,
        child: Text(
          "Timers",
          style: TextStyle(fontSize: 30.0),
        ),
      ),
    ),
  ),
),

推荐阅读