Skip to content

Same hero tag in two pages ? #39

@CharlotteJu

Description

@CharlotteJu

Hello,
First of all, for your library!

I just noticed a problem. If, in two different Scaffolds called one after the other, one of the children has the same HeroTag, there's a display issue when switching between pages.

By removing the HeroTag from the second one, I no longer have this problem.

Error_Expandable.mov

Here is a snippet of code to reproduce the issue.

import 'package:flutter/material.dart';
import 'package:flutter_expandable_fab/flutter_expandable_fab.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

class Test extends ConsumerStatefulWidget {
  const Test({super.key});

  @override
  ConsumerState<ConsumerStatefulWidget> createState() => _TestState();
}

class _TestState extends ConsumerState<Test> {
  final GlobalKey _fabKey = GlobalKey();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("TEST"),
        actions: [
          IconButton(
            onPressed: () {
              Navigator.of(context, rootNavigator: true).push(MaterialPageRoute(
                builder: (BuildContext context) {
                  return const Test2();
                },
              ));
            },
            icon: const Icon(Icons.add),
          )
        ],
      ),
      body: const Center(
        child: Text("Page 1"),
      ),
      floatingActionButtonLocation: ExpandableFab.location,
      floatingActionButton: ExpandableFab(
        key: _fabKey,
        distance: 60,
        type: ExpandableFabType.up,
        overlayStyle: const ExpandableFabOverlayStyle(
          blur: 5,
        ),
        children: [
          FloatingActionButton.extended(
            onPressed: () {},
            heroTag: "TAG",
            label: const Text("TAG"),
            icon: const Icon(Icons.add),
          )
        ],
      ),
    );
  }
}

class Test2 extends ConsumerStatefulWidget {
  const Test2({super.key});

  @override
  ConsumerState<ConsumerStatefulWidget> createState() => _Test2State();
}

class _Test2State extends ConsumerState<Test2> {
  final GlobalKey _fabKey = GlobalKey();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("TEST 2"),
      ),
      body: const Center(
        child: Text("Page 2"),
      ),
      floatingActionButton: ExpandableFab(
        key: _fabKey,
        distance: 60,
        type: ExpandableFabType.up,
        overlayStyle: const ExpandableFabOverlayStyle(
          blur: 5,
        ),
        children: [
          FloatingActionButton.extended(
            onPressed: () {},
            heroTag: "TAG", // <--------------------- HERE
            label: const Text("TAG"),
            icon: const Icon(Icons.add),
          )
        ],
      ),
    );
  }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions