Why does the alert in my Ionic 2 app look like an old Android version and how can I change this?
Note: this is just calling JavaScript: alert() function, NOT the Alert component! I am doing this on purpose.
I’m concerned that the browser version/sdk it’s building to is out of date. DO NOT suggest to me to use a component, I already know about this.
For comparison, here’s what an alert looks like from my chrome browser:
alert() is not the same as Alerts Component
I didn’t say it was. You misunderstand my concern.
But if you are using alert() function ofcourse you will get the default alert from Android xd.
Yes, I know that but you haven’t understood my question I think. The alert SHOULDN’T look like that. Any other browser alert from a web app/web site has a more modern styling.
So I’m concerned that the web-view that is in my app is not up-to-date, so maybe something is wrong with my ionic 2 build setup.
Make more sense now?
I don’t think this a ionic issue. What android version you have?
See my updated question. I’m on Android 6 marshmallow. This has to be a configuration issue with cordova/ionic 2 etc.
Set
theme="@android:style/Theme.DeviceDefault.Light.NoActionBar"
In platforms/android/AndroidManifest.xml
Thank you, this worked. Could you please explain to me if this has any bearing on the webview being used or can I safely ignore this from now on?
@Daveshirman So just a little background on whats going on here.
Chances are you have an older version of cordova-cli and cordova-android. There was an older version of cordova-android that manually set the native UI theme behind the scenes for older devices. With new version of cordova-android, this is not an issue.
You can either removed the bit of xml @shakogegia suggested, or update the cordova-android version.
Don’t think so? See my cordova version in my npm list output (6.0.0):
Davids-Air:DoStuff daveshirman$ npm list -g --depth=0
/usr/local/lib
├── acs@1.2.0
├── alloy@1.7.35
├── angular2@2.0.0-beta.8
├── bower@1.7.7
├── cordova@6.0.0
├── es6-promise@3.1.2
├── UNMET PEER DEPENDENCY es6-shim@0.35.0
├── ionic@2.0.0-beta.19
├── ionic-framework@2.0.0-beta.2
├── ios-deploy@1.8.5
├── ios-sim@5.0.7
├── npm@3.8.0
├── UNMET PEER DEPENDENCY reflect-metadata@0.1.3
├── rxjs@5.0.0-beta.2
├── titanium@5.0.6
├── typedphonegap@0.0.3
└── UNMET PEER DEPENDENCY zone.js@0.6.2Right, but if the project is a bit older,
ionic platform ls
It could be in there. Either way, you could remove the bit of xml @shakogegia suggested and be all set
Davids-MacBook-Air:DoStuff daveshirman$ ionic platform ls
Installed platforms: android 4.0.2, ios 3.8.0
Available platforms: amazon-fireos, blackberry10, browser, firefoxos, osx, webos
FYI - I already did as suggested, but just wanted to get to the root of the issue.
Thanks.