Flutter for 微信demo
-
微信Tabbar&Navigator
image.png
import 'package:flutter/material.dart';
class App extends StatefulWidget {
@override
MainState createState() => MainState();
}
class MainState extends State {
var _currentIndex = 0;
_popupMenuItem(String title, {String imagePath, IconData icon}) {
return PopupMenuItem(
child: Row(
children: [
imagePath != null
? Image.asset(
imagePath,
width: 32.0,
height: 32.0,
)
: SizedBox(
width: 32.0,
height: 32.0,
child: Icon(
icon,
color: Colors.white,
),
),
Container(
padding: const EdgeInsets.only(left: 20),
child: Text(
title,
style: TextStyle(color: Colors.white),
),
),
],
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('微信'),
actions: [
GestureDetector(
onTap: () {
Navigator.pushNamed(context, 'search');
},
child: Icon(
Icons.search,
),
),
Padding(
padding: const EdgeInsets.only(left: 20.0, right: 20.0),
child: GestureDetector(
onTap: () {
showMenu(
context: context,
position: RelativeRect.fromLTRB(500.0, 86.0, 25.0, 0.0),
items: [
_popupMenuItem('发起群聊',
imagePath: 'images/2x/[email protected]'),
_popupMenuItem('扫一扫')
],
);
},
child: Icon(Icons.add_a_photo),
),
)
],
),
bottomNavigationBar: new BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: _currentIndex,
onTap: ((index) {
setState(() {
_currentIndex = index;
});
}),
items: [
new BottomNavigationBarItem(
title: new Text(
'微信',
style: TextStyle(
color: _currentIndex == 0
? Color(0xFF03c40e)
: Color(0xff999999),
fontSize: 14.0),
),
icon: _currentIndex == 0
? Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)
: Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)),
new BottomNavigationBarItem(
title: new Text(
'通讯录',
style: TextStyle(
color: _currentIndex == 1
? Color(0xFF03c40e)
: Color(0xff999999),
fontSize: 14.0),
),
icon: _currentIndex == 1
? Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)
: Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)),
new BottomNavigationBarItem(
title: new Text(
'发现',
style: TextStyle(
color: _currentIndex == 2
? Color(0xFF03c40e)
: Color(0xff999999),
fontSize: 14.0),
),
icon: _currentIndex == 2
? Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)
: Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)),
new BottomNavigationBarItem(
title: new Text(
'我的',
style: TextStyle(
color: _currentIndex == 3
? Color(0xFF03c40e)
: Color(0xff999999),
fontSize: 14.0),
),
icon: _currentIndex == 3
? Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
)
: Image.asset(
'images/2x/[email protected]',
width: 32.0,
height: 28.0,
))
],
),
// body: currentPage(),
);
}
}