Flutter 提供了多种内置按钮,可以满足不同场景的需求。本文将介绍 Flutter 中常见的按钮类型,以及它们的属性和使用方法。
按钮类型
Flutter 中常见的按钮类型包括:
- ElevatedButton: 凸起按钮,默认带有阴影和灰色背景。
- TextButton: 扁平按钮,默认背景透明并不带阴影。
- OutlineButton: 边框按钮,默认有一个边框,不带阴影且背景透明。
- IconButton: 图标按钮,仅包含一个图标。
- FloatingActionButton: 浮动按钮,通常用于显示在屏幕右下角,执行重要的操作。
按钮属性
Flutter 按钮的通用属性包括:
- onPressed: 点击按钮时触发的回调函数。
- onLongPress: 长按按钮时触发的回调函数。
- child: 按钮的内容,可以是文本、图标或其他 Widget。
- color: 按钮的颜色。
- shape: 按钮的形状。
- elevation: 按钮的阴影高度。
- highlightElevation: 按钮按下时的阴影高度。
- disabledColor: 按钮禁用时的颜色。
- splashColor: 按钮按下时出现的涟漪颜色。
按钮使用示例
以下是使用不同类型按钮的示例:
示例 1:使用 ElevatedButton
ElevatedButton(onPressed: () {// 点击按钮时触发},child: Text('点击'),
),
示例 2:使用 TextButton
TextButton(onPressed: () {// 点击按钮时触发},child: Text('点击'),
),
示例 3:使用 OutlineButton
OutlineButton(onPressed: () {// 点击按钮时触发},child: Text('点击'),
),
示例 4:使用 IconButton
IconButton(onPressed: () {// 点击按钮时触发},icon: Icon(Icons.add),
),
示例 5:使用 FloatingActionButton
FloatingActionButton(onPressed: () {// 点击按钮时触发},child: Icon(Icons.add),
),
总结
Flutter 提供了多种内置按钮,可以满足不同场景的需求。通过设置不同的属性,可以自定义按钮的外观和行为。