我想在点击墨水池

时间:2018-06-15 10:32:12

标签: user-interface flutter

我想在点击页面中的墨水池后显示具有相同底部导航的不同页面。底部导航栏,其中包含主页和消息按钮..我想在我的应用程序中显示我的所有页面..我的主页面与我的主页按钮(位于底部导航栏)连接,我的所有墨水池都存在于那个页面..我的代码和截图在下面给出

主飞镖

    import 'package:flutter/material.dart';
import 'package:typeolx/MainPage.dart';
import 'colors.dart';
import 'package:typeolx/main_bottom_nav_bar.dart';
import 'package:typeolx/chatlistpage.dart';

void main() => runApp(
    new MaterialApp(
      theme: buildThemeData(),
      home: MainPage(),
    ));
ThemeData buildThemeData() {
  final baseTheme = ThemeData(
    fontFamily: "FiraCode",
  );

  return baseTheme.copyWith(
    primaryColor: kPrimaryColor,
    primaryColorDark: kPrimaryDark,
    primaryColorLight: kPrimaryLight,
    accentColor: kSecondaryColor,
    bottomAppBarColor: kSecondaryDark,
    buttonColor: kSecondaryColor,
    sliderTheme: SliderThemeData.fromPrimaryColors(
      primaryColor: kPrimaryColor,
      primaryColorDark: kPrimaryDark,
      primaryColorLight: kPrimaryLight,
      valueIndicatorTextStyle: TextStyle(),
    ),
    textTheme: TextTheme().copyWith(
        subhead: TextStyle(
          fontFamily: "SnackerComic",
        )),
  );
}
MainPageState mainPageState = new MainPageState();

class MainPage extends StatefulWidget {
  static final String routeName = '/MainPage';

  @override
  MainPageState createState() => mainPageState;
}


class MainPageState extends State<MainPage>
    with SingleTickerProviderStateMixin {

  void _rebuild() {
    setState(() {});
  }






  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor:
      currentIndex == 0 ? Theme.of(context).selectedRowColor : Colors.white,
      body: new SafeArea(
        child:
        currentIndex == 0 ? new MainScreen() : new ChatListPage(),
      ),
      bottomNavigationBar: new MainBottomNavBar(_rebuild),
      floatingActionButton:
      currentIndex != 0 ? null : buildSellButton(Icons.add_a_photo, 'eytrtv'),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }

  FloatingActionButton buildSellButton(IconData icon, String text) {
    return new FloatingActionButton.extended(
      onPressed: () {
        // TODO:
      },
      icon: new Icon(icon),
      label: new Text(text),
    );
  }


}

main_buttom_nav_bar

import 'package:flutter/material.dart';

MainBottomNavBarState mainBottomNavBarState = new MainBottomNavBarState();
int unReadMessageCount = 0;
int currentIndex = 0;

class MainBottomNavBar extends StatefulWidget {
  MainBottomNavBar(this.rebuild);

  final VoidCallback rebuild;

  @override
  MainBottomNavBarState createState() {
    return mainBottomNavBarState;
  }

  BottomNavigationBarItem buildBottomNavigationBarItem(BuildContext context,
      String title, IconData icon, bool shouldShowUnreadCount, int pos) {
    return new BottomNavigationBarItem(
      icon: !shouldShowUnreadCount
          ? new Icon(
        icon,
        size: 30.0,
        color: currentIndex == pos
            ? Theme.of(context).primaryColorDark
            : Theme.of(context).accentColor.withOpacity(0.7),
      )
          : new Stack(
        children: <Widget>[
          new Icon(
            icon,
            size: 30.0,
            color: currentIndex == pos
                ? Theme.of(context).primaryColorDark
                : Theme.of(context).accentColor.withOpacity(0.7),
          ),
          new Positioned(
            right: 0.0,
            top: 0.0,
            child: unReadMessageCount > 0
                ? new CircleAvatar(
              child: new Text(
                '$unReadMessageCount',
                style: new TextStyle(
                    fontSize: 11.0, color: Colors.white),
              ),
              backgroundColor: Colors.red,
              radius: 9.0,
            )
                : new Container(),
          ),
        ],
      ),
      title: new Text(title,
          style: new TextStyle(
            fontSize: 16.0,
            fontWeight: FontWeight.w600,
            color: currentIndex == pos
                ? Theme.of(context).primaryColorDark
                : Theme.of(context).accentColor.withOpacity(0.7),
          )),
    );
  }
}

class MainBottomNavBarState extends State<MainBottomNavBar> {


  onNavItemTapped(int pos) {
    currentIndex = pos;
    widget.rebuild();
  }

  @override
  Widget build(BuildContext context) {
    return new BottomNavigationBar(
      currentIndex: currentIndex,
      onTap: (selectedPosition) => onNavItemTapped(selectedPosition),
      items: <BottomNavigationBarItem>[
        widget.buildBottomNavigationBarItem(
            context, 'home', Icons.home, false, 0),
        widget.buildBottomNavigationBarItem(
            context, 'Chats', Icons.chat, true, 1),
      ],
    );
  }

}

enter image description here

0 个答案:

没有答案