Forme personnalisée

Modifier une forme à l’aide des points d’édition

Considérez un carré. Dans PowerPoint, en utilisant les points d’édition, vous pouvez

déplacer le coin du carré vers l’intérieur ou l’extérieur
spécifier la courbure d’un coin ou d’un point
ajouter de nouveaux points au carré
manipuler les points du carré, etc.

Essentiellement, vous pouvez effectuer les tâches décrites sur n’importe quelle forme. En utilisant les points d’édition, vous pouvez modifier une forme ou créer une nouvelle forme à partir d’une forme existante.

Conseils pour l’édition de formes

overview_image

Avant de commencer à modifier les formes PowerPoint à l’aide des points d’édition, vous voudrez peut‑être prendre en compte les points suivants concernant les formes :

Une forme (ou son chemin) peut être fermée ou ouverte.
Lorsqu’une forme est fermée, elle n’a pas de point de départ ou d’arrivée. Lorsqu’une forme est ouverte, elle possède un début et une fin.
Toutes les formes sont composées d’au moins 2 points d’ancrage reliés entre eux par des lignes
Une ligne est soit droite, soit courbe. Les points d’ancrage déterminent la nature de la ligne.
Les points d’ancrage existent sous forme de points d’angle, points droits ou points lisses :
- Un point d’angle est un point où 2 lignes droites se rejoignent sous un angle.
- Un point lisse est un point où 2 poignées existent sur une ligne droite et les segments de la ligne se rejoignent dans une courbe fluide. Dans ce cas, toutes les poignées sont séparées du point d’ancrage par une distance égale.
- Un point droit est un point où 2 poignées existent sur une ligne droite et les segments de cette ligne se rejoignent dans une courbe fluide. Dans ce cas, les poignées n’ont pas besoin d’être séparées du point d’ancrage par une distance égale.
En déplaçant ou en modifiant les points d’ancrage (ce qui change l’angle des lignes), vous pouvez modifier l’apparence d’une forme.

Pour modifier les formes PowerPoint via les points d’édition, Aspose.Slides fournit la classe GeometryPath et la classe GeometryPath.

Une instance de GeometryPath représente un chemin géométrique de l’objet GeometryShape.
Pour récupérer le GeometryPath à partir de l’instance GeometryShape, vous pouvez utiliser la méthode GeometryShape.getGeometryPaths.
Pour définir le GeometryPath d’une forme, vous pouvez utiliser ces méthodes : GeometryShape.setGeometryPath pour les formes pleines et GeometryShape.setGeometryPaths pour les formes composites.
Pour ajouter des segments, vous pouvez utiliser les méthodes de la classe GeometryPath.
En utilisant les méthodes GeometryPath.setStroke et GeometryPath.setFillMode, vous pouvez définir l’apparence d’un chemin géométrique.
En utilisant la méthode GeometryPath.getPathData vous pouvez récupérer le chemin géométrique d’un GeometryShape sous forme d’un tableau de segments de chemin.
Pour accéder à des options supplémentaires de personnalisation de la géométrie des formes, vous pouvez convertir GeometryPath en java.awt.Shape.
Utilisez les méthodes geometryPathToGraphicsPath et graphicsPathToGeometryPath (de la classe ShapeUtil) pour convertir GeometryPath en java.awt.Shape et inversement.

Opérations d’édition simples

Ce code JavaScript vous montre comment

Ajouter une ligne à la fin d’un chemin

lineTo(point);
lineTo(x, y);

Ajouter une ligne à une position spécifiée sur un chemin :

lineTo(point, index);
lineTo(x, y, index);

Ajouter une courbe de Bézier cubique à la fin d’un chemin :

cubicBezierTo(point1, point2, point3);
cubicBezierTo(x1, y1, x2, y2, x3, y3);

Ajouter une courbe de Bézier cubique à la position spécifiée sur un chemin :

cubicBezierTo(point1, point2, point3);
cubicBezierTo(x1, y1, x2, y2, x3, y3);

Ajouter une courbe de Bézier quadratique à la fin d’un chemin :

quadraticBezierTo(point1, point2);
quadraticBezierTo(x1, y1, x2, y2);

Ajouter une courbe de Bézier quadratique à la position spécifiée sur un chemin :

quadraticBezierTo(point1, point2, index);
quadraticBezierTo(x1, y1, x2, y2, index);

Ajouter un arc donné à un chemin :

arcTo(width, heigth, startAngle, sweepAngle);

Fermer la figure actuelle d’un chemin :

closeFigure();

Définir la position du point suivant :

moveTo(point);
moveTo(x, y);

Supprimer le segment de chemin à un indice donné :

removeAt(index);

Ajouter des points personnalisés à la forme

