Table setStyleProvider cell styles

Hello, first of all I want say thank you for Cuba Platform. It’s look very intuitive and fast. I am not developer and I have very low skill with Java developing yet, but I am still learning.

I am fighting with cell styles. I don’t know what I am doing wrong, but cells are not changing their styles.

I checked the Table with style provider on sample website, but it is not working for me.

In my database there is column named “status” where is text value and based on value I want change style of the cell. I don’t know how to do it.

In my PropertiesBrowse.java I have this:

package com.company.groot.web.properties;

import com.company.groot.entity.Properties;
import com.haulmont.cuba.gui.components.AbstractLookup;
import com.haulmont.cuba.gui.components.Table;

import javax.inject.Inject;
import java.util.Map;

public class PropertiesBrowse extends AbstractLookup {
    @Inject
    private Table<Properties> propertiesesTable;
    @Override
    public void init(Map<String, Object> params) {
        propertiesesTable.setStyleProvider((entity, property) -> {
            if (property.equals("status")) {
                switch (entity.getStatus()) {
                    case "RELEASED":
                        return "released";
                    default:
                        return null;
                }
            }
            return null;
        });
    }

}

and then in style.scss I have added following:

@import "halo-defaults";
@import "com.company.groot/halo-ext-defaults";
@import "app-components";
@import "com.company.groot/halo-ext";

.halo {
  // include auto-generated app components SCSS
  @include app_components;
  
  @include com_company_groot-halo-ext;
}

.released {
    background-color: red;
    color: white;
}

Thank you all help.

Hi,

It’s recommended to put your styles inside the halo-ext.scss file, within @mixin, for instance:

@mixin com_company_sales-halo-ext {
  .released {
    background-color: red;
    color: white;
  }
}

You can find more information about Extending an Existing Theme and Creating new styles in the documentation.

Thank you Gleb.

It is working, but the style will be always applied the same as it will be linked to the field. I want to achieve different style based on the text in the cell.

For example if the value will be “Released” the color will be green, if “In Progress” then the cell will be in “yellow”. Something like conditional formatting in MS Excel.

Could you please help with it?

As you can see in the demo you can return different styles depending on some condition, just check what value is in the specified field.