Skip to content

[BUG] [IOS] Navbar text jumps during a CupertinoSliverNavigationBar -> CupertinoNavigationBar transition #45068

@ignatevdev

Description

@ignatevdev

Steps to Reproduce

  1. Create an application with 2 screens, one having a CupertinoSliverNavigationBar and another with a CupertinoNavigationBar.
  2. Connect those screens with a CupertinoApp via onGenerateRoute.
  3. Make a transition from a screen with a sliver to a screen with a normal navbar and then go back.
  4. Observe a weird font size jump after the end of the transition

To make things clear I have made a video of this bug:
https://mega.nz/#!Tsl3FQJI!XW6RupT3oWgatozAlcBeGJaierNIoipr5_3lVpvqX7k

This issue occurs on the current stable (v1.9.1+hotfix.6) and the latest dev (v1.12.2) versions.

I am not sure if this is a real bug or I am doing something wrong with my navigation, but I don't see any clear mistakes either, so it would be really nice to receive some feedback.

Here is my current application code:

import 'package:flutter/cupertino.dart';
import 'package:flutter/services.dart';

import 'dart:developer';
import 'dart:ui';

void main() {
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown,
  ]);

  return runApp(CupertinoDictionaryApp());
}

class CupertinoDictionaryApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      initialRoute: '/',
      onGenerateRoute: (RouteSettings settings) {
        switch (settings.name) {
          case '/':
            return CupertinoPageRoute(
              title: 'Languages',
              builder: (_) => HomeScreen(), settings: settings
            );
          case LanguageScreen.routeName:
            final LanguageScreenArguments args = settings.arguments;

            return CupertinoPageRoute(
              title: args.language,
              builder: (_) => LanguageScreen(), settings: settings
            );
        }
      }
    );
  }
}

class LanguageScreenArguments {
  final String language;

  LanguageScreenArguments(this.language);
}

class LanguageScreen extends StatelessWidget {
  static const routeName = '/language';

  final String argument;

  const LanguageScreen({Key key, this.argument}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final LanguageScreenArguments args = ModalRoute.of(context).settings.arguments;

    log(args.toString());

    return CupertinoPageScaffold(
      navigationBar: CupertinoNavigationBar(
        // backgroundColor: Color.fromRGBO(255, 255, 255, 1),
      ),
      child: Container(
        child: Text(args.language)
      )
    );
  }
}

class HomeScreen extends StatelessWidget {
  final _itemExtent = 56.0;
  final generatedList = ["Russian", "English", "Finnish"];

  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
      child: CustomScrollView(
        slivers: [
          CupertinoSliverNavigationBar(),
          SliverFixedExtentList(
            itemExtent: _itemExtent,
            delegate: SliverChildBuilderDelegate(
              (context, index) => LanguageItem(
                text: generatedList[index],
                onPressed: () {
                  Navigator.pushNamed(
                    context,
                    LanguageScreen.routeName,
                    arguments: LanguageScreenArguments(
                      generatedList[index]
                    )
                  );
                },
              ),
              childCount: generatedList.length,
            ),
          )
        ],
      ),
    );
  }
}

class LanguageItem extends StatefulWidget {
  const LanguageItem({@required this.text, @required this.onPressed});

  final String text;
  final Function onPressed;

  @override
  _LanguageItemState createState() => _LanguageItemState();
}

class _LanguageItemState extends State<LanguageItem> {
  bool _tapped = false;

  void toggleTappedState(bool newTapped) {
    setState(() {
      _tapped = newTapped;
    });
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTapDown: (TapDownDetails details) {
        toggleTappedState(true);
      },
      onTapUp: (TapUpDetails details) {
        toggleTappedState(false);
      },
      onTap: widget.onPressed,
      behavior: HitTestBehavior.translucent,
      child: Container(
        decoration: BoxDecoration(
          border: Border(
            bottom: BorderSide(width: 1.0, color: Color.fromRGBO(0, 0, 0, 0.1)),
          ),
          color: _tapped ? Color.fromRGBO(0, 0, 0, 0.1) : null,
        ),
        padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(  
              widget.text,
            )
          ],
        )
      )
    );
  }
}

Target Platform:: iOS
Target OS version/browser:: 13.1.2 / 13.2.2
Devices:: iPhone 7 Plus

Logs

   info • This function has a return type of 'CupertinoPageRoute', but doesn't end with a return statement
          • lib/main.dart:21:24 • missing_return
[✓] Flutter (Channel dev, v1.12.2, on Mac OS X 10.15.1 19B88, locale en-RU)
    • Flutter version 1.12.2 at /Users/NSLS/flutter
    • Framework revision 6de6267942 (4 days ago), 2019-11-13 14:37:20 -0800
    • Engine revision b358dc58fb
    • Dart version 2.7.0

[!] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
    • Android SDK at /Users/NSLS/Library/Android/sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-29, build-tools 29.0.0
    • ANDROID_HOME = /Users/NSLS/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1343-b01)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses

[✓] Xcode - develop for iOS and macOS (Xcode 11.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.2.1, Build version 11B500
    • CocoaPods version 1.8.4

[!] Android Studio (version 3.4)
    • Android Studio at /Applications/Android Studio.app/Contents
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1343-b01)

[✓] VS Code (version 1.39.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.6.0

[✓] Connected device (1 available)
    • Anton’s iPhone • 42e34348c456438ca88d792f317a971fc63acd39 • ios • iOS 13.1.2

! Doctor found issues in 2 categories.

Metadata

Metadata

Assignees

Labels

f: cupertinoflutter/packages/flutter/cupertino repositoryf: routesNavigator, Router, and related APIs.frameworkflutter/packages/flutter repository. See also f: labels.

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions