本文整理汇总了TypeScript中@ephox/alloy.SystemEvents.windowResize方法的典型用法代码示例。如果您正苦于以下问题:TypeScript SystemEvents.windowResize方法的具体用法?TypeScript SystemEvents.windowResize怎么用?TypeScript SystemEvents.windowResize使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类@ephox/alloy.SystemEvents
的用法示例。
在下文中一共展示了SystemEvents.windowResize方法的2个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: measureHeights
const smartTabHeight = (() => {
const maxTabHeight = Cell<Option<number>>(Option.none());
const extraEvents = [
AlloyEvents.runOnAttached((comp) => {
SelectorFind.descendant(comp.element(), '[role="tabpanel"]').each((tabview) => {
Css.set(tabview, 'visibility', 'hidden');
// Determine the maximum heights of each tab
comp.getSystem().getByDom(tabview).toOption().each((tabviewComp) => {
const heights = measureHeights(allTabs, tabview, tabviewComp);
// Calculate the maximum tab height and store it
const maxTabHeightOpt = getMaxHeight(heights);
maxTabHeight.set(maxTabHeightOpt);
});
// Set an initial height, based on the current size
updateTabviewHeight(comp.element(), tabview, maxTabHeight);
// Show the tabs
Css.remove(tabview, 'visibility');
showTab(allTabs, comp);
// Use a delay here and recalculate the height, as we need all the components attached
// to be able to properly calculate the max height
Delay.requestAnimationFrame(() => {
updateTabviewHeight(comp.element(), tabview, maxTabHeight);
});
});
}),
AlloyEvents.run(SystemEvents.windowResize(), (comp) => {
SelectorFind.descendant(comp.element(), '[role="tabpanel"]').each((tabview) => {
updateTabviewHeight(comp.element(), tabview, maxTabHeight);
});
}),
AlloyEvents.run(formResizeEvent, (comp, se) => {
SelectorFind.descendant(comp.element(), '[role="tabpanel"]').each((tabview) => {
const oldFocus = Focus.active();
Css.set(tabview, 'visibility', 'hidden');
const oldHeight = Css.getRaw(tabview, 'height').map((h) => parseInt(h, 10));
Css.remove(tabview, 'height');
const newHeight = tabview.dom().getBoundingClientRect().height;
const hasGrown = oldHeight.forall((h) => newHeight > h);
if (hasGrown) {
maxTabHeight.set(Option.from(newHeight));
updateTabviewHeight(comp.element(), tabview, maxTabHeight);
} else {
oldHeight.each((h) => {
Css.set(tabview, 'height', `${h}px`);
});
}
Css.remove(tabview, 'visibility');
oldFocus.each(Focus.focus);
});
})
];
const selectFirst = false;
return {
extraEvents,
selectFirst
};
})();
示例2:
Arr.each([ mothership, uiMothership ], (ship) => {
ship.broadcastEvent(SystemEvents.windowResize(), evt);
});