本文整理匯總了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);
});