Správa přechodů snímků v prezentacích pomocí JavaScriptu

O čem je tato stránka

Použijte přechody snímků, nakonfigurujte automatické posunování snímků a přizpůsobte Morph a další efekty přechodů pomocí Aspose.Slides pro Node.js přes Java.

Přehled

Přechody snímků řídí, jak se snímky zobrazují během prezentace. S Aspose.Slides pro Node.js přes Java můžete pro každý snímek vybrat efekt přechodu, nastavit postupování kliknutím myši nebo časovačem a upravit možnosti specifické pro daný efekt. Tento článek používá příklady v JavaScriptu k aplikaci přechodů, nastavení přesné délky přechodu, správě načasování snímků a vytvoření přechodu Morph mezi dvěma snímky. Příklady také ukazují, jak uložit nastavení do souboru PPTX.

Přidání přechodu snímku

Pro aplikaci přechodu načtěte prezentaci pomocí třídy Presentation a přistupte k nastavení přechodu snímku přes getSlideShowTransition. Použijte setType s hodnotou z výčtu TransitionType a poté prezentaci uložte.

Následující příklad použije přechod Circle na první snímek a přechod Comb na druhý. Použijte soubor input.pptx s alespoň dvěma snímky.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    if (presentation.getSlides().size() >= 2) {
        presentation.getSlides().get_Item(0).getSlideShowTransition().setType(slides.TransitionType.Circle);
        presentation.getSlides().get_Item(1).getSlideShowTransition().setType(slides.TransitionType.Comb);

        presentation.save("slide-transitions.pptx", slides.SaveFormat.Pptx);
    } else {
        console.log("The input presentation must contain at least two slides.");
    }
} finally {
    presentation.dispose();
}

Přidání pokročilého přechodu snímku

Můžete nastavit, jak dlouho snímek zůstává na obrazovce a zda kliknutí myší posune prezentaci dál. Následující metody řídí toto chování:

setAdvanceOnClick umožňuje divákovi pokročit kliknutím myši.
setAdvanceAfter povoluje automatické posunování.
setAdvanceAfterTime určuje zpoždění před automatickým posunem v milisekundách.

Povolte jak kliknutí, tak časované posunování, aby si divák mohl pokračovat kliknutím nebo čekat na časovač. Pro použití pouze časovače předávejte false metodě [setAdvanceOnClick]. Zpoždění určuje, kdy se prezentace posune dál; nenastavuje délku vizuálního efektu přechodu.

Tento příklad přiřadí různé efekty k prvním třem snímkům a povolí automatické posunování po 3, 5 a 7 sekundách, resp. Kliknutí myší může také posunout tyto snímky. Použijte soubor input.pptx s alespoň třemi snímky.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    if (presentation.getSlides().size() >= 3) {
        const firstTransition = presentation.getSlides().get_Item(0).getSlideShowTransition();
        firstTransition.setType(slides.TransitionType.Circle);
        firstTransition.setAdvanceOnClick(true);
        firstTransition.setAdvanceAfter(true);
        firstTransition.setAdvanceAfterTime(3000);

        const secondTransition = presentation.getSlides().get_Item(1).getSlideShowTransition();
        secondTransition.setType(slides.TransitionType.Comb);
        secondTransition.setAdvanceOnClick(true);
        secondTransition.setAdvanceAfter(true);
        secondTransition.setAdvanceAfterTime(5000);

        const thirdTransition = presentation.getSlides().get_Item(2).getSlideShowTransition();
        thirdTransition.setType(slides.TransitionType.Zoom);
        thirdTransition.setAdvanceOnClick(true);
        thirdTransition.setAdvanceAfter(true);
        thirdTransition.setAdvanceAfterTime(7000);

        presentation.save("advanced-transitions.pptx", slides.SaveFormat.Pptx);
    } else {
        console.log("The input presentation must contain at least three slides.");
    }
} finally {
    presentation.dispose();
}

Pro kontrolu, zda je časované posunování povoleno, zavolejte getAdvanceAfter. Samotné uložené zpoždění neznamená, že je časovač aktivní.

