Renderizza le diapositive di presentazione come immagini SVG su Android

Di cosa tratta questa pagina

Esporta le diapositive PowerPoint come immagini SVG su Android e controlla caratteri, testo, immagini, ID ed eventi con Aspose.Slides.

Panoramica

SVG è un formato immagine basato su XML scalabile che funziona bene per la pubblicazione web, i visualizzatori di diapositive, i flussi di lavoro di accessibilità e l’elaborazione post‑processo automatizzata. Aspose.Slides per Android tramite Java esporta ogni diapositiva in un file SVG separato e consente di controllare come vengono scritti testo, caratteri, immagini ed elementi SVG.

Utilizza SVGOptions quando l’SVG esportato deve essere compatto, prevedibile su tutti i browser o pronto per un uso interattivo.

Esporta una diapositiva come SVG

Crea una Presentation, seleziona una diapositiva e scrivila su uno stream con ISlide.writeAsSvg. L’esempio seguente esporta ogni diapositiva di una presentazione come file SVG separato.

Presentation presentation = new Presentation("presentation.pptx");
try {
    for (ISlide slide : presentation.getSlides()) {
        String outputFileName = String.format("slide-%d.svg", slide.getSlideNumber());

        try (FileOutputStream svgStream = new FileOutputStream(outputFileName)) {
            slide.writeAsSvg(svgStream);
        }
    }
} finally {
    presentation.dispose();
}

Il nome file utilizza ISlide.getSlideNumber anziché l’indice del ciclo. È inoltre possibile esportare una forma singola con IShape.writeAsSvg quando un visualizzatore di diapositive o una pagina web necessita solo di quella forma.

Configura l’output SVG

SVGOptions controlla il rendering SVG. Per le cornici di testo, SVGOptions.setUseFrameSize include la cornice di testo nell’area di rendering, e SVGOptions.setUseFrameRotation determina se viene applicata la rotazione della cornice. Imposta SVGOptions.setDisableFontLigatures su true quando il testo deve essere renderizzato senza legature.

Presentation presentation = new Presentation("presentation.pptx");
try {
    SVGOptions svgOptions = new SVGOptions();
    svgOptions.setDisableFontLigatures(true);
    svgOptions.setUseFrameSize(true);
    svgOptions.setUseFrameRotation(false);

    ISlide slide = presentation.getSlides().get_Item(0);
    try (FileOutputStream svgStream = new FileOutputStream("slide-with-custom-options.svg")) {
        slide.writeAsSvg(svgStream, svgOptions);
    }
} finally {
    presentation.dispose();
}

Controlla testo e caratteri

Vettorizza tutto il testo

Imposta SVGOptions.setVectorizeText su true per scrivere tutto il testo della diapositiva come grafica vettoriale. Questo elimina le dipendenze dai caratteri e rende il risultato visivo più coerente tra i vari browser, ma il testo non è più selezionabile o ricercabile come testo SVG.

Presentation presentation = new Presentation("presentation.pptx");
try {
    SVGOptions svgOptions = new SVGOptions();
    svgOptions.setVectorizeText(true);

    ISlide slide = presentation.getSlides().get_Item(0);
    try (FileOutputStream svgStream = new FileOutputStream("slide-with-vectorized-text.svg")) {
        slide.writeAsSvg(svgStream, svgOptions);
    }
} finally {
    presentation.dispose();
}

Scegli come gestire i caratteri esterni

SVGOptions.setExternalFontsHandling utilizza un valore SvgExternalFontsHandling per i caratteri caricati esternamente. Scegli SvgExternalFontsHandling.AddLinksToFontFiles per fare riferimento a file di caratteri separati, SvgExternalFontsHandling.Embed per includere i dati dei caratteri nell’SVG, o SvgExternalFontsHandling.Vectorize per renderizzare solo il testo che utilizza caratteri esterni come grafica. Verifica la licenza dei caratteri prima di incorporarli.

Presentation presentation = new Presentation("presentation.pptx");
try {
    ISlide slide = presentation.getSlides().get_Item(0);

    SVGOptions linkedFontsOptions = new SVGOptions();
    linkedFontsOptions.setExternalFontsHandling(SvgExternalFontsHandling.AddLinksToFontFiles);
    try (FileOutputStream linkedFontsStream = new FileOutputStream("slide-with-font-links.svg")) {
        slide.writeAsSvg(linkedFontsStream, linkedFontsOptions);
    }

    SVGOptions embeddedFontsOptions = new SVGOptions();
    embeddedFontsOptions.setExternalFontsHandling(SvgExternalFontsHandling.Embed);
    try (FileOutputStream embeddedFontsStream = new FileOutputStream("slide-with-embedded-fonts.svg")) {
        slide.writeAsSvg(embeddedFontsStream, embeddedFontsOptions);
    }

    SVGOptions vectorizedExternalFontsOptions = new SVGOptions();
    vectorizedExternalFontsOptions.setExternalFontsHandling(SvgExternalFontsHandling.Vectorize);
    try (FileOutputStream vectorizedExternalFontsStream = new FileOutputStream("slide-with-vectorized-external-fonts.svg")) {
        slide.writeAsSvg(vectorizedExternalFontsStream, vectorizedExternalFontsOptions);
    }
} finally {
    presentation.dispose();
}

