在flutter

Question

我正在尝试在我的flutter项目中使用BottomNavigationBar，我想向它提供项目。为此，我必须使用items属性。但是我无法在BottomNavigationBar中找到items属性。请参阅附图。

这是完整的代码：

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    // This method is rerun every time setState is called, for instance
    // as done by the _incrementCounter method above.
    // The Flutter framework has been optimized to make rerunning
    // build methods fast, so that you can just rebuild anything that
    // needs updating rather than having to individually change
    // instances of widgets.
    return new Scaffold(
      appBar: new AppBar(
        // Here we take the value from the MyHomePage object that
        // was created by the App.build method, and use it to set
        // our appbar title.
        title: new Text(config.title),
      ),
      bottomNavigationBar: new BottomNavigationBar(
        currentIndex: 0,
        onTap: (value){

        },
      ),
      // a style that looks nicer for build methods.
    );
  }
}

Answer 1

似乎事情已经发生了变化，就像更新版本的Dart插件一样。我通过以下代码实现了相同的功能（请注意，现在我们必须使用具有labels属性的Map）：

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'App Name',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'App Name'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  var bottomBarLabels = [
    new DestinationLabel(
        icon: new Icon(Icons.live_tv), title: new Text("Live")),
    new DestinationLabel(
        icon: new Icon(Icons.date_range), title: new Text("Matches")),
  ];

  @override
  Widget build(BuildContext context) {
    void _handleBottomNavigationBarTap(int newValue) {
      switch (newValue) {
        case 0:
          print("Live Clicked");
//          Scaffold.of(context).showSnackBar(new SnackBar(
//                content: new Text("Live Clicked"),
//              ));
          break;
        case 1:
          print("Matches Clicked");
//          Scaffold.of(context).showSnackBar(new SnackBar(
//                content: new Text("Matches Clicked"),
//              ));
          break;
      }
    }

    return new Scaffold(
      appBar: new AppBar(
        title: new Text(config.title),
      ),
      bottomNavigationBar: new BottomNavigationBar(
          labels: bottomBarLabels, onTap: _handleBottomNavigationBarTap),
    );
  }
}

Answer 2

您确定拥有最新版本的颤振吗？据我所知，目标标签在2016年12月转换为提交中的项目： https://github.com/flutter/flutter/commit/1b9939af9547513061d2e30716f182b490f5362b#diff-f907c739b721784b11a7fec0459d384f

Answer 3

我能够items使用BottomNavigationBar而不会遇到任何问题。

import 'package:flutter/material.dart';

void main() {
  runApp(new MaterialApp(
      home: new MyApp()));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Bottom Navigation"),
      ),
      bottomNavigationBar: new BottomNavigationBar(
        items: [new BottomNavigationBarItem(
            icon: new Icon(Icons.account_box), title: new Text("Account")),
        new BottomNavigationBarItem(
            icon: new Icon(Icons.add), title: new Text("Add")),
        new BottomNavigationBarItem(
            icon: new Icon(Icons.close), title: new Text("Close")),
        ],

      ),

    );
  }
}