Not floating in flutter 3.3

[RasulM97]

I'm using your package for flutter 3.3 with dart 2.18.1, and it has a background above of all screens, then it is not float, actually. Please update your beautiful package. Best regards.

[Naseeb-Nex]

I also have this problem.

The floating is not working need to transparent the background color transparent I think when using the margin.

[buraktabn]

Did you try setting the extendBody to ture in Scaffold?

Scaffold(
  extendBody: true,
  ...
)

[RasulM97]

Did you try setting the extendBody to ture in Scaffold?

Scaffold(
  extendBody: true,
  ...
)

Yes I did, and I used its background color to transparency, but it didn't work.

[buraktabn]

That's weird. I suspect there's something else going on. The example below is working as expected. Can you compare it with your code, maybe you're missing something.

[✓] Flutter (Channel stable, 3.3.4, on Ubuntu 22.04.1 LTS 5.15.0-52-generic, locale en_CA.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Chrome - develop for the web
[✓] Linux toolchain - develop for Linux desktop
[✓] Android Studio (version 2021.3)
[✓] IntelliJ IDEA Community Edition (version 2022.2)
[✓] Connected device (2 available)
[✓] HTTP Host Availability

• No issues found!

Scaffold(
  extendBody: true,
  bottomNavigationBar: const MyBottomNavigationBar(),
  body: child,
);

class MyBottomNavigationBar extends StatelessWidget {
  const MyBottomNavigationBar({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final tabsRouter = AutoTabsRouter.of(context);

    return ConstrainedBox(
      constraints: const BoxConstraints(maxWidth: 350, maxHeight: 104),
      child: DotNavigationBar(
        margin: const EdgeInsets.only(left: 10, right: 10),
        paddingR: const EdgeInsets.only(bottom: 16, top: 16),
        marginR: EdgeInsets.fromLTRB(50, 16, 50, MediaQuery.of(context).viewPadding.bottom == 0 ? 16 : 0),
        currentIndex: tabsRouter.activeIndex,
        dotIndicatorColor: Colors.transparent,
        backgroundColor: const Color(0xFF101113).withOpacity(.99),
        unselectedItemColor: const Color(0xff49576C),
        // enableFloatingNavBar: false,
        enablePaddingAnimation: false,
        // enableMagnification: true,
        // iconSize: 20,
        borderRadius: 28,
        onTap: tabsRouter.setActiveIndex,
        boxShadow: [
          BoxShadow(
            color: const Color(0xFF101113).withOpacity(0.6),
            blurRadius: 30,
            spreadRadius: 10,
            offset: const Offset(0, 30),
          )
        ],
        items: [
          /// Home
          DotNavigationBarItem(
            icon: const FaIcon(FontAwesomeIcons.house, size: 16),
            selectedColor: primary,
          ),
          DotNavigationBarItem(
            icon: const FaIcon(FontAwesomeIcons.globe, size: 16),
            selectedColor: primary,
          ),
          DotNavigationBarItem(
            icon: const FaIcon(FontAwesomeIcons.users, size: 16),
            selectedColor: primary,
          ),
          DotNavigationBarItem(
            icon: const FaIcon(FontAwesomeIcons.user, size: 16),
            selectedColor: primary,
          ),
        ],
      ),
    );
  }
}

[BrunoJurkovic]

@buraktabn

I am having this issue as well, on version 3.3.10.

The screenshot above is from your example. Could you please look into it, spent an hour but can't find the issue causing this.

Thanks.

[BrunoJurkovic]

Seems like flutter clean fixed this. Very weird behavior.

[DenizUlucan]

If you are using safearea widget you can try to remove it