时间戳

首页 > 解决方案 > 在颤动中塑造应用程序栏

flutter - 在颤动中塑造应用程序栏

问题描述

之前有人问过这个问题，没有直接答案：有没有办法让应用栏看起来像这张照片？

在此处输入图像描述

标签： flutterflutter-layout

解决方案

我不认为你可以用 AppBar 小部件来做到这一点，但你可以像这样构建自己的：不是我最好的代码，但我认为这可以帮助你了解如何做到这一点

Widget build(BuildContext context)
return Scaffold(
  body: SafeArea(
      child: SingleChildScrollView(
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            IconButton(
                onPressed: () {}, icon: const Icon(Icons.arrow_back)),
            Row(
              mainAxisAlignment: MainAxisAlignment.end,
              crossAxisAlignment: CrossAxisAlignment.end,
              children: [
                IconButton(
                    onPressed: () {}, icon: const Icon(Icons.search)),
                IconButton(
                  onPressed: () {},
                  icon: const Icon(Icons.notifications),
                ),
              ],
            )
          ],
        ),
        SizedBox(
          height: 40,
        ),
        Container(
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(30), color: Colors.green),
          height: MediaQuery.of(context).size.height,
        )
      ],
    ),
  )),
  floatingActionButton: FloatingActionButton(
    onPressed: _incrementCounter,
    tooltip: 'Increment',
    child: const Icon(Icons.add),
  ),
);

}`

推荐阅读