Créez une instance de la classe GeometryShape et définissez le type ShapeType.Rectangle.
Obtenez une instance de la classe GeometryPath à partir de la forme.
Ajoutez un nouveau point entre les deux points supérieurs du chemin.
Ajoutez un nouveau point entre les deux points inférieurs du chemin.
Appliquez le chemin à la forme.

Ce code JavaScript vous montre comment ajouter des points personnalisés à une forme :

var pres = new aspose.slides.Presentation();
try {
    var shape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Rectangle, 100, 100, 200, 100);
    var geometryPath = shape.getGeometryPaths()[0];
    geometryPath.lineTo(100, 50, 1);
    geometryPath.lineTo(100, 50, 4);
    shape.setGeometryPath(geometryPath);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

example1_image

Supprimer des points d’une forme

Créez une instance de la classe GeometryShape et définissez le type ShapeType.Heart.
Obtenez une instance de la classe GeometryPath à partir de la forme.
Supprimez le segment du chemin.
Appliquez le chemin à la forme.

Ce code JavaScript vous montre comment supprimer des points d’une forme :

var pres = new aspose.slides.Presentation();
try {
    var shape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Heart, 100, 100, 300, 300);
    var path = shape.getGeometryPaths()[0];
    path.removeAt(2);
    shape.setGeometryPath(path);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

example2_image

Créer une forme personnalisée

Calculez les points de la forme.
Créez une instance de la classe GeometryPath.
Remplissez le chemin avec les points.
Créez une instance de la classe GeometryShape.
Appliquez le chemin à la forme.

Ce JavaScript vous montre comment créer une forme personnalisée :

var points = java.newInstanceSync("java.util.ArrayList");
var R = 100;
var r = 50;
var step = 72;
for (var angle = -90; angle < 270; angle += step) {
    var radians = angle * (java.getStaticFieldValue("java.lang.Math", "PI") / 180.0);
    var x = R * java.callStaticMethodSync("java.lang.Math", "cos", radians);
    var y = R * java.callStaticMethodSync("java.lang.Math", "sin", radians);
    points.add(java.newInstanceSync("com.aspose.slides.Point2DFloat", java.newFloat(x + R), java.newFloat(y + R)));
    radians = (java.getStaticFieldValue("java.lang.Math", "PI") * (angle + (step / 2))) / 180.0;
    x = r * java.callStaticMethodSync("java.lang.Math", "cos", radians);
    y = r * java.callStaticMethodSync("java.lang.Math", "sin", radians);
    points.add(java.newInstanceSync("com.aspose.slides.Point2DFloat", java.newFloat(x + R), java.newFloat(y + R)));
}
var starPath = new aspose.slides.GeometryPath();
starPath.moveTo(points.get(0));
for (var i = 1; i < points.size(); i++) {
    starPath.lineTo(points.get(i));
}
starPath.closeFigure();
var pres = new aspose.slides.Presentation();
try {
    var shape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Rectangle, 100, 100, R * 2, R * 2);
    shape.setGeometryPath(starPath);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

example3_image

Créer une forme personnalisée composite

Créez une instance de la classe GeometryShape.
Créez une première instance de la classe GeometryPath.
Créez une seconde instance de la classe GeometryPath.
Appliquez les chemins à la forme.

Ce code JavaScript vous montre comment créer une forme personnalisée composite :

var pres = new aspose.slides.Presentation();
try {
    var shape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Rectangle, 100, 100, 200, 100);
    var geometryPath0 = new aspose.slides.GeometryPath();
    geometryPath0.moveTo(0, 0);
    geometryPath0.lineTo(shape.getWidth(), 0);
    geometryPath0.lineTo(shape.getWidth(), shape.getHeight() / 3);
    geometryPath0.lineTo(0, shape.getHeight() / 3);
    geometryPath0.closeFigure();
    var geometryPath1 = new aspose.slides.GeometryPath();
    geometryPath1.moveTo(0, (shape.getHeight() / 3) * 2);
    geometryPath1.lineTo(shape.getWidth(), (shape.getHeight() / 3) * 2);
    geometryPath1.lineTo(shape.getWidth(), shape.getHeight());
    geometryPath1.lineTo(0, shape.getHeight());
    geometryPath1.closeFigure();
    shape.setGeometryPaths(java.newArray("com.aspose.slides.GeometryPath",[geometryPath0, geometryPath1]));
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

example4_image

Créer une forme personnalisée avec coins arrondis

Ce code JavaScript vous montre comment créer une forme personnalisée avec des coins arrondis (vers l’intérieur) ;

