‘0 <= currentIndex && currentIndex < items.length': is not true in Flutter App.

huangapple go评论133阅读模式
英文:

line 207 pos 15: '0 <= currentIndex && currentIndex < items.length': is not true in Flutter App

问题

我遇到了一个问题。我想要创建一个Flutter应用程序,在这个应用程序中,所有页面都会像Android的Fragment一样显示在主体部分。

我已经创建了一个列表,

  1. int _currentIndex = 0;
  2. List<Widget> pages = [
  3. const HomeMain(),
  4. const AdPage(),
  5. const ImageCleanPage(),
  6. const HomeMain(),
  7. ];

我在这里列出了4个页面。
我还创建了一个抽屉和底部导航栏。
我试图从底部导航栏访问0和1页面,从抽屉中访问0、2和3页面,就像Fragment一样。

我尝试了这段代码,

  1. drawer: SafeArea(
  2. child: Drawer(
  3. child: Container(
  4. color: Colors.white,
  5. child: ListView(
  6. children: [
  7. DrawerHeader(
  8. decoration: const BoxDecoration(
  9. color: Colors.indigoAccent
  10. ),
  11. child: Column(
  12. children: [
  13. Container(
  14. width: 70,
  15. height: 70,
  16. decoration: BoxDecoration(
  17. borderRadius: BorderRadius.circular(50),
  18. border: Border.all(
  19. color: Colors.white,
  20. width: 2.0),
  21. image: const DecorationImage(
  22. image: AssetImage('assets/images/logo_image.png'),
  23. )
  24. ),
  25. ),
  26. const SizedBox(height: 15,),
  27. const Text("Image Cleaner",
  28. style: TextStyle(
  29. color: Colors.white,
  30. fontWeight: FontWeight.bold, fontSize: 15,
  31. ),),
  32. const SizedBox(height: 2,),
  33. const Text("support.imageclean@gmail.com",
  34. style: TextStyle(
  35. color: Colors.white,
  36. fontSize: 12,
  37. decorationThickness: 15,
  38. ),)
  39. ],
  40. ),
  41. ),
  42. ListBody(
  43. children: [
  44. ListTile(
  45. leading: const Icon(Icons.home),
  46. title: const Text('Home'),
  47. onTap: () {
  48. setState(() {
  49. _currentIndex = 0;
  50. Navigator.of(context).pop();
  51. // 在点击主页时执行一些操作。
  52. });
  53. },
  54. ),
  55. ListTile(
  56. leading: const Icon(Icons.settings),
  57. title: const Text('Settings'),
  58. onTap: () {
  59. setState(() {
  60. _currentIndex = 2;
  61. Navigator.of(context).pop();
  62. // 在点击设置时执行一些操作。
  63. });
  64. },
  65. ),
  66. ListTile(
  67. leading: const Icon(Icons.help),
  68. title: const Text('Help'),
  69. onTap: () {
  70. setState(() {
  71. _currentIndex = 3;
  72. Navigator.of(context).pop();
  73. // 在点击帮助时执行一些操作。
  74. });
  75. },
  76. ),
  77. ],
  78. )
  79. ],
  80. ),
  81. ),
  82. ),
  83. ),
  84. bottomNavigationBar: BottomNavigationBar(
  85. onTap: NavClick,
  86. items: const [
  87. BottomNavigationBarItem(
  88. icon: Icon(Icons.home),
  89. label: 'Home',
  90. ),
  91. BottomNavigationBarItem(
  92. icon: Icon(Icons.ad_units),
  93. label: 'Free Coin',
  94. ),
  95. ],
  96. currentIndex: _currentIndex,
  97. selectedItemColor: Colors.amber[800],
  98. ),
  99. backgroundColor: Colors.white,
  100. body: SafeArea(
  101. child: pages[_currentIndex],
  102. )
  103. );
  104. }
  105. void NavClick(int index) {
  106. setState(() {
  107. _currentIndex = index;
  108. });
  109. }

当我从抽屉中点击索引2时,我得到了这个错误,

  1. Failed assertion: line 207 pos 15: '0 <= currentIndex && currentIndex < items.length': is not true.
英文:

I am facing a problem. I want to make a Flutter app where all pages will show in the body like Android Fragment.

