在Flutter中,可以通过使用OutlineButton
组件来创建一个轮廓按钮,使其看起来像一个带下划线的文本字段。下面是一个示例代码:
OutlineButton(
borderSide: BorderSide(color: Colors.blue), // 设置边框颜色
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.0), // 设置边框圆角
),
onPressed: () {
// 点击按钮触发的操作
},
child: Text(
'按钮文本',
style: TextStyle(
decoration: TextDecoration.underline, // 设置文本下划线
),
),
)
在上面的代码中,我们使用了OutlineButton
组件来创建一个轮廓按钮。通过borderSide
属性可以设置按钮的边框颜色,通过shape
属性可以设置按钮的边框圆角。在按钮的文本部分,我们使用了Text
组件,并通过TextStyle
的decoration
属性设置了文本的下划线样式。
这是一个简单的示例,你可以根据自己的需求进行进一步的定制和美化。如果你想了解更多关于Flutter的UI组件和样式的信息,可以参考腾讯云的Flutter开发文档:Flutter开发文档。
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云