Mise en surbrillance en croix
La mise en surbrillance en croix met en évidence la ligne et la colonne de la cellule sélectionnée afin de faciliter son repérage.
Mode plugin
Installation
pnpm add @univerjs/sheets-crosshair-highlightnpm install @univerjs/sheets-crosshair-highlightyarn add @univerjs/sheets-crosshair-highlightbun add @univerjs/sheets-crosshair-highlightUtilisation
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import { UniverSheetsCrosshairHighlightPlugin } from '@univerjs/sheets-crosshair-highlight'import SheetsCrosshairHighlightEnUS from '@univerjs/sheets-crosshair-highlight/locale/en-US'import '@univerjs/sheets-crosshair-highlight/lib/index.css'import '@univerjs/sheets-crosshair-highlight/facade'const univer = new Univer({ locale: LocaleType.EN_US, locales: { [LocaleType.EN_US]: mergeLocales( SheetsCrosshairHighlightEnUS, ), },})univer.registerPlugin(UniverSheetsCrosshairHighlightPlugin)Prise en charge mobile
Configurez d’abord l’éditeur mobile. Dans l’initialisation en mode plugin de cette page, remplacez les inscriptions de bureau ci-dessous par les exports mobiles des mêmes paquets avant d’ouvrir un document. Conservez modèles, styles, traductions et imports Facade ; n’enregistrez pas les deux variantes.
| Paquet | Inscription de bureau | Inscription mobile |
|---|---|---|
@univerjs/sheets-crosshair-highlight | UniverSheetsCrosshairHighlightPlugin | UniverSheetsCrosshairHighlightMobileUIPlugin |
Mode preset
La fonctionnalité de mise en surbrillance en croix ne propose pas de mode preset, mais son plugin peut être utilisé avec un preset.
pnpm add @univerjs/sheets-crosshair-highlightnpm install @univerjs/sheets-crosshair-highlightyarn add @univerjs/sheets-crosshair-highlightbun add @univerjs/sheets-crosshair-highlightUtilisation
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'import { UniverSheetsCrosshairHighlightPlugin } from '@univerjs/sheets-crosshair-highlight'import '@univerjs/sheets-crosshair-highlight/facade'import '@univerjs/sheets-crosshair-highlight/lib/index.css'const { univerAPI } = createUniver({ locale: LocaleType.EN_US, locales: { [LocaleType.EN_US]: mergeLocales( UniverPresetSheetsCoreEnUS, SheetsCrosshairHighlightEnUS, ), }, presets: [ UniverSheetsCorePreset(), ], plugins: [ UniverSheetsCrosshairHighlightPlugin, ],})Facade API
Les définitions de types complètes de la Facade API sont disponibles dans la FacadeAPI.
Importation
Remarque sur le mode plugin
Seul le mode plugin nécessite d’importer manuellement le package Facade. Le mode preset inclut déjà le package Facade correspondant ; aucun import supplémentaire n’est donc nécessaire.
import '@univerjs/sheets-crosshair-highlight/facade'Activer ou désactiver la mise en surbrillance en croix
univerAPI.setCrosshairHighlightEnabled(true)univerAPI.setCrosshairHighlightEnabled(false)Obtenir l’état d’activation de la mise en surbrillance en croix
univerAPI.getCrosshairHighlightEnabled()Écouteurs d’événements
Les définitions de types complètes des événements sont disponibles dans la page Events.
L’événement CrosshairHighlightEnabledChanged est déclenché lorsque l’état d’activation de la mise en surbrillance en croix change.
const disposable = univerAPI.addEvent(univerAPI.Event.CrosshairHighlightEnabledChanged, (params) => { const { enabled, workbook, worksheet } = params})// Remove the event listener using `disposable.dispose()`L’événement CrosshairHighlightColorChanged est déclenché lorsque la couleur de la mise en surbrillance en croix change.
const disposable = univerAPI.addEvent(univerAPI.Event.CrosshairHighlightColorChanged, (params) => { const { color, workbook, worksheet } = params})// Remove the event listener using `disposable.dispose()`Que pensez-vous de ce guide ?