IndexedStack是Flutter中的一个布局组件,用于在多个子组件之间切换,并且只显现当时子组件。下面是关于运用IndexedStack的详细说明:
1.导入IndexedStack:
import 'package:flutter/material.dart';
2.创立IndexedStack:
IndexedStack(
index: 0, // 初始显现子组件的下标
children: [
// 子组件列表
Container(color: Colors.blue),
Container(color: Colors.green),
Container(color: Colors.red),
],
),
3.属性解析:
- index:代表当时显现的子组件的下标。比方上面设置为0,就是显现第1个子组件。如果改成1,则是显现第2个子组件。
- children:是一个列表,其间包括IndexedStack要显现的一切子组件。
4.完成原理
IndexedStack的完成原理其实很简单,只是在显现某个子组件时,将其他的子组件隐藏了。要完成这个功能,Flutter内部是经过一个Stack和多个Offstage完成的。
- Stack:是一个无限制巨细的布局模型,它的子组件能够叠放在一同。IndexedStack实际上就是一个Stack。
- Offstage:用于将一个组件隐藏,能够经过将其offstage属性设置为true来完成。
IndexedStack会将除了当时显现的子组件以外的一切子组件的offstage属性都设置为true,这样就完成了不显现这些子组件的目的。
注意事项:
- IndexedStack会同时加载一切的子组件,所以如果子组件比较多或者占用内存较大,这种方法可能会对功能产生影响。
- 当需要动态切换子组件时,能够经过修正index来完成,比方将index设置为一个变量,然后在需要切换时,修正这个变量即可。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。