颤振中的脚手架

时间:2021-04-29 14:34:40

标签: flutter android-studio

我是 Flutter 的新手。我对我的项目中的脚手架有疑问。

我有一个主屏幕,用于显示 BottomNavigation 小部件。我想我也使用 if 作为容器来显示所有其他页面/屏幕,以便底部导航保持可见。代码如下:

class Home_Screen extends StatefulWidget {
  static const String id = 'home_screen';

  @override
  _Home_ScreenState createState() => _Home_ScreenState();
}

// ignore: camel_case_types
class _Home_ScreenState extends State<Home_Screen> {
  PageController _pageController = PageController();
  List<Widget> _screens = [
    AgentDashboardScreen(),
    TransactionDetailScreen(),
    AgentProfileScreen(),
  ];

  int _selectedIndex = 0;

  void _onPageChanged(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  void _itemTapped(int selectedIndex) {
    if (selectedIndex == 3) {
      Navigator.of(context).pushAndRemoveUntil(
        // the new route
        MaterialPageRoute(
          builder: (BuildContext context) => WelcomeScreen(),
        ),

        (Route route) => false,
      );
    } else {
      _pageController.jumpToPage(selectedIndex);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
        controller: _pageController,
        children: _screens,
        onPageChanged: _onPageChanged,
        physics: NeverScrollableScrollPhysics(),
      ),
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        onTap: _itemTapped,
        items: [
          BottomNavigationBarItem(
            icon: Icon(
              Icons.home,
              color: _selectedIndex == 0 ? Colors.blueAccent : Colors.grey,
            ),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.account_balance,
              color: _selectedIndex == 1 ? Colors.blueAccent : Colors.grey,
            ),
            label: 'Add Tran',
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.person,
              color: _selectedIndex == 2 ? Colors.blueAccent : Colors.grey,
            ),
            label: 'Profile',
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.album_outlined,
              color: _selectedIndex == 3 ? Colors.blueAccent : Colors.grey,
            ),
            label: 'Logout',
          ),
        ],
      ),
    );
  }
}

在我可以从 BottomNavigator 导航到的屏幕之一中,我遇到了键盘上方大片空白的问题。我已经读到在另一个脚手架中放置一个脚手架会导致这种情况。

那么,当我导航到下一页时,我是否在另一个脚手架内有一个脚手架?这是第二页的片段。

class TransactionDetailScreen extends StatefulWidget {
  static const String id = 'transaction_detail_screen';
  final QueryDocumentSnapshot trxns;
  //final Trxns trxns;
  //final QuerySnapshot queryTrxns = trxns;

  TransactionDetailScreen([this.trxns]);

  @override
  _TransactionDetailScreenState createState() =>
      _TransactionDetailScreenState();
}

class _TransactionDetailScreenState extends State<TransactionDetailScreen> {

  String _trxnStatus = 'Listed';

  @override
  Widget build(BuildContext context) {
    // Get the stream of transactions created in main.dart
    final trxnProvider = Provider.of<TrxnProvider>(context);

    return Scaffold(
      resizeToAvoidBottomInset: true,
      appBar: AppBar(
        title: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Image.asset('assets/images/Appbar_logo.png',
                fit: BoxFit.cover, height: 56),
          ],
        ),
      ),
      backgroundColor: Colors.white,
      body: SingleChildScrollView(
        reverse: true,
        child: Padding(
          padding: const EdgeInsets.all(20.0),
          child: Column(
            children: <Widget>[
              Text(
                'Transaction Details',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
              SizedBox(
                height: 8.0,
              ),
              TextField(
                autofocus: true,
                keyboardType: TextInputType.text,
                controller: clientFNameController,
                textAlign: TextAlign.center,
                onChanged: (value) {
                  trxnProvider.changeclientFName(value);
                },
                decoration: kTextFieldDecoration.copyWith(
                    hintText: 'Client First Name',
                    labelText: 'Client First Name'),
              ),
             RoundedButton(
                title: 'Save',
                colour: Colors.blueAccent,
                onPressed: () async {
                  setState(() {
                    showSpinner = true;
                  });
                  try {
                    trxnProvider.saveTrxn();
                    Navigator.push(
                      context,
                      new MaterialPageRoute(
                        builder: (context) => AgentDashboardScreen(),
                      ),
                    );
                    setState(() {
                      showSpinner = false;
                    });
                  } catch (e) {
                    // todo: add better error handling
                    print(e);
                  }
                },
              ),
              SizedBox(
                height: 8.0,
              ),
              (widget != null)
                  ? RoundedButton(
                      title: 'Delete',
                      colour: Colors.red,
                      onPressed: () async {
                        setState(() {
                          showSpinner = true;
                        });
                        try {
                          trxnProvider.deleteTrxn(widget.trxns['trxnId)']);
                          Navigator.push(
                            context,
                            new MaterialPageRoute(
                              builder: (context) => AgentDashboardScreen(),
                            ),
                          );
                          setState(() {
                            showSpinner = false;
                          });
                        } catch (e) {
                          // todo: add better error handling
                          print(e);
                        }
                      },
                    )
                  : Container(),
            ],
          ),
        ),
      ),
    );
  }
}

enter image description here 如果文本框为空,则键盘按预期工作/看起来(上面没有空格)。我这样做是正确的还是应该以不同的方式做? 谢谢

0 个答案:

没有答案