Trabajando con la función de resaltado de GridJs
Contents
[
Hide
]
Trabajando con la función de resaltado de GridJs
Apoyamos las siguientes APIs de JS para la función de resaltado
- Habilitar resaltado y Establecer estilo de resaltado, todas las APIs de resaltado solo funcionarán después de que se establezca el estilo de resaltado en la hoja de cálculo activa
xs.sheet.showHighlights(style)
// the parameter is:
style: the style for highlight ,currently only support color
for example: {'color':'rgba(85, 57, 47, 0.08)'}
- actualizar el estilo de resaltado establecido en la hoja de cálculo activa
xs.sheet.updateHighlightStyle(style)
// the parameter is:
style: the style for highlight ,currently only support color
for example: {'color':'rgba(85, 57, 47, 0.08)'}
- Deshabilitar resaltado en la hoja de cálculo activa
xs.sheet.hideHighlights()
- Agregar texto de celda para resaltar en la hoja de cálculo activa
xs.sheet.addHighlightText(row,col,startpostion,endposition)
// the parameters are:
row:row index
col:column index
startpostion: highlight start postion in cell text
endpostion: highlight end postion in cell text
//it support multiple range postion inside one cell
- Eliminar resaltado para texto de celda en matriz en la hoja de cálculo activa
xs.sheet.removeHighlightText(row,col,startpostion,endposition)
// the parameters are:
row:row index
col:column index
startpostion: highlight start postion in cell text
endpostion: highlight end postion in cell text
- Obtener matriz para resaltar texto de celda en la hoja de cálculo activa
xs.sheet.getHighlightTexts()
- Agregar rango de celdas para resaltar en la hoja de cálculo activa
xs.sheet.addHighlightRange(sri,sci,eri,eci)
// the parameters are:
sri:start row index of cell range
sci:start column index of cell range
eri:end row index of cell range
eci:end column index of cell range
- Eliminar resaltado para rango de celdas en matriz en la hoja de cálculo activa
xs.sheet.removeHighlightRange(sri,sci,eri,eci)
// the parameters are:
sri:start row index of cell range
sci:start column index of cell range
eri:end row index of cell range
eci:end column index of cell range
- Obtener matriz para resaltar rango de celdas en la hoja de cálculo activa
xs.sheet.getHighlightRanges()
- Establecer rango de celdas para resaltar inversamente en la hoja de cálculo activa
xs.sheet.setHighlightInverseRange(sri,sci,eri,eci)
// the parameters are:
sri:start row index of cell range
sci:start column index of cell range
eri:end row index of cell range
eci:end column index of cell range
- Quitar resaltado para resaltar inversamente en la hoja de cálculo activa
xs.sheet.removeHighlightInverseRange()
- Obtener rango de celdas de resaltado inverso en la hoja de cálculo activa
xs.sheet.getHighlightInverseRange()
- Agregar forma al conjunto de resaltado en la hoja de cálculo activa
xs.sheet.addHighlightShape(shapeid)
// the parameters are:
shapeid: the id of shape, can be find in xs.sheet.data.shapes
- Quitar forma resaltada en conjunto en la hoja de cálculo activa
xs.sheet.removeHighlightShape(shapeid)
// the parameters are:
shapeid: the id of shape, can be find in xs.sheet.data.shapes
- Obtener arreglo de formas resaltadas en la hoja de cálculo activa
xs.sheet.getHighlightShaps()
- Agregar cuadro de texto para resaltar, el cuadro de texto es un tipo especial de forma cuya propiedad de tipo es :“TextBox”, en la hoja de cálculo activa
xs.sheet.addHighlightTextBox(shapeid, startpostion, endposition)
// the parameters are:
shapeid: the id of shape, can be find in xs.sheet.data.shapes whose type is 'TextBox'
startpostion: highlight start postion in the text of textbox
endpostion: highlight end postion in the text of textbox
//it support multiple range postion inside one textbox
- Quitar rango resaltado en el cuadro de texto, el cuadro de texto es un tipo especial de forma cuya propiedad de tipo es :“TextBox”, en la hoja de cálculo activa
xs.sheet.removeHighlightTextBox(shapeid, startpostion, endposition)
// the parameters are:
shapeid: the id of shape, can be find in xs.sheet.data.shapes whose type is 'TextBox'
startpostion: highlight start postion in the text of textbox
endpostion: highlight end postion in the text of textbox
//it support multiple range postion inside one textbox
- Agregar imagen al conjunto de resaltado en la hoja de cálculo activa
xs.sheet.addHighlightImage(imageid)
// the parameters are:
imageid: the id of image, can be find in xs.sheet.data.images
- Quitar imagen resaltada en conjunto en la hoja de cálculo activa
xs.sheet.removeHighlightImage(imageid)
// the parameters are:
imageid: the id of image, can be find in xs.sheet.data.images
- Obtener arreglo de imágenes resaltadas
xs.sheet.getHighlightImages()
- establecer si resaltar todos los objetos en la hoja de cálculo activa, incluir todas las formas e imágenes y toda el área de la hoja de cálculo
xs.sheet.setHighlightAll(ishighlightall,isrerender=true)
// the parameters are:
ishighlightall: true or false,whether to highlight all
isrerender: true or false,whether to reRender
- Establecer función de resaltado de imagen personalizada
xs.sheet.setCustomHighlightImgFunc(func)
// the parameters are:
func: the custom highlight image function, it shall take two parameters ,first is ishighlight,the second one is the fabric image object
//we use fabric js to manage image object, please refer to http://fabricjs.com/image-filters to check more info
below is an example for the decleare function:
const customHighlightImage = (ishighlight, imgobj) => {
imgobj.filters[0] = ishighlight ? new fabric.Image.filters.Sepia() : false;
imgobj.applyFilters();
}
- Limpiar configuración de resaltado para la hoja de cálculo activa
xs.sheet.clearHighlights()
Resaltar para objeto cuadro de texto
el cuadro de texto es un tipo especial de forma cuya propiedad de tipo es :“TextBox”, por ejemplo: el código a continuación mostrará qué forma es cuadro de texto
for (let shape of xs.sheet.data.shapes) {
if (shape.type === 'TextBox') {
console.log(shape.id + ' is a textbox');
}
}
- Agregar resaltado para objeto cuadro de texto
addHighlight(startpostion,endposition)
// the parameters are:
startpostion: highlight start postion in textbox
endpostion: highlight end postion in textbox
//for example,we assume shape 0 is a textbox object
const textbox=xs.sheet.data.shapes[0];
//first we shall add to highlight shape to enable the highlight for the textbox shape object,it support multiple range postion
xs.sheet.addHighlightShape(textbox.id);
textbox.addHighlight(5,10);
textbox.addHighlight(18,28);
- Quitar resaltado para objeto cuadro de texto
removeHighlight(startpostion,endposition)
// the parameters are:
startpostion: highlight start postion in textbox
endpostion: highlight end postion in textbox
//for example,we assume shape 0 is a textbox object
const textbox=xs.sheet.data.shapes[0];
textbox.removeHighlight(5,10);
- Obtener resaltado para objeto cuadro de texto
getHighlight()
//for example,we assume shape 0 is a textbox object
const textbox=xs.sheet.data.shapes[0];
textbox.getHighlight();
- Cambiar el color de fondo para el objeto de cuadro de texto
setBackgroundColor(color)
// the parameters are:
color: the html color value in hex string value
//for example,we assume shape 0 is a textbox object,this will set the background color to Yellow
const textbox=xs.sheet.data.shapes[0];
textbox.setBackgroundColor('#FFFF00');
- Cambiar automáticamente el color de fondo y el color del texto para obtener un efecto visual activo
setActiveEffect(boolvalue)
// the parameters are:
boolvalue: if true,will change background color and the text color of the textbox object;if false,restore to original appearence
- Ocultar/mostrar el contenido de texto en el objeto de cuadro de texto
hideText(boolvalue)
// the parameters are:
boolvalue: if true,will not display the text in the textbox object;if false,restore to original appearence
Puede encontrar más en nuestra página de demostración en GitHub https://github.com/aspose-cells/Aspose.Cells-for-.NET/blob/master/Examples_GridJs/wwwroot/xspread/index.html