Skip to main content

Rows, Settings, and Focus

Row Interfaces​

IBaseCollectionViewRow exposes essential fields:

export class BaseCollectionViewRow<T extends BaseCollectionViewLayout> implements IReusable, IBaseCollectionViewRow {
  rowState = RowState.None;
  isFocusable = true;
  focusTarget?: IHosannaView<ViewState>
  isHidden = false;
  height = 400;
  index = 0;
  content!: ICollectionViewDataSourceRow;
  container!: ISGNGroup;
  canReceiveFocus: boolean = false;
  viewportWidth = 1920;
  // ...
}

Settings Interface​

export interface ICollectionViewRowSettings extends IStyleDictionary {
  rowType?: string;
  customViewType?: string;
  height?: number;
  contentOffset?: [number, number];
  spacing?: number;
  cellSize?: [number, number];
  screenPosition?: [number, number];
  cellSettingsKey?: string;
  headerSettings?: ICollectionViewHeaderSettings;
  focusSettings?: ICollectionViewFocusSettings;
  numCols?: number;
}
Row Types
  • HorizontalRow (default), ListRow, GridRow: choose via style or rowType.
  • CustomViewRow: render a real Hosanna view per row via customViewType.

Focus Configuration​

export interface ICollectionViewFocusSettings {
  horizAnimSettings?: 'floating' | 'fixed';
  canLongPress?: boolean;
  vertAnimSettings?: 'fixed';
  indicatorAppearance?: 'none' | 'onTop' | 'underneath';
  indicatorImageUri?: string;
  indicatorBlendColor?: string;
  feedbackOffsets?: [number, number, number, number];
  displayMode?: FocusDisplayMode;
  focusedScale?: number;
}

Cells and Fragments​

DynamicCell hosts a fragment and applies per-state styles efficiently:

export class DynamicCell extends BaseCell {
  @inject() private viewFragmentProvider!: IViewFragmentProvider;
  viewFragment: IViewFragment | undefined = undefined;
  currentStyle = '';
  // ...
}
Tip: Data Maps

Fragments support data binding via ${data.*} placeholders. See FragmentUtils.applyDataMap.