flutter-appbar - 颤动中的自定义圆形应用栏

Question

自定义应用栏的屏幕截图:

我想制作一个像照片一样的自定义应用栏任何人都可以帮助我创建这个我已经搜索了很多但没有找到任何地方

Answer 1

我不认为它是一个圆形的appBar，而是它下面的一个圆形的容器。

我在Scaffold中添加了backgroundColor，它与AppBar的背景颜色相匹配。另外，我已将 AppBar 的 elevation 设置为 0 以防止阴影。

import 'package:flutter/material.dart';

class TempMyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Test App',
      home: Scaffold(
        backgroundColor: Colors.indigo.shade800,
        appBar: AppBar(
          title: Text(
            'Test App',
          ),
          elevation: 0,
          backgroundColor: Colors.indigo.shade800,
        ),
        body: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(60),
              topRight: Radius.circular(60),
            ),
            color: Colors.white,
          ),
        ),
      ),
    );
  }
}