Not working in jellybean

Hi
I have created an app using ionic2. There I have radio button and some .scss. Style of radio is not working well and in another app select menu is not working

but working very well in lollypop. Does anybody have any idea ??

below r details

quiz.html

 <ion-list *ngFor="#q of qus" radio-group [ngClass]="{view: q.show}">

    <ion-list-header>
        {{q.ask}}
    </ion-list-header>

    <ion-item *ngFor="#opt of q.options" [ngClass]="{incorrect: opt == q.given, correct: q.ans == opt}">
        <ion-radio [value]="opt" item-left (click)="answerIt(q,opt)"></ion-radio>
        <ion-label>{{opt}}</ion-label>
    </ion-item>
</ion-list>

quiz.ts

import {Page} from 'ionic-angular';

@Page({
   templateUrl: 'build/pages/quiz/quiz.html'
})
export class ListPage {
    qus: Array<any> = [];
    points: number = 0;

   constructor() {
      this.qus = [
        {'ask' : 'Question1', 'ans' : 'option-1' , options :['option-1', 'option-2', 'option-3', 'option-4'], show: false, given: ""},
        {'ask' : 'Question2', 'ans' : 'option-3' , options :['option-1', 'option-2', 'option-3', 'option-4'], show: false, given: ""},
        {'ask' : 'Question3', 'ans' : 'option-4' , options :['option-1', 'option-2', 'option-3', 'option-4'], show: false, given: ""},
        {'ask' : 'Question4', 'ans' : 'option-2' , options :['option-1', 'option-2', 'option-3', 'option-4'], show: false, given: ""}
     ];
}

answerIt(q, ans) {
    q.show = true;
    q.given = ans;
    
    if(q.ans == ans) {
        this.points ++;            
    }else {
        //alert("incorrect");

Sass Css Code

.view .incorrect , .view .correct {
     color: #fff !important;

   .radio-icon {
       border-color: #fff !important;    
   }

  .radio-inner {
     background: #fff;
  }

  ion-label {
     color: #fff;
  }
}  
.view .correct { background: #2E7D32 !important; } 
.view .incorrect { background: #E53935; }

Ionic 2 is supported from 4.4+

O My God :frowning: So which is better ? Ionic1 or Ionic2 ?

Don’t worry, I think in a year Android version below 5 will cease to exist.

1 Like

If you need to support Android version older than 4.4 then you can use Crosswalk:

1 Like

But after installing crosswalk, my app size increased from 8M to 30M.

Yes, but for all performance improvements and standards compliance that Crosswalk provides, IMHO it’s still a reasonable compromise. Many apps are taking this approach and the users are more or less used to it already (moreover Android 4.0 - 4.3 accounts for only a bit over 20% of the usage and will probably drop significantly in about an year). If you have app size constraints then you can take a look at Crosswalk Lite - it’s half the size but might be more difficult to install/configure.

1 Like