Další příklad otevře výše uložený soubor, vypíše každý aktivní časovač a zakáže automatické posunování pro snímky se zpožděním větším než dvě sekundy. Pro tyto snímky povolí kliknutí myší a uloží aktualizovaná nastavení.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("advanced-transitions.pptx");
try {
    for (let i = 0; i < presentation.getSlides().size(); i++) {
        const slide = presentation.getSlides().get_Item(i);
        const transition = slide.getSlideShowTransition();

        if (transition.getAdvanceAfter()) {
            console.log("Slide " + slide.getSlideNumber() + ": advance after " + transition.getAdvanceAfterTime() + " ms.");

            if (transition.getAdvanceAfterTime() > 2000) {
                transition.setAdvanceAfter(false);
                transition.setAdvanceOnClick(true);
            }
        }
    }

    presentation.save("adjusted-transitions.pptx", slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

Přesné řízení načasování přechodu

Použijte setDuration k určení přesné délky efektu přechodu v milisekundách. Metoda snímku getSlideShowTransition zveřejňuje tato nastavení prostřednictvím SlideShowTransition:

Method	Purpose
setDuration	Nastavuje dobu trvání samotného efektu přechodu v milisekundách.
setAdvanceAfterTime	Nastavuje zpoždění před automatickým posunem snímku v milisekundách. Pro aktivaci časovače předávejte `true` metodě setAdvanceAfter.
setSpeed	Vybere předdefinovanou kategorii rychlosti z TransitionSpeed: Slow, Medium nebo Fast. Používá se, když není zadána přesná doba trvání.

setDuration řídí pouze efekt přechodu; neurčuje, jak dlouho snímek zůstává viditelný. Zpoždění automatického posunu nastavte samostatně. Pokud není nastavena explicitní doba, Aspose.Slides určuje délku efektu podle typu přechodu a hodnoty getSpeed.

Použít stejnou dobu trvání na všechny snímky

Pro konzistentní tempo použijte stejný efekt a přesnou dobu trvání na každý snímek. Tento příklad načte input.pptx, vybere Fade z TransitionType a každému přechodu nastaví dobu 750 milisekund. Samostatně povolí automatické posunování po 5 000 milisekundách a zakáže posunování kliknutím myši, poté výsledek uloží jako PPTX.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    for (let i = 0; i < presentation.getSlides().size(); i++) {
        const slide = presentation.getSlides().get_Item(i);
        const transition = slide.getSlideShowTransition();
        transition.setType(slides.TransitionType.Fade);
        transition.setDuration(750);

        // Nastavte automatické posunování nezávisle na délce efektu.
        transition.setAdvanceAfter(true);
        transition.setAdvanceAfterTime(5000);
        transition.setAdvanceOnClick(false);
    }

    presentation.save("precise-transitions.pptx", slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

Nastavit různé doby trvání pro jednotlivé snímky

Různé snímky mohou používat různé doby trvání efektu. Například můžete použít krátký přechod pro úvodní snímek a delší pro úvod sekce. Tento příklad nastaví 500 milisekund pro první snímek a 1 200 milisekund pro druhý. Použijte soubor input.pptx s alespoň dvěma snímky.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    if (presentation.getSlides().size() >= 2) {
        const firstTransition = presentation.getSlides().get_Item(0).getSlideShowTransition();
        firstTransition.setType(slides.TransitionType.Fade);
        firstTransition.setDuration(500);

        const secondTransition = presentation.getSlides().get_Item(1).getSlideShowTransition();
        secondTransition.setType(slides.TransitionType.Push);
        secondTransition.setDuration(1200);

        presentation.save("individual-transition-durations.pptx", slides.SaveFormat.Pptx);
    } else {
        console.log("The input presentation must contain at least two slides.");
    }
} finally {
    presentation.dispose();
}

Koordinovat přechody s animovaným výstupem

Při přípravě animated GIF, HTML5 presentation nebo video nastavte před exportem přesné doby trvání přechodů, aby odpovídaly zamýšlenému tempu. Například použijte 600 ms přechod Fade mezi scénami a samostatně upravte zpoždění posunu každého snímku, aby bylo dost času na jeho výklad nebo obsah.

U GIFů a videí koordinujte rychlost výstupních snímků s délkou efektu: 600 ms odpovídá 18 snímkům při 30 fps. V HTML5 povolte animované přechody v nastavení exportu. Zkontrolujte, jaké efekty a časové volby podporuje zvolený formát, a předem si výsledek prohlédněte, abyste potvrdili synchronizaci.

Přečíst existující dobu trvání přechodu

Zavolejte getDuration před úpravou přechodu, abyste zjistili, zda je uložena explicitní hodnota. Hodnota -1 znamená, že není nastavena explicitní doba; ne‑negativní hodnota určuje uloženou dobu v milisekundách. Nenastavená hodnota není vypočítaná doba přehrávání: Aspose.Slides používá typ přechodu a hodnotu getSpeed k určení této délky. Nastavení typu přechodu může inicializovat dobu, takže nejprve prozkoumejte původní nastavení.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    for (let i = 0; i < presentation.getSlides().size(); i++) {
        const slide = presentation.getSlides().get_Item(i);
        const transition = slide.getSlideShowTransition();
        const duration = transition.getDuration();

        if (duration >= 0) {
            console.log("Slide " + slide.getSlideNumber() + ": stored transition duration is " + duration + " ms.");
        } else {
            console.log("Slide " + slide.getSlideNumber() + ": no explicit duration; timing depends on transition type " + transition.getType() + " and speed " + transition.getSpeed() + ".");
        }
    }
} finally {
    presentation.dispose();
}

Přechod Morph

Přechod Morph animuje změny mezi objekty na po sobě jdoucích snímcích. Pro vytvoření jednoduchého efektu Morph klonujte snímek, přesuňte nebo změňte velikost objektu na klonu a aplikujte přechod Morph na druhý snímek. Tím se přechodu přiřadí odpovídající objekty, které se animují mezi původním a upraveným stavem.

Následující příklad vytvoří snímek s textovým obdélníkem, klonuje snímek a změní pozici a velikost obdélníku na klonu. Poté vybere Morph z výčtu TransitionType pro druhý snímek. Otevřete uložený soubor v prohlížeči prezentací, který podporuje Morph, a podívejte se na efekt během prezentace.

const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation();
try {
    const firstSlide = presentation.getSlides().get_Item(0);
    const rectangle = firstSlide.getShapes().addAutoShape(slides.ShapeType.Rectangle, 100, 100, 400, 100);
    rectangle.getTextFrame().setText("Morph transition");

    const secondSlide = presentation.getSlides().addClone(firstSlide);
    const movedRectangle = secondSlide.getShapes().get_Item(0);
    movedRectangle.setX(movedRectangle.getX() + 100);
    movedRectangle.setY(movedRectangle.getY() + 50);
    movedRectangle.setWidth(movedRectangle.getWidth() - 200);
    movedRectangle.setHeight(movedRectangle.getHeight() - 10);

    secondSlide.getSlideShowTransition().setType(slides.TransitionType.Morph);

    presentation.save("morph-transition.pptx", slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

Typy přechodu Morph

Výčet TransitionMorphType určuje, jak Morph přiřazuje a animuje obsah:

ByObject považuje každý tvar za celý objekt.
ByWord animuje text tím, že kde je to možné porovnává slova.
ByChar animuje text tím, že kde je to možné porovnává znaky.

Použijte setType k výběru Morph před přístupem k getValue. Hodnota pak poskytne objekt MorphTransition, jehož metoda setMorphType vybírá režim přiřazení.

Tento příklad otevře prezentaci vytvořenou v předchozí sekci a nastaví druhý snímek tak, aby používal animaci Morph založenou na slovech.

const java = require("java");
const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("morph-transition.pptx");
try {
    if (presentation.getSlides().size() >= 2) {
        const transition = presentation.getSlides().get_Item(1).getSlideShowTransition();
        transition.setType(slides.TransitionType.Morph);
        const transitionValue = transition.getValue();

        if (java.instanceOf(transitionValue, "com.aspose.slides.IMorphTransition")) {
            transitionValue.setMorphType(slides.TransitionMorphType.ByWord);
            presentation.save("morph-by-word.pptx", slides.SaveFormat.Pptx);
        } else {
            console.log("Morph transition options are unavailable.");
        }
    } else {
        console.log("The input presentation must contain at least two slides.");
    }
} finally {
    presentation.dispose();
}

Nastavit efekty přechodu

Některé přechody nabízejí další možnosti, například směr nebo zda efekt začíná z černé obrazovky. Dostupné volby závisí na přechodu vybraném pomocí setType. Nejprve nastavte typ, pak použijte odpovídající objekt přechodu z getValue.

Následující příklad použije přechod Cut na první snímek input.pptx. Zavolá setFromBlack přes OptionalBlackTransition, aby přechod začínal z černé obrazovky.

const java = require("java");
const slides = require("aspose.slides.via.java");

const presentation = new slides.Presentation("input.pptx");
try {
    const transition = presentation.getSlides().get_Item(0).getSlideShowTransition();
    transition.setType(slides.TransitionType.Cut);
    const transitionValue = transition.getValue();

    if (java.instanceOf(transitionValue, "com.aspose.slides.IOptionalBlackTransition")) {
        transitionValue.setFromBlack(true);
        presentation.save("cut-from-black.pptx", slides.SaveFormat.Pptx);
    } else {
        console.log("Cut transition options are unavailable.");
    }
} finally {
    presentation.dispose();
}

Často kladené otázky

Mohu řídit rychlost přehrávání přechodu snímku?

Ano. Upřednostněte setDuration, když potřebujete přesnou dobu trvání efektu v milisekundách. Použijte setSpeed, když stačí předdefinovaná kategorie TransitionSpeed – Slow, Medium nebo Fast – a není nastavena explicitní doba. Tato nastavení řídí efekt přechodu nezávisle na zpoždění automatického posunu.

Mohu k přechodu připojit zvuk a nechat jej smyčkovat?

Ano. Přiřaďte vložený zvuk pomocí setSound, předávejte StartSound z výčtu TransitionSoundMode metodě setSoundMode a povolte setSoundLoop s hodnotou true. Zvuk se bude opakovat až do dalšího zvukového události v prezentaci.

Jaký je nejrychlejší způsob, jak aplikovat stejný přechod na všechny snímky?

Procházejte kolekci getSlides prezentace a pro každý snímek zavolejte setType se stejnou hodnotou přechodu. V tomtéž cyklu nastavte časování a možnosti efektu, aby chování bylo konzistentní napříč všemi snímky.

Jak mohu zkontrolovat, který přechod je aktuálně nastaven na snímku?

Zavolejte getType na výsledek getSlideShowTransition snímku. Vrátí hodnotu z výčtu TransitionType; None znamená, že žádný efekt přechodu není aplikován.

Změna velikosti snímku prezentace v JavaScriptu Správa kreslicích vodítek v prezentacích v JavaScriptu