Splash screen: could only see the big logo, but not the subtitle

[monsieurtanuki]

What

• I've just run the app with the latest code.
• The splash screen included the big logo in the center of the page, but not the expected subtitle below.

Screenshot

Same splash screen for dark and light mode:

Smartphone model

• Device: iPhone 8 Plus emulator
• OS: iOS
• App Version: develop branch on 2022-11-10 17:15 UTC

[M123-dev]

Also what I noticed on a friends phone that when using the app in darkmode, the splash background is dark and the bottom side of the logo is black not white as it should be.

[monsieurtanuki]

I'm in dark mode. The splash background was white.

[Akashsri3bi]

I will look into it !

[Akashsri3bi]

@monsieurtanuki @M123-dev I can't say about the missing subtitle , but on dark mode the splash background is still white no changes in logo also

[Akashsri3bi]

Is the subtitle not visible issue somewhat related to screen size ?

[monsieurtanuki]

Is the subtitle not visible issue somewhat related to screen size ?

Perhaps. If so, it needs to be fixed.

[monsieurtanuki]

Could also be an issue only on ios.

[Akashsri3bi]

Could also be an issue only on ios.

Background color issue persist everywhere guess

[Akashsri3bi]

I have got something for the issue and the plugin on https://pub.dev/packages/flutter_native_splash Below in page it says

Can I base light/dark mode on app settings? No. This package creates a splash screen that is displayed before Flutter is loaded. Because of this, when the splash screen loads, internal app settings are not available to the splash screen. Unfortunately, this means that it is impossible to control light/dark settings of the splash from app settings.

That is why it always displays only white background , One workaround will be to create a whole new splash screen and change it according to theme and not using flutter native splash , that would be a lot changes , What do you suggest @monsieurtanuki @M123-dev

[monsieurtanuki]

@Akashsri3bi I cannot check right now but I believe your analysis is slightly flawed. Ok the splash screen is displayed before the app is really started and therefore won't know what the app settings are regarding dark/light. But there are dark/light settings at the device level, e.g. my smartphone is always in dark mode. And I think the splash package can detect that and provides params to display a different splash for dark and light. Therefore there can be a dark and a light splash screens, depending on the device settings. Which is good enough.

Regarding spending time reinventing the wheel regarding splash screen, I'm afraid it wouldn't be appropriate (I'm in "British understatement" mode):

• if the splash package doesn't make it possible, please contribute to them too, not inside Smoothie
• one of the 2 major goals of a splash screen is to display something during the app init, so by definition it's triggered before knowing about the app settings. And there's nothing you can do about it (or a pre-init and a during-init-but-after-app-settings-are-loaded splashes)
• there are tons of issues with a higher priority

TL;DR Please check with the splash package if we can display a dark and a light splash screens according to device settings, and implement it.

[M123-dev]

AFAIK darkmode is already supported by the package BUT also as far as I know we do not currently use the output of this package but manual work from @g123k, is that correct ?

[g123k]

AFAIK darkmode is already supported by the package BUT also as far as I know we do not currently use the output of this package but manual work from @g123k, is that correct ?

True, the splash screen plugin doesn't provide enough features. To fix the issue, you should have a look at the iOS splashscreen on Xcode. Nothing related to Flutter

[monsieurtanuki]

@g123k Could you please elaborate on which features are missing on splash package that prevent us from using it? Currently in Smoothie the splash screen in dark mode does not work and the subtitle is missing, so perhaps we would be better off switching back to flutter_native_splash now, while creating issues on their side.

[g123k]

@g123k Could you please elaborate on which features are missing on splash package that prevent us from using it? Currently in Smoothie the splash screen in dark mode does not work and the subtitle is missing, so perhaps we would be better off switching back to flutter_native_splash now, while creating issues on their side.

For instance, we have two splashscreens: one for the light mode and another for the dark one. This package doesn't support this.

For the issue with the missing brand, I think it's only on iOS and if I remember well, a recent PR was made around this platform/feature.

[monsieurtanuki]

For instance, we have two splashscreens: one for the light mode and another for the dark one. This package doesn't support this.

Now they do:

[g123k]

For instance, we have two splashscreens: one for the light mode and another for the dark one. This package doesn't support this.

Now they do:

Then we can use it instead of the manual solution 👍 I'm just not a big fan of that kind of tool

[monsieurtanuki]

@g123k I'm not a big fan of generated code either, but in that case we would be better off letting that package manage all the tango dancing around splash screens with Android / Android 12 / iOS.

@Akashsri3bi If that's OK with you, please use flutter_native_splash in order to fix this issue (I believe most the parameters are already in the pubspec.yaml).

[Akashsri3bi]

Okay great !

[M123-dev]

Ohh I think I remember what the problem was, the package not supporting svgs

[monsieurtanuki]

Ohh I think I remember what the problem was, the package not supporting svgs

Then there are different solutions:

1. check if flutter_native_splash still does not support svg, and help them support svg if relevant
2. generate png out of svg, but I think we already go most of them (or all of them?)
3. fix "our" bug

The fastest and safest solution would be solution 2, wouldn't it? 1 hour max.

[Akashsri3bi]

Will look into it !

[monsieurtanuki]

@Akashsri3bi Still working on it?

[Akashsri3bi]

@monsieurtanuki I really forgot about that Yes I will work on this sry for delay

[Akashsri3bi]

@g123k I'm not a big fan of generated code either, but in that case we would be better off letting that package manage all the tango dancing around splash screens with Android / Android 12 / iOS.

@Akashsri3bi If that's OK with you, please use flutter_native_splash in order to fix this issue (I believe most the parameters are already in the pubspec.yaml).

@monsieurtanuki @g123k right now if we see in application flutter_native_splash package works fine on android by using svg's which is not creating any issues in pubspec.yaml and the application works normally . For IOS I guess is a platform specific problem not any issue of application. now either we use manual work from @g123k or package which is suppose to work for ios . please confirm!

[monsieurtanuki]

@Akashsri3bi I've already explained in that

• either we spend time trying to fix whatever is wrong with our specific implementation of splash screen with svg
• or we use the standard package flutter_native_splash with png, which is what I recommend

[teolemon]

@monsieurtanuki can you still reproduce ?

[teolemon]

I can't reproduce on my device, is that related to size ?

[monsieurtanuki]

@monsieurtanuki can you still reproduce ?

No, because of macos planned obsolescence I cannot build Smoothie on iOS anymore. And the problem was only on iOS.

I can't reproduce on my device, is that related to size ?

I don't think it's related to size (plus this time it was on my iOS emulator, not on my 4.5" android smartphone). I just pointed out that using flutter_native_splash would definitely solve the issue.