Ionic - Android version - alerts are way too big

Ionic Framework ionic-v3
1

I built an android version of my ionic 2 app, and when I create alerts on my app using AlertController, even when there is so little text in the alert box, it takes up the whole screen and there’s lots of blank white wasted space in the alert. Is there a way to make my android alerts more size proportionate w.r.t the text like how it is in iOS ?

2

An image of how the alert looks :

Screenshot (15)
Screenshot (15).png1543×868 48.4 KB

Code :

          let a = this.alertCtrl.create({
          title : "Oops",
          message : "You don't have the key to unlock this chest",
          buttons : [{
             text : "OK",
             role:"OK"}
         ]
        });
          a.present();
3

@Sidharth_1999 have you solved it?

4

Yes I have, are you having this issue as well?

5

Yes i am! Please, what did you?

6

I added this to my app.scss :

      .button-inner {
           height: 5%; 
      }

It turns out by default, the height of the button was set to a really large value, so I reduced it to 5%. I overrided the entire .button-inner class in app.scss, but I guess you can just override the height property.

In my opinion, this is something ionic should have done themselves in main.css. I don’t know what they were thinking making the height of the android buttons 100%

Hope this solves your issue.

Sidharth

7

Many thanks!
It solve my problem!

1 Like
8

I’m glad it does :slight_smile:

1 Like