Gestionar tablas de presentación en JavaScript

Una tabla en PowerPoint es una forma eficiente de mostrar y representar información. La información en una cuadrícula de celdas (dispuestas en filas y columnas) es directa y fácil de entender.

Aspose.Slides proporciona la clase Table, la clase Table, la clase Cell, la clase Cell y otros tipos para permitir crear, actualizar y gestionar tablas en todo tipo de presentaciones.

Crear tabla desde cero

Crear una instancia de la clase Presentation.
Obtener una referencia a una diapositiva mediante su índice.
Definir una matriz de columnWidth.
Definir una matriz de rowHeight.
Añadir un objeto Table a la diapositiva mediante el método addTable.
Recorrer cada Cell para aplicar formato a los bordes superior, inferior, derecho e izquierdo.
Fusionar las dos primeras celdas de la primera fila de la tabla.
Acceder al TextFrame de una Cell.
Añadir texto al TextFrame.
Guardar la presentación modificada.

Este código JavaScript muestra cómo crear una tabla en una presentación:

// Instancia una clase Presentation que representa un archivo PPTX
var pres = new aspose.slides.Presentation();
try {
    // Accede a la primera diapositiva
    var sld = pres.getSlides().get_Item(0);
    // Define columnas con anchuras y filas con alturas
    var dblCols = java.newArray("double", [50, 50, 50]);
    var dblRows = java.newArray("double", [50, 30, 30, 30, 30]);
    // Añade una forma de tabla a la diapositiva
    var tbl = sld.getShapes().addTable(100, 50, dblCols, dblRows);
    // Establece el formato de borde para cada celda
    for (var row = 0; row < tbl.getRows().size(); row++) {
        for (var cell = 0; cell < tbl.getRows().get_Item(row).size(); cell++) {
            var cellFormat = tbl.getRows().get_Item(row).get_Item(cell).getCellFormat();
            cellFormat.getBorderTop().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cellFormat.getBorderTop().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cellFormat.getBorderTop().setWidth(5);
            cellFormat.getBorderBottom().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cellFormat.getBorderBottom().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cellFormat.getBorderBottom().setWidth(5);
            cellFormat.getBorderLeft().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cellFormat.getBorderLeft().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cellFormat.getBorderLeft().setWidth(5);
            cellFormat.getBorderRight().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cellFormat.getBorderRight().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cellFormat.getBorderRight().setWidth(5);
        }
    }
    // Fusiona las celdas 1 y 2 de la fila 1
    tbl.mergeCells(tbl.getRows().get_Item(0).get_Item(0), tbl.getRows().get_Item(1).get_Item(1), false);
    // Añade texto a la celda fusionada
    tbl.getRows().get_Item(0).get_Item(0).getTextFrame().setText("Merged Cells");
    // Guarda la presentación en disco
    pres.save("table.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Numeración en tabla estándar

En una tabla estándar, la numeración de las celdas es directa y comienza en cero. La primera celda de una tabla tiene el índice 0,0 (columna 0, fila 0).

Por ejemplo, las celdas de una tabla con 4 columnas y 4 filas se numeran así:

(0, 0)	(1, 0)	(2, 0)	(3, 0)
(0, 1)	(1, 1)	(2, 1)	(3, 1)
(0, 2)	(1, 2)	(2, 2)	(3, 2)
(0, 3)	(1, 3)	(2, 3)	(3, 3)

Este código JavaScript muestra cómo especificar la numeración de las celdas en una tabla:

// Instancia una clase Presentation que representa un archivo PPTX
var pres = new aspose.slides.Presentation();
try {
    // Accede a la primera diapositiva
    var sld = pres.getSlides().get_Item(0);
    // Define columnas con anchuras y filas con alturas
    var dblCols = java.newArray("double", [70, 70, 70, 70]);
    var dblRows = java.newArray("double", [70, 70, 70, 70]);
    // Añade una forma de tabla a la diapositiva
    var tbl = sld.getShapes().addTable(100, 50, dblCols, dblRows);
    // Establece el formato de borde para cada celda
    for (let i = 0; i < tbl.getRows().size(); i++) {
        const row = tbl.getRows().get_Item(i);
        for (let j = 0; j < row.size(); j++) {
            const cell = row.get_Item(j);
            cell.getCellFormat().getBorderTop().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cell.getCellFormat().getBorderTop().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cell.getCellFormat().getBorderTop().setWidth(5);
            cell.getCellFormat().getBorderBottom().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cell.getCellFormat().getBorderBottom().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cell.getCellFormat().getBorderBottom().setWidth(5);
            cell.getCellFormat().getBorderLeft().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cell.getCellFormat().getBorderLeft().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cell.getCellFormat().getBorderLeft().setWidth(5);
            cell.getCellFormat().getBorderRight().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
            cell.getCellFormat().getBorderRight().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
            cell.getCellFormat().getBorderRight().setWidth(5);
        }
    }
    // Guarda la presentación en disco
    pres.save("StandardTables_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Acceder a una tabla existente

Crear una instancia de la clase Presentation.
Obtener una referencia a la diapositiva que contiene la tabla mediante su índice.
Crear un objeto Table y establecerlo en null.
Recorrer todos los objetos Shape hasta encontrar la tabla.

Si sospecha que la diapositiva que está tratando contiene una única tabla, puede simplemente comprobar todas las formas que contiene. Cuando una forma se identifica como tabla, puede convertirla a un objeto Table. Pero si la diapositiva contiene varias tablas, será mejor buscar la tabla que necesita mediante su setAlternativeText(String value).
Utilizar el objeto Table para trabajar con la tabla. En el ejemplo siguiente, añadimos una nueva fila a la tabla.
Guardar la presentación modificada.

Este código JavaScript muestra cómo acceder y trabajar con una tabla existente:

// Instancia la clase Presentation que representa un archivo PPTX
var pres = new aspose.slides.Presentation("UpdateExistingTable.pptx");
try {
    // Accede a la primera diapositiva
    var sld = pres.getSlides().get_Item(0);
    // Inicializa TableEx nulo
    var tbl = null;
    // Itera a través de las formas y establece una referencia a la tabla encontrada
    for (let i = 0; i < sld.getShapes().size(); i++) {
        let shp = sld.getShapes().get_Item(i);
        if (java.instanceOf(shp, "com.aspose.slides.ITable")) {
            tbl = shp;
            // Establece el texto para la primera columna de la segunda fila
            tbl.get_Item(0, 1).getTextFrame().setText("New");
        }
    }
    // Guarda la presentación modificada en disco
    pres.save("table1_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Alinear texto en la tabla

Crear una instancia de la clase Presentation.
Obtener una referencia a una diapositiva mediante su índice.
Añadir un objeto Table a la diapositiva.
Acceder a un objeto TextFrame de la tabla.
Acceder al Paragraph del TextFrame.
Alinear el texto verticalmente.
Guardar la presentación modificada.

Este código JavaScript muestra cómo alinear el texto en una tabla:

// Crea una instancia de la clase Presentation
var pres = new aspose.slides.Presentation();
try {
    // Obtiene la primera diapositiva
    var slide = pres.getSlides().get_Item(0);
    // Define columnas con anchuras y filas con alturas
    var dblCols = java.newArray("double", [120, 120, 120, 120]);
    var dblRows = java.newArray("double", [100, 100, 100, 100]);
    // Añade la forma de tabla a la diapositiva
    var tbl = slide.getShapes().addTable(100, 50, dblCols, dblRows);
    tbl.get_Item(1, 0).getTextFrame().setText("10");
    tbl.get_Item(2, 0).getTextFrame().setText("20");
    tbl.get_Item(3, 0).getTextFrame().setText("30");
    // Accede al marco de texto
    var txtFrame = tbl.get_Item(0, 0).getTextFrame();
    // Crea el objeto Paragraph para el marco de texto
    var paragraph = txtFrame.getParagraphs().get_Item(0);
    // Crea el objeto Portion para el párrafo
    var portion = paragraph.getPortions().get_Item(0);
    portion.setText("Text here");
    portion.getPortionFormat().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
    portion.getPortionFormat().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "BLACK"));
    // Alinea el texto verticalmente
    var cell = tbl.get_Item(0, 0);
    cell.setTextAnchorType(aspose.slides.TextAnchorType.Center);
    cell.setTextVerticalType(aspose.slides.TextVerticalType.Vertical270);
    // Guarda la presentación en disco
    pres.save("Vertical_Align_Text_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Establecer formato de texto a nivel de tabla

Crear una instancia de la clase Presentation.
Obtener una referencia a una diapositiva mediante su índice.
Acceder a un objeto Table de la diapositiva.
Establecer el setFontHeight(float value) para el texto.
Establecer el setAlignment(int value) y el setMarginRight(float value).
Establecer el setTextVerticalType(byte value).
Guardar la presentación modificada.

Este código JavaScript muestra cómo aplicar sus opciones de formato preferidas al texto de una tabla:

// Crea una instancia de la clase Presentation
var pres = new aspose.slides.Presentation("simpletable.pptx");
try {
    // Supongamos que la primera forma en la primera diapositiva es una tabla
    var someTable = pres.getSlides().get_Item(0).getShapes().get_Item(0);
    // Establece la altura de fuente de las celdas de la tabla
    var portionFormat = new aspose.slides.PortionFormat();
    portionFormat.setFontHeight(25);
    someTable.setTextFormat(portionFormat);
    // Establece la alineación del texto y el margen derecho de las celdas de la tabla en una sola llamada
    var paragraphFormat = new aspose.slides.ParagraphFormat();
    paragraphFormat.setAlignment(aspose.slides.TextAlignment.Right);
    paragraphFormat.setMarginRight(20);
    someTable.setTextFormat(paragraphFormat);
    // Establece el tipo de texto vertical de las celdas de la tabla
    var textFrameFormat = new aspose.slides.TextFrameFormat();
    textFrameFormat.setTextVerticalType(aspose.slides.TextVerticalType.Vertical);
    someTable.setTextFormat(textFrameFormat);
    pres.save("result.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Obtener propiedades de estilo de la tabla

Aspose.Slides le permite recuperar las propiedades de estilo de una tabla para que pueda utilizarlas en otra tabla o en otro lugar. Este código JavaScript muestra cómo obtener las propiedades de estilo a partir de un estilo predefinido de tabla:

var pres = new aspose.slides.Presentation();
try {
    var table = pres.getSlides().get_Item(0).getShapes().addTable(10, 10, java.newArray("double", [100, 150]), java.newArray("double", [5, 5, 5]));
    table.setStylePreset(aspose.slides.TableStylePreset.DarkStyle1);// change the default style preset theme
    pres.save("table.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Bloquear relación de aspecto de la tabla

La relación de aspecto de una forma geométrica es la proporción de sus dimensiones. Aspose.Slides proporciona la propiedad setAspectRatioLocked para permitir bloquear la configuración de relación de aspecto de tablas y otras formas.

Este código JavaScript muestra cómo bloquear la relación de aspecto de una tabla:

var pres = new aspose.slides.Presentation("pres.pptx");
try {
    var table = pres.getSlides().get_Item(0).getShapes().get_Item(0);
    console.log("Lock aspect ratio set: " + table.getGraphicalObjectLock().getAspectRatioLocked());
    table.getGraphicalObjectLock().setAspectRatioLocked(!table.getGraphicalObjectLock().getAspectRatioLocked());// invert
    console.log("Lock aspect ratio set: " + table.getGraphicalObjectLock().getAspectRatioLocked());
    pres.save("pres-out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

FAQ

¿Puedo habilitar la dirección de lectura de derecha a izquierda (RTL) para una tabla completa y el texto en sus celdas?

Sí. La tabla expone el método setRightToLeft, y los párrafos tienen ParagraphFormat.setRightToLeft. Usar ambos garantiza el orden RTL correcto y el renderizado dentro de las celdas.

¿Cómo puedo evitar que los usuarios muevan o cambien el tamaño de una tabla en el archivo final?

Utilice bloqueos de forma para desactivar mover, cambiar el tamaño, seleccionar, etc. Estos bloqueos también se aplican a las tablas.

¿Se admite insertar una imagen dentro de una celda como fondo?

Sí. Puede establecer un picture fill para una celda; la imagen cubrirá el área de la celda según el modo elegido (estirar o mosaico).

Visor de presentaciones