Flutter学习笔记--仿闲鱼底部导航栏带有中间凸起图标，androidview绘制流程面试

State createState() {
return _HomePageState();
}
}

class _HomePageState extends State{
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Text(‘这是首页’),
),
),
);
}
}

这个三个页面的代码都一样就没有都贴出来

三.现在我们就需要去创建我们的主页了,"MainPage.dart"文件

第一步,我们先去实现一个最简单的底部导航栏

import ‘package:flutter/material.dart’;

import ‘HomePage.dart’;
import ‘AssistantPage.dart’;
import ‘MinePage.dart’;

class MainPage extends StatefulWidget {
@override
State createState() {
return _MainPage();
}
}

class _MainPage extends State with SingleTickerProviderStateMixin {
PageController pageController;
int page = 0;

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: new PageView(
children: [HomePage(), AssistantPage(), MinePage()],
controller: pageController,
onPageChanged: onPageChanged,
),
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), title: Text(‘首页’)),
BottomNavigationBarItem(icon: Icon(Icons.assessment), title: Text(‘助手’)),
BottomNavigationBarItem(icon: Icon(Icons.person), title: Text(‘我的’)),
],
onTap: onTap,
currentIndex: page,
),
));
}

@override
void initState() {
super.initState();
pageController = PageController(initialPage: this.page);
}

@override
void dispose() {
pageController.dispose();
super.dispose();