Flutter: Элементы BottomNavigationBar становятся белыми, когда присутствует более 3 элементов.

Созданный на 17 дек. 2017 · 21Комментарии · Источник: flutter/flutter

Действия по воспроизведению

При добавлении более 3 элементов в BottomNavigationBar все элементы становятся белыми и не читаются на светло-сером фоне. Кроме того, активный элемент также белый, а не предоставленный fixedColor . Минимальный пример кода можно найти здесь

Также смотрите следующие изображения:

schermafbeelding 2017-12-17 om 20 52 39

schermafbeelding 2017-12-17 om 20 52 50

Журналы

Н/Д

Флаттер Доктор

[✓] Flutter (on Mac OS X 10.13.1 17B1003, locale nl-NL, channel alpha)
    • Flutter at /Users/dirk/Developer/flutter/sdk
    • Framework revision 8f65fec5f5 (5 days ago), 2017-12-12 09:50:14 -0800
    • Engine revision edaecdc8b8
    • Tools Dart version 1.25.0-dev.11.0
    • Engine Dart version 2.0.0-edge.d8ae797298c3a6cf8dc9f4558707bd2672224d3e

[✓] Android toolchain - develop for Android devices (Android SDK 26.0.0)
    • Android SDK at /Users/dirk/Library/Android/sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-26, build-tools 26.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_112-release-b06)

[-] iOS toolchain - develop for iOS devices (Xcode 9.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 9.2, Build version 9C40b
    ✗ libimobiledevice and ideviceinstaller are not installed. To install, run:
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
    ✗ ios-deploy not installed. To install:
        brew install ios-deploy
    • CocoaPods version 1.2.0

[✓] Android Studio (version 2.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Java version OpenJDK Runtime Environment (build 1.8.0_112-release-b06)

[✓] IntelliJ IDEA Ultimate Edition (version 2017.3)
    • Flutter plugin version 20.0.3
    • Dart plugin version 173.3727.108

[✓] Connected devices
    • iPhone X • 9500EA8E-1292-4223-BFFF-1B2134D5C47C • ios • iOS 11.2 (simulator)

annoyance material design framework

Источник

DirkWillem

👍60

Самый полезный комментарий

Если вы не поняли, как это исправить:

bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,

eshinkawa 10 авг. 2018

👍184 ❤44 🎉34 🚀20

Все 21 Комментарий

/cc @xster

cbracken 19 дек. 2017

cc @HansMuller , я смутно помню, что видел более старую ошибку об этом, но я не могу ее найти

xster 19 дек. 2017

при использовании BottomNavigationBarType.fixed это нормально, но при использовании BottomNavigationBarType.shifting это неправильно

flyou 26 дек. 2017

👍94 ❤21 🎉16 🚀9

У меня тоже есть эта проблема. Кто-нибудь знает, как это исправить?

wiltwitt 16 февр. 2018

та же проблема для меня

chusmf 8 мар. 2018

Я добавил это в наш список вещей, на которые стоит обратить внимание в конце этого года. Мы были бы рады просмотреть исправления, если у кого-то есть возможность взглянуть на код и выяснить, что происходит, прежде чем мы доберемся до него.

Hixie 9 мар. 2018

Когда предоставляется более 3 элементов BottomNavigationBar, тип, если он не указан, изменяется на BottomNavigationBarType.shifting на https://docs.flutter.io/flutter/material/BottomNavigationBar/BottomNavigationBar.html. Этот бит информации должен быть выделен в документе класса. Легко упустить из виду, где он находится (я проглядел).

Когда тип BottomNavigationBar равен BottomNavigationBarType.shifting , текст и значки элементов отображаются белым цветом с помощью DefaultTextStyle и IconTheme. Предполагается, что их BottomNavigationBarItem.backgroundColor будут указаны контрастным цветом. Это явно сбивает с толку.

Общая идея с нижними навигационными панелями типа shifting заключается в том, что каждый элемент будет иметь другой цвет фона (который контрастирует с белым), поскольку этот цвет станет цветом всей навигационной панели при выборе элемента.

Документ для BottomNavigationBar и NavigationBarItem нуждается в улучшении.

HansMuller 9 мар. 2018

👍103 ❤25 🎉10

@HansMuller Спасибо, сработало!

wiltwitt 10 мар. 2018

@HansMuller , слава!

tygryk 19 апр. 2018

Если вы не поняли, как это исправить:

bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,

eshinkawa 10 авг. 2018

👍184 ❤44 🎉34 🚀20

Я единственный, кто думает, что он не должен автоматически менять поведение в зависимости от количества вкладок?
Мне не кажется интуитивным ожидать другого поведения.

ThinkDigitalSoftware 11 авг. 2018

👍43 ❤2

спасибо 👍

bachtiaryayan 8 сент. 2018

Спасибо.

creative-junk 19 сент. 2018

Что мне делать, если я не хочу, чтобы значки были белыми, но они должны иметь поведение смещения?

dmorawetz 25 сент. 2018

Почему бы просто не сделать тип по умолчанию .fixed?

mliitfall 25 окт. 2018

👍4

Я знаю, что эта проблема была закрыта, но она все еще кажется ошибкой, хотя документация была хорошо обновлена.
Я бы предложил сделать фиксированным значение по умолчанию или исправить поведение BottomNavigationBarType.shifting с четырьмя элементами.

JPM84 2 мар. 2019

👍20

Я предоставил агрумент " backgroundColor" для каждого "BottomNavigationBarItem", и проблема решена.

nikhilmeria 10 янв. 2020

👍3

Мне удалось решить проблему, введя свойство showUnselectedLabels: true в BottomNavigationBar.

вернуть новый BottomNavigationBar(

  showUnselectedLabels: true,

  items: <BottomNavigationBarItem>[...

SilvaEngComp 13 февр. 2020

что мы не хотим, чтобы поведение менялось, если у нас есть более трех элементов. Есть ли какая-нибудь работа для этого?

Mahn00rMalik 28 апр. 2020

добавить showUnselec tedLabels:true в BottomNavigationBar
добавить backgroundColor: Colors.blue в BottomNavigationBarItem
Затем все показано

SharkLib 1 мая 2020

👍1

Я единственный, кто думает, что я не должен автоматически менять поведение в зависимости от количества вкладок?
Мне не кажется интуитивным ожидать другого поведения.

я думаю так же