Button group acting as radio buttons Ionic

Hi,

I am using ionic 2 and I would like to get a result like this:

Screenshot from 2017-10-02 22:36:43

For now, I have a simple ion-list :

 <ion-list radio-group formControlName="type">
 <ion-col col-4 >                                              
    <ion-item>                             
     <ion-label>Breakfast</ion-label>                                          
     <ion-radio  value="breakfast" ></ion-radio>                           
     </ion-item>                         
 </ion-col>
 <ion-col col-4 >                           
      <ion-item>                                
     <ion-label>Diner</ion-label>                                
     <ion-radio  value="diner" checked="true">
    </ion-radio>                            
    </ion-item>                         
 </ion-col>
                  
<ion-col col-4 >                            
    <ion-item>                                
    <ion-label>Lunch</ion-label>                                
     <ion-radio  value="lunch" checked="true">
     </ion-radio>                            
     </ion-item>                          </ion-col>                                                                                         </ion-list>                                         

my result :

Screenshot from 2017-10-02 22:43:21

thanks for any help

I believe you are looking for Segments.

1 Like