var shapeX = 20.0;
var shapeY = 20.0;
var shapeWidth = 300.0;
var shapeHeight = 200.0;
var leftTopSize = 50.0;
var rightTopSize = 20.0;
var rightBottomSize = 40.0;
var leftBottomSize = 10.0;
var pres = new aspose.slides.Presentation();
try {
    var childShape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Custom, shapeX, shapeY, shapeWidth, shapeHeight);
    var geometryPath = new aspose.slides.GeometryPath();
    var point1 = java.newInstanceSync("com.aspose.slides.Point2DFloat", leftTopSize, 0);
    var point2 = java.newInstanceSync("com.aspose.slides.Point2DFloat", shapeWidth - rightTopSize, 0);
    var point3 = java.newInstanceSync("com.aspose.slides.Point2DFloat", shapeWidth, shapeHeight - rightBottomSize);
    var point4 = java.newInstanceSync("com.aspose.slides.Point2DFloat", leftBottomSize, shapeHeight);
    var point5 = java.newInstanceSync("com.aspose.slides.Point2DFloat", 0, leftTopSize);
    geometryPath.moveTo(point1);
    geometryPath.lineTo(point2);
    geometryPath.arcTo(rightTopSize, rightTopSize, 180, -90);
    geometryPath.lineTo(point3);
    geometryPath.arcTo(rightBottomSize, rightBottomSize, -90, -90);
    geometryPath.lineTo(point4);
    geometryPath.arcTo(leftBottomSize, leftBottomSize, 0, -90);
    geometryPath.lineTo(point5);
    geometryPath.arcTo(leftTopSize, leftTopSize, 90, -90);
    geometryPath.closeFigure();
    childShape.setGeometryPath(geometryPath);
    pres.save("output.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Déterminer si la géométrie d’une forme est fermée

Une forme fermée est définie comme une forme dont tous les côtés sont reliés, formant une seule frontière sans espaces. Une telle forme peut être une forme géométrique simple ou un contour personnalisé complexe. L’exemple de code suivant montre comment vérifier si la géométrie d’une forme est fermée :

function isGeometryClosed(geometryShape) 
{
    let isClosed = null;

    geometryShape.getGeometryPaths().forEach(geometryPath => {
        const pathData = geometryPath.getPathData();
        const dataLength = pathData.length;

        if (dataLength === 0) return;

        const lastSegment = pathData[dataLength - 1];
        isClosed = lastSegment.getPathCommand() === aspose.slides.PathCommandType.Close;

        if (!isClosed) return false;
    });

    return isClosed === true;
}

Convertir GeometryPath en java.awt.Shape

Créez une instance de la classe GeometryShape.
Créez une instance de la classe java.awt.Shape.
Convertissez l’instance java.awt.Shape en instance GeometryPath à l’aide de ShapeUtil.
Appliquez les chemins à la forme.

Ce code JavaScript—une implémentation des étapes ci‑dessus—décrit le processus de conversion de GeometryPath en GraphicsPath :

var pres = new aspose.slides.Presentation();
try {
    // Créer une nouvelle forme
    var shape = pres.getSlides().get_Item(0).getShapes().addAutoShape(aspose.slides.ShapeType.Rectangle, 100, 100, 300, 100);
    // Obtenir le chemin géométrique de la forme
    var originalPath = shape.getGeometryPaths()[0];
    originalPath.setFillMode(aspose.slides.PathFillModeType.None);
    // Créer un nouveau chemin graphique avec du texte
    var graphicsPath;
    var font = java.newInstanceSync("java.awt.Font", "Arial", java.getStaticFieldValue("java.awt.Font", "PLAIN"), 40);
    var text = "Text in shape";
    var img = java.newInstanceSync("BufferedImage", 100, 100, java.getStaticFieldValue("BufferedImage", "TYPE_INT_ARGB"));
    var g2 = img.createGraphics();
    try {
        var glyphVector = font.createGlyphVector(g2.getFontRenderContext(), text);
        graphicsPath = glyphVector.getOutline(20.0, -glyphVector.getVisualBounds().getY() + 10);
    } finally {
        g2.dispose();
    }
    // Convertir le chemin graphique en chemin géométrique
    var textPath = aspose.slides.ShapeUtil.graphicsPathToGeometryPath(graphicsPath);
    textPath.setFillMode(aspose.slides.PathFillModeType.Normal);
    // Définir la combinaison du nouveau chemin géométrique et du chemin géométrique original sur la forme
    shape.setGeometryPaths(java.newArray("com.aspose.slides.IGeometryPath", [originalPath, textPath]));
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

example5_image

FAQ

Que se passe-t-il pour le remplissage et le contour après le remplacement de la géométrie ?

Le style reste attaché à la forme ; seul le contour change. Le remplissage et le contour sont automatiquement appliqués à la nouvelle géométrie.

Comment faire pivoter correctement une forme personnalisée avec sa géométrie ?

Utilisez la méthode setRotation de la forme ; la géométrie tourne avec la forme car elle est liée au système de coordonnées propre à la forme.

Puis-je convertir une forme personnalisée en image pour « verrouiller » le résultat ?

Oui. Exportez la zone de la diapositive requise ou la forme elle‑même vers un format raster ; cela simplifie le travail ultérieur avec des géométries lourdes.

Visionneuse de présentation