如何在Flutter框架中添加渐变作为AppBar的背景

如何在Flutter框架中添加渐变作为AppBar的背景

我不认为您可以将渐变传递给AppBar，因为它期望使用Color而不是渐变。

但是，您可以创建自己的小部件来模仿AppBar，除非使用渐变。请看一下我从Planets-Flutter教程中拼凑而成的示例及其下面的代码。

import "package:flutter/material.dart";class Page extends StatelessWidget {  @override  Widget build(BuildContext context) {    return Column(children : <Widget>[GradientAppBar("Custom Gradient App Bar"), Container()],);  }}class GradientAppBar extends StatelessWidget {  final String title;  final double barHeight = 50.0;  GradientAppBar(this.title);  @override  Widget build(BuildContext context) {    final double statusbarHeight = MediaQuery        .of(context)        .padding        .top;    return new Container(      padding: EdgeInsets.only(top: statusbarHeight),      height: statusbarHeight + barHeight,      child: Center(        child: Text(          title,          style: TextStyle(fontSize: 20.0, color: Colors.white, fontWeight: FontWeight.bold),        ),      ),      decoration: BoxDecoration(        gradient: LinearGradient( colors: [Colors.red, Colors.blue], begin: const FractionalOffset(0.0, 0.0), end: const FractionalOffset(0.5, 0.0), stops: [0.0, 1.0], tileMode: TileMode.clamp        ),      ),    );  }}

希望这可以帮助。如果您有任何问题，请告诉我。