Different button color on selecting a button from "Button Group" widget

In a mobile app, I have used a "Button Group" widget. I need to have different colours for each button is selected like the following image. Can anyone please help me in acheiving this?

Hi Saikat,


There is a very good start guide for mobile development in the Learn section that covers a situation exacly like you are looking for with a Button Group.You can find it probably on the "UI Basics" section, but i would recomend you to take a look at the entire course since you seem to be starting using the platform, and you would learn a lot with it :)

Here is the link: https://www.outsystems.com/learn/courses/12/developing-outsystems-mobile-apps/?StartCourse=False


Best Regards,

Diogo Romero

Solution

You can assign a different class to each button and create an selected style like this:


button.button-group-item.button-group-selected-item.[Button specific class name] {
   background-color: [Button specific color code];
}

Solution

hi Saikat,

Just use onclick event of a button to change the color of it.


regards

amreen


Romero wrote:

Hi Saikat,


There is a very good start guide for mobile development in the Learn section that covers a situation exacly like you are looking for with a Button Group.You can find it probably on the "UI Basics" section, but i would recomend you to take a look at the entire course since you seem to be starting using the platform, and you would learn a lot with it :)

Here is the link: https://www.outsystems.com/learn/courses/12/developing-outsystems-mobile-apps/?StartCourse=False


Best Regards,

Diogo Romero

Thanks Romero.

Regards,

Saikat


Eric Bulters wrote:

You can assign a different class to each button and create an selected style like this:


button.button-group-item.button-group-selected-item.[Button specific class name] {
   background-color: [Button specific color code];
}

Hi Eric,

Thanks a lot.

Regards,

Saikat


You are welkom Saikat, glad to help