Android Splash Screen visible as keyboard animates

Capacitor
1

Hi, I’m learning capacitor / Ionic / React with an Android app.

I used the instructions in this project to add an icon and splash screen to the Android app.

For the most part it is working well, however when I click in a textbox in the app and the Android keyboard animates from hiden to visible, the splash screen becomes visible for a second.

Any suggestions how to hide the splashscreen?
I’ve poked around with this Capacitor - build cross platform apps with the web

using

import { SplashScreen } from '@capacitor/splash-screen';
const App: React.FC = () => {
       SplashScreen.hide()
}

However, no luck.

I wonder if that’s a ‘capacitor’ and I’m using ‘cordova’ (however, my package.json shows “@capacitor/splash-screen”: “^1.0.1”)

Thanks for any help.

2

I’m experiencing the same problem; this time Ionic-Vue rather than React, and using GitHub - leonardoquevedox/capacitor-resources: Generates icon & splash screen for Capacitor projects u.

When I click into an ion-input field I see the splash screen because the page contents resizes and for a fraction of a second the splash screen is exposed before the keyboard fills that space.

@damiensawyer Did you find a fix?

3

update to latest @capacitor/android (3.1.2 at the moment)

4

Thanks, that fixes the flash of splash screen. There is still a flash - of black instead - but this is preferable to seeing the words on the splash screen.

1 Like
5

Thanks very much for this. Works as described.
Just in time for our Play store release yesterday :slight_smile:

6

I too experienced this problem while I try to open model using model controller. I simply removed capacitor splashscreen. There is no issues. I think there is a problem with capacitor splashscreen. It just hides itself behind the wkwebview.
Why don’t you use Custom splashscreen, with animations or images after the page load???