I have created a list,

  1. int _currentIndex = 0;
  2. List&lt;Widget&gt; pages = [
  3. const HomeMain(),
  4. const AdPage(),
  5. const ImageCleanPage(),
  6. const HomeMain(),
  7. ];

I have listed here 4 pages.
I also created a Drawer and bottom navigation bar.
I am trying to access 0 and 1 pages from the bottom nav bar, And 0,2,3 from the drawer, like fragments.

I have tried this code,

  1. drawer: SafeArea(
  2. child: Drawer(
  3. child: Container(
  4. color: Colors.white,
  5. child: ListView(
  6. children: [
  7. DrawerHeader(
  8. decoration: const BoxDecoration(
  9. color: Colors.indigoAccent
  10. ),
  11. child: Column(
  12. children: [
  13. Container(
  14. width: 70,
  15. height: 70,
  16. decoration: BoxDecoration(
  17. borderRadius: BorderRadius.circular(50),
  18. border: Border.all(
  19. color: Colors.white,
  20. width: 2.0),
  21. image: const DecorationImage(
  22. image: AssetImage(&#39;assets/images/logo_image.png&#39;),
  23. )
  24. ),
  25. ),
  26. const SizedBox(height: 15,),
  27. const Text(&quot;Image Cleaner&quot;,
  28. style: TextStyle(
  29. color: Colors.white,
  30. fontWeight: FontWeight.bold, fontSize: 15,
  31. ),),
  32. const SizedBox(height: 2,),
  33. const Text(&quot;support.imageclean@gmail.com&quot;,
  34. style: TextStyle(
  35. color: Colors.white,
  36. fontSize: 12,
  37. decorationThickness: 15,
  38. ),)
  39. ],
  40. ),
  41. ),
  42. ListBody(
  43. children: [
  44. ListTile(
  45. leading: const Icon(Icons.home),
  46. title: const Text(&#39;Home&#39;),
  47. onTap: () {
  48. setState(() {
  49. _currentIndex = 0;
  50. Navigator.of(context).pop();
  51. // Do something when the home page is tapped.
  52. });
  53. },
  54. ),
  55. ListTile(
  56. leading: const Icon(Icons.settings),
  57. title: const Text(&#39;Settings&#39;),
  58. onTap: () {
  59. setState(() {
  60. _currentIndex = 2;
  61. Navigator.of(context).pop();
  62. // Do something when the home page is tapped.
  63. });
  64. },
  65. ),
  66. ListTile(
  67. leading: const Icon(Icons.help),
  68. title: const Text(&#39;Help&#39;),
  69. onTap: () {
  70. setState(() {
  71. _currentIndex = 3;
  72. Navigator.of(context).pop();
  73. // Do something when the home page is tapped.
  74. });
  75. },
  76. ),
  77. ],
  78. )
  79. ],
  80. ),
  81. ),
  82. ),
  83. ),
  84. bottomNavigationBar: BottomNavigationBar(
  85. onTap: NavClick,
  86. items: const [
  87. BottomNavigationBarItem(
  88. icon: Icon(Icons.home),
  89. label: &#39;Home&#39;,
  90. ),
  91. BottomNavigationBarItem(
  92. icon: Icon(Icons.ad_units),
  93. label: &#39;Free Coin&#39;,
  94. ),
  95. ],
  96. currentIndex: _currentIndex,
  97. selectedItemColor: Colors.amber[800],
  98. ),
  99. backgroundColor: Colors.white,
  100. body: SafeArea(
  101. child: pages[_currentIndex],
  102. )
  103. );
  104. }
  105. void NavClick(int index) {
  106. setState(() {
  107. _currentIndex = index;
  108. });
  109. }

I am getting this error when I clicked index 2 from the drawer,

  1. Failed assertion: line 207 pos 15: &#39;0 &lt;= currentIndex &amp;&amp; currentIndex &lt; items.length&#39;: is not true.
  2. </details>
  3. # 答案1
  4. **得分**: 0
  5. 遇到的错误表明当前索引值 `_currentIndex` 超出了 `BottomNavigationBar` 中项目的范围。在您的情况下,`BottomNavigationBar` 中有两个项目,但在选择抽屉中的 "Settings" 时,您将 `_currentIndex` 设置为 2。这会导致断言失败,因为有效的索引范围应该在 0 1 之间(包括边界)。
  6. 要解决此问题,您需要调整抽屉内的 `ListTile` 小部件的 `onTap` 回调中的索引值。以下是您应该进行的更改:
  7. 对于 "Home" 选项,请将 `_currentIndex` 设置为 0
  8. 对于 "Settings" 选项,请将 `_currentIndex` 设置为 1
  9. 对于 "Help" 选项,请将 `_currentIndex` 设置为 2
  10. 通过进行这些调整,您将确保 `_currentIndex` 值保持在 `BottomNavigationBar` 的有效范围内。这将解决您遇到的错误,并使您的应用程序能够正常运行。
  11. <details>
  12. <summary>英文:</summary>
  13. The error you encountered indicates that the current index value `_currentIndex` is exceeding the range of items in the `BottomNavigationBar`. In your case, you have two items in the `BottomNavigationBar`, but you&#39;re setting `_currentIndex` to 2 when selecting &quot;Settings&quot; in the Drawer. This causes an assertion failure because the valid index range should be between 0 and 1 (inclusive) for your current configuration.
  14. To resolve this issue, you need to adjust the index values in the `onTap` callbacks of the `ListTile` widgets inside the Drawer. Here are the changes you should make:
  15. For the &quot;Home&quot; option, set `_currentIndex` to 0.
  16. For the &quot;Settings&quot; option, set `_currentIndex` to 1.
  17. For the &quot;Help&quot; option, set `_currentIndex` to 2.
  18. By making these adjustments, you&#39;ll ensure that the `_currentIndex` value stays within the valid range for the `BottomNavigationBar`. This will resolve the error you encountered and allow your app to function correctly.
  19. </details>
  20. # 答案2
  21. **得分**: 0
  22. `BottomNavigationBar`始终需要在`items`数量范围内具有`currentIndex`。所以在你的代码中,你有以下部分:

bottomNavigationBar: BottomNavigationBar(
onTap: NavClick,
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Home',
),
BottomNavigationBarItem(
icon: Icon(Icons.ad_units),
label: 'Free Coin',
),
],
currentIndex: _currentIndex,
selectedItemColor: Colors.amber[800],
),

  1. 你在这里有2`items`。这意味着`currentIndex`必须是01。但是在你的代码中,通过抽屉(drawer)使`currentIndex`变为2会超出范围。请注意,你也不能将其设置为"未选定"或其他状态。因此,即使你想要索引2,你也需要在底部栏中选择01。为了消除错误,你可能想要将以下行

