小编Ken*_*ith的帖子

如何删除 SliverAppBar 中的空白区域?

NestedScrollView在这里使用并尝试将一个参数放入函数中内置的参数TabBar中。工作正常,但看起来已经节省了一些空间,这使得标签栏看起来很奇怪,上面有大的填充。知道如何删除这个空间吗?提前致谢。bottomSliverAppBarheaderSliverBuilderTabBarSliverAppBartitle

动图

 @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;
    double screenHeight = MediaQuery.of(context).size.height;
    return Scaffold(
      body: SafeArea(
          child: NestedScrollView(
            headerSliverBuilder: (context, value){
              return[
                SliverOverlapAbsorber(
                  handle:NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                  sliver: SliverAppBar(
                    pinned: true,
                    floating: false,
                    expandedHeight: 500,
                    title: Text("Space that I don't want"),
                    centerTitle: true,
                    flexibleSpace: FlexibleSpaceBar(
                      collapseMode: CollapseMode.pin,
                      background: Container(
                        decoration: BoxDecoration(
                          color: Colors.white,
                          image: DecorationImage(
                            image: AssetImage("assets/images/classroom.png")
                          )
                        ),
                        child: Center(child: Text("Today's lesson cancelled", style: GoogleFonts.montserrat(textStyle: TextStyle(color: Colors.white, fontSize:20, fontWeight: …
Run Code Online (Sandbox Code Playgroud)

flutter sliverappbar

7
推荐指数
1
解决办法
8700
查看次数

我可以溢出容器中的小部件以使其像被剪裁一样吗?

我按照下图进行操作,但当我尝试制作白色气泡时遇到了一些困难。

在此输入图像描述

我尝试过使用OverFlowBox另一篇文章Flutter mask 将一个圆圈放入容器中的方法,但我将圆圈卡在了中间Container,我不知道为什么alignment无法帮助移动它。这是我尝试过的:

return Container(
  alignment: Alignment.topCenter,
  height: screenHeight/3.5,
  width: screenWidth/3.5,
  decoration: BoxDecoration(
    borderRadius: BorderRadius.only(
      topLeft: Radius.circular(10),
      topRight: Radius.circular(60),
      bottomLeft: Radius.circular(10),
      bottomRight: Radius.circular(10),
    ),
    gradient: LinearGradient(
      begin: FractionalOffset.topLeft,
      end: FractionalOffset.bottomRight,
      colors: [boxColorBegin, boxColorEnd]
    ),
  ),
  child: ClipRect(
    clipBehavior: Clip.hardEdge,
    child: OverflowBox(
      maxHeight: screenHeight/3.5 +20,
      maxWidth: screenWidth/3.5 + 20,
      child:Container(
        decoration: BoxDecoration(
          color: Colors.white,
          shape: BoxShape.circle,
        ),
      )
    ),
  ),
);
Run Code Online (Sandbox Code Playgroud)

结果是

在此输入图像描述

有什么方法可以溢出小部件内的某些内容,使其看起来像是被剪裁的吗?

提前致谢!

flutter

5
推荐指数
1
解决办法
5100
查看次数

标签 统计

flutter ×2

sliverappbar ×1