欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Flutter實(shí)現(xiàn)仿微信底部菜單欄功能

 更新時(shí)間:2019年09月18日 09:10:07   作者:幻影坦克TG-009  
這篇文章主要介紹了Flutter實(shí)現(xiàn)仿微信底部菜單欄,需要的朋友可以參考下

在這里插入圖片描述

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget{
 @override
 Widget build(BuildContext context) {
  return MaterialApp(
   home: Scaffold(
    body: MyHomePage(),
   ),
  );
 }
}
class MyHomePage extends StatefulWidget{
 MyHomePage({Key key}) : super(key:key);
 @override
 _MyHomePageState createState() => _MyHomePageState();
 @override
 Widget build(BuildContext context) {
  // TODO: implement build
  return null;
 }
}
class _MyHomePageState extends State<MyHomePage>
{
 int _selectedIndex = 1;//當(dāng)前選中項(xiàng)的索引
 final _widgetOptions = [
  Text('Index 0: 微信'),
  Text('Index 1: 通訊錄'),
  Text('Index 2: 發(fā)現(xiàn)'),
  Text('Index 3:我')
 ];
 @override
 Widget build(BuildContext context) {
  return Scaffold(
   appBar: AppBar(
    title: Text('仿微信'),
   ),
   body: Center(
    child: _widgetOptions.elementAt(_selectedIndex),//居中顯示某個(gè)文本
   ),
   //底部導(dǎo)航按鈕,包含圖標(biāo)及文本
   bottomNavigationBar: BottomNavigationBar(
    items: <BottomNavigationBarItem>[
     BottomNavigationBarItem(icon: Icon(Icons.chat),backgroundColor:Colors.green,title: Text('微信')),//設(shè)置背景顏色和icon的描述
     BottomNavigationBarItem(icon: Icon(Icons.contacts),backgroundColor:Colors.green,title: Text('通訊錄')),
     BottomNavigationBarItem(icon: Icon(Icons.account_circle),backgroundColor:Colors.green,title: Text('發(fā)現(xiàn)')),
     BottomNavigationBarItem(icon: Icon(Icons.memory),backgroundColor:Colors.green,title: Text('我')),
     ],
//    backgroundColor: Colors.green,
    currentIndex: _selectedIndex,//當(dāng)前選中項(xiàng)的索引
    fixedColor: Colors.deepPurple,//選項(xiàng)中項(xiàng)的顏色
    onTap:_onItemTapped,//選擇按下處理
   ),
  );
 }
 //選擇按下處理
void _onItemTapped(int index)
{
 setState(() {
  _selectedIndex = index;
 });
}
}

總結(jié)

以上所述是小編給大家介紹的Flutter實(shí)現(xiàn)仿微信底部菜單欄功能,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
如果你覺得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!

相關(guān)文章

  • 用簡單的腳本實(shí)現(xiàn)一款漂亮的下拉菜單

    用簡單的腳本實(shí)現(xiàn)一款漂亮的下拉菜單

    用簡單的腳本實(shí)現(xiàn)一款漂亮的下拉菜單...
    2006-12-12
  • 鍵盤KeyCode值列表匯總

    鍵盤KeyCode值列表匯總

    這篇文章主要是對(duì)鍵盤KeyCode值進(jìn)行了詳細(xì)的匯總,需要的朋友可以過來參考下,希望對(duì)大家有所幫助
    2013-11-11
  • 防止頁面url緩存中ajax中post請(qǐng)求的處理方法

    防止頁面url緩存中ajax中post請(qǐng)求的處理方法

    這篇文章主要介紹了防止頁面url緩存中ajax中post請(qǐng)求的處理方式的相關(guān)資料,希望通過本文能幫助到大家,需要的朋友可以參考下
    2017-10-10
  • 8 行 Node.js 代碼實(shí)現(xiàn)代理服務(wù)器

    8 行 Node.js 代碼實(shí)現(xiàn)代理服務(wù)器

    JavaScript 前后端通吃,在全棧開發(fā)領(lǐng)域具有獨(dú)特的優(yōu)勢。今天就來看看作為服務(wù)端語言的 JavaScript,完成一個(gè)簡單的代理服務(wù)器功能是多么容易。
    2016-12-12
  • JavaScript數(shù)組問題解決的多種方法

    JavaScript數(shù)組問題解決的多種方法

    JavaScript數(shù)組問題多種方法小結(jié),眾多blueidea高手聯(lián)袂打造
    2008-07-07
  • JS 獲取頁面尺寸的方法詳解

    JS 獲取頁面尺寸的方法詳解

    通過 JS 獲取頁面相關(guān)的尺寸是比較常見的操作,尤其是在動(dòng)態(tài)計(jì)算頁面布局時(shí),今天我們就來學(xué)習(xí)一下幾個(gè)獲取頁面尺寸的基本方法,需要的朋友可以參考下
    2023-09-09
  • 淺析js預(yù)加載/延遲加載

    淺析js預(yù)加載/延遲加載

    本文主要介紹了js預(yù)加載和延時(shí)加載2種技術(shù),簡單分析了他們的實(shí)現(xiàn)方式和優(yōu)缺點(diǎn),非常的實(shí)用,有需要的朋友參考下
    2014-09-09
  • 純css實(shí)現(xiàn)窗戶玻璃雨滴逼真效果

    純css實(shí)現(xiàn)窗戶玻璃雨滴逼真效果

    css實(shí)現(xiàn)窗戶上水珠效果,效果特別逼真,窗外的雨淅淅瀝瀝飄打在玻璃上,看起來很像模糊的窗外,斜滴的雨露,接下來給大家一起來用CSS技術(shù)實(shí)現(xiàn)這樣一幅畫面,下面給大家分享使用純css實(shí)現(xiàn)窗戶玻璃雨滴逼真效果,感興趣的朋友快樂圍觀吧
    2015-08-08
  • Js代碼中的span拼接問題解決

    Js代碼中的span拼接問題解決

    這篇文章主要介紹了Js代碼中的span拼接問題解決,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
    2019-11-11
  • JavaScript逆向調(diào)試技巧總結(jié)分享

    JavaScript逆向調(diào)試技巧總結(jié)分享

    當(dāng)我們抓取網(wǎng)頁端數(shù)據(jù)時(shí),經(jīng)常被加密參數(shù)、加密數(shù)據(jù)所困擾,如何快速定位這些加解密函數(shù),尤為重要,下面這篇文章主要給大家介紹了關(guān)于JavaScript逆向調(diào)試技巧的相關(guān)資料,需要的朋友可以參考下
    2022-06-06

最新評(píng)論