Flex 4 MX AdvancedDataGrid embedded font in header reverting to Times for only some users

Question

I have a Flex 4.5 Application. We are using Spark DataGrids for the majority of our tables. However, there are a couple of instances where we need to use the MX AdvancedDataGrid as we need to do multi-sort and have locked columns.

The problem is the fonts show up perfectly fine within the Spark DataGrid headers. Within the MX AdvancedDataGrid headers (and only in the headers, the data shows the font perfectly fine), the font reverts to Times. However this does not happen for all users. Most of our developers see the font fine, but some of our users see the Times font within the MX ADGs. I am at a loss for what I am missing.

I am using an embedded font in the application, embedded both for CFF and non CFF (with all variations included such as italic and light):

@font-face {
    src: url("assets/fonts/SourceSansPro-Regular.ttf");
    fontFamily: SSP;
    fontStyle: normal;
    fontWeight: normal;
    embedAsCFF: true;
}

/* embed non CFF fonts for MX controls */
@font-face {
    src: url("assets/fonts/SourceSansPro-Regular.ttf");
    fontFamily: SSPNoCFF;
    fontStyle: normal;
    fontWeight: normal;
    embedAsCFF: false;
}

I have set styles up for both spark DataGrid and mx AdvancedDataGrid:

mx|AdvancedDataGrid,
.standardDataGrid,
mx|DataGrid {
alternating-item-colors: #ffffff, #f6f6f6;
border-visible: false;
headerColors: #e6e6e6, #e6e6e6;
headerStyleName: standardDataGridHeader;
headerSeparatorColor: #d0d0d0;
headerSeparatorAlpha: 1;
horizontal-grid-lines: true;
horizontal-grid-line-color: #d0d0d0;
selection-color: #c2e5f2;
roll-over-color: #d4ebf3;
vertical-grid-lines: true;
vertical-grid-line-color: #d0d0d0;
user-roll-over: false;

text-align: left;

header-background-skin:  ClassReference("org.pcpgm.gis.flex.skins.DataGridHeaderBackgroundSkin");
    header-separator-skin: ClassReference("org.pcpgm.gis.flex.skins.DataGridHeaderSeparatorSkin");

    vertical-separator-skin: ClassReference("org.pcpgm.gis.flex.skins.DataGridVerticalSeparatorSkin");
    vertical-locked-separator-skin: ClassReference("org.pcpgm.gis.flex.skins.DataGridVerticalLockedSeparatorSkin");
}

s|DataGrid {

    alternating-row-colors: #ffffff, #f6f6f6;
    selection-color: #c2e5f2;
    roll-over-color: #d4ebf3;

    skinClass: ClassReference("org.pcpgm.gis.flex.skins.GIDataGridSkin");
}

skins|GIDataGridSkin {
    border-visible: false;  
}

grid|DefaultGridHeaderRenderer {
    vertical-align: middle;

    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;

    color: #4f4f4f;
    text-align: left;

    roll-over-color: #e6e6e6;

}

grid|DefaultGridHeaderRenderer #labelDisplay {
    fontFamily: SSPLight;
    font-size: 14pt;    
}

And I have set the item renderers for spark and mx components separately to allow for nonCFF versions of the fonts.

mx|Alert,
mx|DataGrid,
mx|Menu,
mx|DateChooser,
mx|Panel,
mx|TabNavigator {
    fontFamily: SSPNoCFF;
    defaultDataGridItemEditor: ClassReference("mx.controls.MXFTETextInput");
    defaultDataGridItemRenderer: ClassReference("mx.controls.dataGridClasses.FTEDataGridItemRenderer");
}

mx|AdvancedDataGrid,
controls|SearchSortedAdvancedDataGrid{
    fontFamily: SSPNoCFF;
    defaultDataGridItemEditor: ClassReference("mx.controls.MXFTETextInput");
    defaultDataGridItemRenderer: ClassReference("mx.controls.advancedDataGridClasses.FTEAdvancedDataGridItemRenderer"); 
}

Any help is greatly appreciated,

GD

Flex 4 MX AdvancedDataGrid embedded font in header reverting to Times for only some users

0 Answers0