bug: ion-datetime numeric keyboard is adding a white background on top of the datetime picker on Android

[mandis2010]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

When clicking on the minute or hour value it will open the numeric keyboard and adding a white space on top of datetime picker.

Expected Behavior

It should not display a white space on top of datetime picker.

Steps to Reproduce

1. Use ion-datetime and generate the android apk using cordova.
   <ion-datetime></ion-datetime>

2. Click on the minute column or hour column to open the numeric keyboard.

Code Reproduction URL

Reproduction URL

Ionic Info

Ionic:

Ionic CLI : 6.15.0
Ionic Framework : @ionic/angular 6.0.1
@angular-devkit/build-angular : 13.0.4
@angular-devkit/schematics : 13.0.4
@angular/cli : 13.0.4
@ionic/angular-toolkit : 5.0.3

Cordova:

Cordova CLI : 10.0.0
Cordova Platforms : android 9.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 4 other plugins)

Utility:

cordova-res : 0.15.4
native-run : 1.0.0

System:

Android SDK Tools : 26.1.1
NodeJS : v14.17.6
npm : 6.14.15
OS : Windows 10

Additional Information

[liamdebeasi]

Thanks for the issue. Can you provide a GitHub repo I can use to verify this behavior?

[ionitron-bot]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

[mandis2010]

@liamdebeasi Thank you for reply.
Here is the GitRepo URL.
Click Here
Steps:
npm install
ionic cordova platform add android
ionic cordova build android
Then install the apk on android device and click on the hour or minute column to open the numeric keyboard.

[liamdebeasi]

This seems to be the same underlying issue as #24780, so I am going to merge the two threads. The datetime is being rendered partially offscreen, resulting in the white space you are seeing. However, the datetime should not be rendered offscreen to begin with. You can track progress on this issue on #24780.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.