Riduci le dimensioni delle immagini incorporate

Utilizza SVGOptions.setPicturesCompression per ridurre la risoluzione delle immagini incorporate, SVGOptions.setDeletePicturesCroppedAreas per omettere le aree di origine ritagliate e SVGOptions.setJpegQuality per controllare la qualità della codifica JPEG. Queste impostazioni riducono la dimensione del file a scapito della fedeltà dell’immagine o dei dati immagine conservati.

Presentation presentation = new Presentation("presentation.pptx");
try {
    SVGOptions svgOptions = new SVGOptions();
    svgOptions.setPicturesCompression(PicturesCompression.Dpi150);
    svgOptions.setDeletePicturesCroppedAreas(true);
    svgOptions.setJpegQuality(80);

    ISlide slide = presentation.getSlides().get_Item(0);
    try (FileOutputStream svgStream = new FileOutputStream("compressed-slide.svg")) {
        slide.writeAsSvg(svgStream, svgOptions);
    }
} finally {
    presentation.dispose();
}

Assegna ID stabili a forme e testo

Utilizza ISvgShapeFormattingController per impostare ISvgShape.setId per ogni forma SVG. Per impostare i valori ISvgTSpan.setId sugli elementi di testo tspan, implementa ISvgShapeAndTextFormattingController. Assegna uno dei due controller con SVGOptions.setShapeFormattingController.

Il controller seguente utilizza IShape.getOfficeInteropShapeId, che è stabile per tutta la vita della forma, e un contatore ripetibile per i suoi tspan di testo. Questo rende gli ID generati idonei per il post‑processo di una presentazione non modificata.

class StableSvgIdController implements ISvgShapeAndTextFormattingController {
    private String currentShapeId = "";
    private int textSpanIndex;

    public void formatShape(ISvgShape svgShape, IShape shape) {
        currentShapeId = String.format("shape-%d", shape.getOfficeInteropShapeId());
        textSpanIndex = 0;
        svgShape.setId(currentShapeId);
    }

    public void formatText(ISvgTSpan svgTSpan, IPortion portion, ITextFrame textFrame) {
        svgTSpan.setId(String.format("%s-text-%d", currentShapeId, textSpanIndex++));
    }
}

Presentation presentation = new Presentation("presentation.pptx");
try {
    SVGOptions svgOptions = new SVGOptions();
    svgOptions.setShapeFormattingController(new StableSvgIdController());

    ISlide slide = presentation.getSlides().get_Item(0);
    try (FileOutputStream svgStream = new FileOutputStream("slide-with-stable-ids.svg")) {
        slide.writeAsSvg(svgStream, svgOptions);
    }
} finally {
    presentation.dispose();
}

Aggiungi gestori di eventi SVG

In un ISvgShapeFormattingController, chiama ISvgShape.setEventHandler con un valore SvgEvent per aggiungere un gestore di eventi JavaScript a una forma esportata. Assegna il controller con SVGOptions.setShapeFormattingController e definisci la funzione JavaScript nella pagina o nel documento SVG che ospita il risultato.

class SvgEventController implements ISvgShapeFormattingController {
    public void formatShape(ISvgShape svgShape, IShape shape) {
        if ("ActionButton".equals(shape.getName())) {
            svgShape.setId("action-button");
            svgShape.setEventHandler(SvgEvent.OnClick, "handleShapeClick(event)");
        }
    }
}

Presentation presentation = new Presentation("presentation.pptx");
try {
    SVGOptions svgOptions = new SVGOptions();
    svgOptions.setShapeFormattingController(new SvgEventController());

    ISlide slide = presentation.getSlides().get_Item(0);
    try (FileOutputStream svgStream = new FileOutputStream("interactive-slide.svg")) {
        slide.writeAsSvg(svgStream, svgOptions);
    }
} finally {
    presentation.dispose();
}

La pagina host può definire la funzione JavaScript a cui fa riferimento il gestore. L’assegnazione di ID e gestori di eventi consente visualizzatori di diapositive, miglioramenti di accessibilità e altri flussi di lavoro SVG interattivi.

FAQ

Quando dovrei usare SVGOptions.setVectorizeText invece di SvgExternalFontsHandling.Vectorize?

Utilizza SVGOptions.setVectorizeText quando tutto il testo deve essere indipendente dai caratteri. Usa SvgExternalFontsHandling.Vectorize quando solo il testo che utilizza caratteri esterni deve essere convertito in grafica.

Qual è il modo migliore per rendere un SVG più piccolo?

Inizia comprimendo le immagini incorporate, eliminando le aree di immagine ritagliate e scegliendo file di caratteri collegati quando l’ambiente di destinazione può servirli. Verifica il risultato perché una risoluzione dell’immagine più bassa, una qualità JPEG inferiore e il testo vettorizzato hanno ciascuno compromessi diversi tra qualità e dimensione.

Posso modificare gli elementi SVG esportati dopo l’esportazione?

Sì. Assegna gli ID tramite un controller di formattazione, quindi seleziona gli elementi SVG corrispondenti nel tuo strumento di post‑processo o nello script del browser.