SliverVisibility
显示或隐藏 sliver
。当sliver
不可见时,用replacementSliver
包起来。构造函数:
const SliverVisibility({
super.key,
required this.sliver,
this.replacementSliver = const SliverToBoxAdapter(),
this.visible = true,//子组件是否可见,默认true(可见)
this.maintainState = false,//用于确定在不可见时是否维护 sliver 子树的 State 对象
this.maintainAnimation = false,//不可见时,是否维持子组件中的动画
this.maintainSize = false,//不可见时是否留有空间(设置为true,会报错。如果想隐藏并保留组件空间请使用Opacity)
this.maintainSemantics = false,
this.maintainInteractivity = false,//允许在隐藏时进行交互
})
})
例子:
import 'package:flutter/material.dart';
class SliverVisibilityPage extends StatefulWidget {
const SliverVisibilityPage({Key? key}) : super(key: key);
@override
State<SliverVisibilityPage> createState() => _SliverVisibilityPageState();
}
class _SliverVisibilityPageState extends State<SliverVisibilityPage> {
bool _isVisible = true;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('SliverVisibility'),),
body: CustomScrollView(
slivers: [
SliverVisibility(
visible: _isVisible,
replacementSliver: SliverToBoxAdapter(
child: Container(
width: double.infinity,
height: 300,
color: Colors.blue,
child: const Center(
child: Text('图片隐藏时显示',style: TextStyle(color: Colors.white),),
),
),
),
sliver: SliverToBoxAdapter(
child:Container(
width: double.infinity,
height: 300,
alignment: Alignment.center,
decoration: const BoxDecoration(
image:DecorationImage(
image:AssetImage('images/liu.webp'),
alignment: Alignment.center,
fit: BoxFit.cover,
)
),
child: IconButton(
iconSize: 40,
icon: const Icon(Icons.ads_click),
onPressed: (){
setState(() {
_isVisible = !_isVisible;
});
},
),
)
),
)
],
),
);
}
}