zoukankan      html  css  js  c++  java
  • Flutter 原生TabBar切换标签页示例

    效果图:

    代码如下:

    import 'package:flutter/material.dart';
    
    class TabsTestPage extends StatefulWidget {
      _TabsTestPageState createState() => _TabsTestPageState();
    }
    
    class _TabsTestPageState extends State<TabsTestPage> {
      @override
      Widget build(BuildContext context) {
        return Container(
          height: 500.0,
          child: MyTabbedPage(),
        );
      }
    }
    
    class MyTabbedPage extends StatefulWidget {
      _MyTabbedPageState createState() => _MyTabbedPageState();
    }
    
    class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderStateMixin {
      final List<Tab> myTabs = <Tab>[
        Tab(text: 'LEFT'),
        Tab(text: 'RIGHT'),
      ];
    
      TabController _tabController;
    
      @override
      void initState() {
        super.initState();
        _tabController = TabController(vsync: this, length: myTabs.length);
      }
    
     @override
     void dispose() {
       _tabController.dispose();
       super.dispose();
     }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Tabs'),
            bottom: TabBar(
              controller: _tabController,
              tabs: myTabs,
            ),
          ),
          body: TabBarView(
            controller: _tabController,
            children: myTabs.map((Tab tab) {
              return Center(child: Text(tab.text));
            }).toList(),
          ),
        );
      }
    }
  • 相关阅读:
    springboot + mybatis-pagehelper 参数查询不分页的bug。。。
    不错位的java .class 反编译工具推荐
    git 生成ssh keys
    Spring boot 通用配置文件模板
    Shiro系列(3)
    Shiro系列(2)
    Shiro系列(1)
    updating
    前端速查手册——Note
    Java进阶知识与技术
  • 原文地址:https://www.cnblogs.com/joe235/p/11692868.html
Copyright © 2011-2022 走看看