setState()不更新按鈕的顏色

所以，我正在嘗試制作一個多頁顫動應用程式，而我能找到的在螢屏之間移動的最佳方法是在串列中顯示一個元素，其中每個元素都是一個包含頁面的 Container()。

然后我注意到我的按鈕停止更新它們與 setState() 掛鉤的變數，我試圖洗掉代碼塊，即使在去掉 270 行代碼之后，它仍然不會更新。

如果有人知道如何以這種方式更新按鈕，或者有一種單獨的方法來更改頁面以使按鈕作業，請提供幫助。

import 'package:flutter/material.dart';

void main() {
  runApp(const MyFirstApp());
}

class MyFirstApp extends StatefulWidget {
  const MyFirstApp({super.key});

  @override
  State<MyFirstApp> createState() => _MyFirstAppState();
}

class _MyFirstAppState extends State<MyFirstApp> {
  int _selectedIndex = 0;
  bool _flag = false;

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

  late List<Widget> pages = <Widget>[
    ElevatedButton(
      onPressed: () => setState(() => _flag = !_flag),
      style: ElevatedButton.styleFrom(
        backgroundColor: _flag ? Colors.red : Colors.teal,
      ),
      child: Text(_flag ? 'Red' : 'Green'),
    ),
    ElevatedButton(
      onPressed: () => setState(() => _flag = !_flag),
      style: ElevatedButton.styleFrom(
        backgroundColor: _flag ? Colors.black : Colors.blue,
      ),
      child: Text(_flag ? 'Black' : 'Blue'),
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: pages.elementAt(_selectedIndex),
        bottomNavigationBar: BottomNavigationBar(
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              label: "",
              icon: Text('D'),
            ),
            BottomNavigationBarItem(
              label: "",
              icon: Text('O'),
            ),
          ],
          currentIndex: _selectedIndex,
          onTap: _onItemTapped,
        ),
      ),
    );
  }
}

uj5u.com熱心網友回復：

您正在尋找IndexedStack：

固定代碼示例：

import 'package:flutter/material.dart';

void main() {
  runApp(const MyFirstApp());
}

class MyFirstApp extends StatefulWidget {
  const MyFirstApp({super.key});

  @override
  State<MyFirstApp> createState() => _MyFirstAppState();
}

class _MyFirstAppState extends State<MyFirstApp> {
  int _selectedIndex = 0;
  bool _flag = false;

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: IndexedStack(
          index: _selectedIndex,
        children: [
          ElevatedButton(
      onPressed: () => setState(() => _flag = !_flag),
      style: ElevatedButton.styleFrom(
        backgroundColor: _flag ? Colors.red : Colors.teal,
      ),
      child: Text(_flag ? 'Red' : 'Green'),
    ),
    ElevatedButton(
      onPressed: () => setState(() => _flag = !_flag),
      style: ElevatedButton.styleFrom(
        backgroundColor: _flag ? Colors.black : Colors.blue,
      ),
      child: Text(_flag ? 'Black' : 'Blue'),
    ),
        ]),
        bottomNavigationBar: BottomNavigationBar(
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              label: "",
              icon: Text('D'),
            ),
            BottomNavigationBarItem(
              label: "",
              icon: Text('O'),
            ),
          ],
          currentIndex: _selectedIndex,
          onTap: _onItemTapped,
        ),
      ),
    );
  }
}

標籤：扑镖设置状态

上一篇：使用Transformer.scale縮放后如何獲取新小部件的寬度和高度

下一篇：顫振檢查日期的月份變化