Vykreslit snímky prezentace jako SVG obrázky na Androidu

O čem je tato stránka

Exportujte snímky PowerPointu jako SVG obrázky na Androidu a ovládejte písma, text, obrázky, ID a události pomocí Aspose.Slides.

Přehled

SVG je škálovatelný formát obrázků založený na XML, který se dobře hodí pro webové publikování, prohlížeče snímků, workflow přístupnosti a automatické následné zpracování. Aspose.Slides for Android via Java exportuje každý snímek do samostatného souboru SVG a umožňuje vám řídit, jak jsou zapisovány text, písma, obrázky a elementy SVG.

Použijte SVGOptions když exportovaný SVG musí být kompaktní, předvídatelný napříč prohlížeči nebo připravený k interaktivnímu použití.

Exportovat snímek jako SVG

Vytvořte Presentation, vyberte snímek a zapište jej do proudu pomocí ISlide.writeAsSvg. Následující příklad exportuje každý snímek v prezentaci jako samostatný soubor SVG.

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();
}

Název souboru používá ISlide.getSlideNumber místo indexu smyčky. Také můžete exportovat jednotlivý tvar pomocí IShape.writeAsSvg pokud prohlížeč snímků nebo webová stránka potřebuje jen tento tvar.

Nastavit výstup SVG

SVGOptions řídí vykreslování SVG. Pro textové rámce SVGOptions.setUseFrameSize zahrnuje textový rámec do oblasti vykreslování a SVGOptions.setUseFrameRotation určuje, zda se použije rotace rámce. Nastavte SVGOptions.setDisableFontLigatures na true, když text musí být vykreslen bez ligatur.

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();
}

Ovládání ořezávání konců čar u šipek

SVG 1.1 nemá nastavení vkladu markeru, které by určovalo, kde má čára končit pod šipkou. Ve výchozím nastavení Aspose.Slides zkracuje exportovanou čáru, aby její tah nevyčníval přes marker. Zavolejte SVGOptions.setDisableLineEndCropping s hodnotou true, aby se tah kreslil až po původní koncový bod čáry. Toto nastavení ovlivňuje jen výstup SVG. Čára si zachová svou pozici a délku na snímku.

Příklad vykresluje trojúhelníkové a diamantové šipky na čárech širokých 2 a 10 bodů. Exportuje stejný snímek dvakrát, mění pouze nastavení ořezávání.

import com.aspose.slides.*;
import android.graphics.Color;
import java.io.FileOutputStream;

Presentation presentation = new Presentation();
try {
    ISlide slide = presentation.getSlides().get_Item(0);
    int y = 40;

    for (byte style : new byte[] { LineArrowheadStyle.Triangle, LineArrowheadStyle.Diamond }) {
        for (int width : new int[] { 2, 10 }) {
            IAutoShape line = slide.getShapes().addAutoShape(ShapeType.Line, 40, y, 200, 0);
            ILineFormat format = line.getLineFormat();
            format.getFillFormat().setFillType(FillType.Solid);
            format.getFillFormat().getSolidFillColor().setColor(Color.rgb(0, 0, 139));
            format.setWidth(width);
            format.setEndArrowheadStyle(style);
            y += 50;
        }
    }

    SVGOptions options = new SVGOptions();
    options.setDisableLineEndCropping(false);
    try (FileOutputStream cropped = new FileOutputStream("cropped.svg")) {
        slide.writeAsSvg(cropped, options);
    }

    options.setDisableLineEndCropping(true);
    try (FileOutputStream uncropped = new FileOutputStream("uncropped.svg")) {
        slide.writeAsSvg(uncropped, options);
    }
} finally {
    presentation.dispose();
}

Srovnání ukazuje trojúhelníkovou šipku na 10‑bodové čáře. Při povoleném ořezávání je špička ostrá. Při zakázaném ořezávání tah vyčnívá přes šikmé strany markeru a zanechává plochý konec.

V ostatních čarách z příkladu je vyčnívající tah méně viditelný na 2‑bodovém trojúhelníku. Vyplněný diamant pokrývá konec tahu v obou šířkách.

Ovládání textu a písem

Při exportu snímků do SVG můžete řídit, zda text zůstane jako text nebo bude převeden na vektorovou grafiku a jak jsou zahrnuta nebo odkazována externí písma. Následující možnosti vám pomohou vyvážit vizuální konzistenci, výběr textu a závislosti na písmu v exportovaném SVG.

Vektorizovat celý text

Nastavte SVGOptions.setVectorizeText na true, aby byl celý text snímku zapsán jako vektorová grafika. Tím se odstraní závislosti na písmu a výsledek bude vizuálně konzistentnější napříč prohlížeči, ale text již nebude možné vybrat ani vyhledávat jako SVG text.

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();
}

Vyberte, jak jsou zpracovávána externí písma

SVGOptions.setExternalFontsHandling používá hodnotu SvgExternalFontsHandling , která určuje, jak jsou zpracovávána písma načítaná externě. Vyberte SvgExternalFontsHandling.AddLinksToFontFiles pro odkazování na samostatné soubory písem, SvgExternalFontsHandling.Embed pro zahrnutí dat písem do SVG, nebo SvgExternalFontsHandling.Vectorize pro vykreslení textu používajícího externí písma jako grafiky. Před začleněním písem ověřte licencování.

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();
}

Snížit velikost vložených obrázků