currentIndex: _currentIndex,

  1. 更改为

currentIndex: (_currentIndex == 0 || _currentIndex == 1) ? _currentIndex : 0,

  1. 以便在超出范围时将其回退到0
  2. <details>
  3. <summary>英文:</summary>
  4. The `BottomNavigationBar` always needs to have a `currentIndex` within the range of the number of `items`. So in your code you have
  5. bottomNavigationBar: BottomNavigationBar(
  6. onTap: NavClick,
  7. items: const [
  8. BottomNavigationBarItem(
  9. icon: Icon(Icons.home),
  10. label: &#39;Home&#39;,
  11. ),
  12. BottomNavigationBarItem(
  13. icon: Icon(Icons.ad_units),
  14. label: &#39;Free Coin&#39;,
  15. ),
  16. ],
  17. currentIndex: _currentIndex,
  18. selectedItemColor: Colors.amber[800],
  19. ),
  20. You have 2 `items` there. Which means that `currentIndex` MUST be 0 or 1. But your code makes it go outside that when making `currentIndex` 2 through the drawer. Note you also can&#39;t have it &quot;deselected&quot; or something. So even when you want index 2 you will need to have 0 or 1 selected in your bottom bar. To get rid of the error you maybe want to change the line
  21. currentIndex: _currentIndex,
  22. to
  23. currentIndex: (_currentIndex == 0 || _currentIndex == 1) ? _currentIndex : 0,
  24. to make it fall back to 0 when it&#39;s out of range
  25. </details>

huangapple
  • 本文由 发表于 2023年6月5日 12:35:08
  • 转载请务必保留本文链接:https://go.coder-hub.com/76403512.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定