面试题：Flutter中Material Design组件库之AppBar的常见属性及用法

Question

在Flutter的Material Design组件库中，AppBar是一个常用组件。请详细说明AppBar的一些常见属性，如title、leading、actions等的作用，并举例说明如何自定义AppBar的背景颜色和文字颜色。

Answer 1

AppBar常见属性

1. title：用于设置AppBar中间显示的标题内容，通常是一个Text组件，用于表明当前页面的主题或功能。例如：

AppBar(
  title: Text('首页'),
)

2. leading：通常放置在AppBar的左侧，一般用于返回按钮、菜单按钮等。例如设置一个返回按钮：

AppBar(
  leading: IconButton(
    icon: Icon(Icons.arrow_back),
    onPressed: () {
      Navigator.pop(context);
    },
  ),
)

3. actions：放置在AppBar的右侧，一般用于一些操作按钮，比如搜索、分享等。例如添加一个分享按钮：

AppBar(
  actions: [
    IconButton(
      icon: Icon(Icons.share),
      onPressed: () {
        // 分享逻辑
      },
    )
  ],
)

自定义AppBar背景颜色和文字颜色

1. 自定义背景颜色：通过backgroundColor属性来设置。例如设置为蓝色：

AppBar(
  backgroundColor: Colors.blue,
  title: Text('自定义背景颜色'),
)

2. 自定义文字颜色：可以通过foregroundColor属性设置AppBar内文字（包括标题、leading和actions中的文字）的颜色。例如设置为白色：

AppBar(
  foregroundColor: Colors.white,
  title: Text('自定义文字颜色'),
)