Použijte SVGOptions.setPicturesCompression k snížení rozlišení vložených obrázků, SVGOptions.setDeletePicturesCroppedAreas k vynechání oříznutých částí zdrojových obrázků a SVGOptions.setJpegQuality ke kontrole kvality JPEG komprese. Tato nastavení snižují velikost souboru za cenu kvality nebo zachování dat obrázku.

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();
}

Ovládání rozlišení rasterizace metafile

SVGOptions.setMetafileRasterizationDpi nastavuje spodní mez rozlišení pro rasterizaci metafile během exportu SVG. Použijte jej k vyvážení detailu a velikosti souboru, když je EMF nebo WMF obrázek rasterizován. Nedefinuje globální DPI pro SVG ani nenutí každý objekt na snímku stát se rastrovým obrázkem.

Stáhněte metafile-rasterization.pptx, který obsahuje EMF obrázek s těsně uspořádanými úhlopříčnými čarami. Následující příklad exportuje jeho první snímek ve třech rozlišeních rasterizace pomocí ISlide.writeAsSvg. Všechna ostatní nastavení exportu zůstávají stejná, aby bylo možné výsledky porovnat.

import com.aspose.slides.PicturesCompression;
import com.aspose.slides.Presentation;
import com.aspose.slides.SVGOptions;
import java.io.FileOutputStream;

Presentation presentation = new Presentation("metafile-rasterization.pptx");
try {
    for (int dpi : new int[] { 72, 150, 300 }) {
        SVGOptions svgOptions = new SVGOptions();
        svgOptions.setMetafileRasterizationDpi(dpi);
        svgOptions.setPicturesCompression(PicturesCompression.Dpi330);
        svgOptions.setJpegQuality(90);

        String outputFileName = String.format("slide-%d.svg", dpi);
        try (FileOutputStream svgStream = new FileOutputStream(outputFileName)) {
            presentation.getSlides().get_Item(0).writeAsSvg(svgStream, svgOptions);
        }
    }
} finally {
    presentation.dispose();
}

Ve výstupu se EMF převedl na jeden vložený PNG v každém SVG. Následující měření jsou pro dodanou prezentaci; nejsou obecnou formulí pro převod DPI na rozměry pixelů.

Rozlišení rasterizace metafile DPI	Rozměry vloženého PNG	Velikost souboru SVG (bajty)
72	1196 × 596	170,221
150	2492 × 1242	423,149
300	4983 × 2483	1,027,169

Srovnání níže ukazuje stejnou oblast vloženého rastru při stejném zvětšeném zobrazení. Úhlopříčné čáry ukazují viditelné pixelování při 72 DPI a hladší hrany při vyšších rozlišeních, zatímco velikost SVG souboru roste. Zvýšení hodnoty nezlepšuje nutně každý detail nebo nemění každý exportovaný obrázek.

SVGOptions.setPicturesCompression řídí snížení rozlišení obrázků a může maskovat efekt změny rozlišení rasterizace metafile. SVGOptions.setJpegQuality řídí kvalitu JPEG kódování, nikoli rozlišení rasterizace metafile.

Přiřadit stabilní ID tvarům a textu

Použijte ISvgShapeFormattingController k nastavení ISvgShape.setId pro každý SVG tvar. Pro nastavení hodnot ISvgTSpan.setId na textových tspan elementech také implementujte ISvgShapeAndTextFormattingController. Přidělte kterýkoli z těchto kontrolérů pomocí SVGOptions.setShapeFormattingController.

Následující kontrolér používá IShape.getOfficeInteropShapeId, který je stabilní po celou životnost tvaru, a opakovatelný čítač pro jeho textové spany. To činí generovaná ID vhodná pro následné zpracování nezměněné prezentace.

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();
}

Přidat SVG událostní obslužné rutiny

V ISvgShapeFormattingController zavolejte ISvgShape.setEventHandler s hodnotou SvgEvent , abyste přidali JavaScriptový obslužný kód události k exportovanému tvaru. Přidělte kontrolér pomocí SVGOptions.setShapeFormattingController a definujte JavaScriptovou funkci na stránce nebo v SVG dokumentu, který hostí výsledek.

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();
}

Hostitelská stránka může definovat JavaScriptovou funkci odkazovanou obslužným kódem. Přiřazování ID a událostních obslužných rutin umožňuje prohlížeče snímků, vylepšení přístupnosti a další interaktivní SVG workflowy.

FAQ

Kdy mám použít SVGOptions.setVectorizeText místo SvgExternalFontsHandling.Vectorize?

Použijte SVGOptions.setVectorizeText když musí být celý text nezávislý na písmu. Použijte SvgExternalFontsHandling.Vectorize když má být převáděn na grafiku jen text, který používá externí písma.

Jaký je nejlepší způsob, jak zmenšit SVG?

Začněte kompresí vložených obrázků, odstraněním oříznutých oblastí obrázků a výběrem odkazovaných souborů písem, pokud je cílové prostředí schopné je poskytovat. Otestujte výsledek, protože nižší rozlišení obrázku, nižší kvalita JPEG a vektorizace textu mají různé vlivy na kvalitu i velikost.

Mohu po exportu upravovat exportované SVG elementy?

Ano. Přiřaďte ID pomocí formátovacího kontroléru, poté vyberte odpovídající SVG elementy ve vašem nástroji pro post‑processing nebo v skriptu prohlížeče.