تصدير شرائح العرض التقديمي كصور SVG على Android
نظرة عامة
SVG هو تنسيق صورة قابل للتوسع قائم على XML يعمل بشكل جيد للنشر على الويب، وعارضات الشرائح، وتدفقات عمل إمكانية الوصول، والمعالجة التلقائية بعد الإنشاء. Aspose.Slides for Android عبر Java يصدر كل شريحة إلى ملف SVG منفصل ويسمح لك بالتحكم في كيفية كتابة النصوص، الخطوط، الصور، وعناصر SVG.
استخدم SVGOptions عندما يجب أن يكون SVG المصدر مضغوطًا، ومتوقعًا عبر المتصفحات، أو جاهزًا للاستخدام التفاعلي.
تصدير شريحة كـ SVG
أنشئ Presentation، اختر شريحة، واكتبها إلى تدفق باستخدام ISlide.writeAsSvg. المثال التالي يصدر كل شريحة في العرض التقديمي كملف 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();
}
يستخدم اسم الملف ISlide.getSlideNumber بدلاً من فهرس الحلقة. يمكنك أيضًا تصدير شكل فردي باستخدام IShape.writeAsSvg عندما يحتاج عارض الشرائح أو صفحة الويب إلى ذلك الشكل فقط.
تكوين مخرجات SVG
SVGOptions يتحكم في تصيير SVG. بالنسبة لإطارات النص، يضمن SVGOptions.setUseFrameSize إدراج إطار النص في منطقة التصيير، وتحدد SVGOptions.setUseFrameRotation ما إذا كان سيتم تطبيق دوران الإطار. اضبط SVGOptions.setDisableFontLigatures إلى true عندما يجب أن يتم تصيير النص دون الروابط بين الأحرف.
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();
}
التحكم في النص والخطوط
تحويل جميع النصوص إلى رسومات متجهة
اضبط SVGOptions.setVectorizeText إلى true لكتابة جميع نصوص الشرائح كرسومات متجهة. يزيل هذا الاعتماد على الخطوط ويجعل النتيجة البصرية أكثر اتساقًا عبر المتصفحات، لكن النص لم يعد قابلًا للتحديد أو البحث كالنص في 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();
}
اختر طريقة معالجة الخطوط الخارجية
SVGOptions.setExternalFontsHandling يستخدم قيمة SvgExternalFontsHandling للخطوط التي تُحمَّل خارجيًا. اختر SvgExternalFontsHandling.AddLinksToFontFiles للإشارة إلى ملفات خطوط منفصلة، أو SvgExternalFontsHandling.Embed لتضمين بيانات الخط داخل SVG، أو SvgExternalFontsHandling.Vectorize لتصيير النص الذي يستخدم خطوطًا خارجية كرسوميات فقط. تحقق من ترخيص الخط قبل تضمينه.
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();
}
تقليل حجم الصور المضمنة
استخدم SVGOptions.setPicturesCompression لتقليل دقة الصور المضمنة، وSVGOptions.setDeletePicturesCroppedAreas لإهمال المناطق المقطعة من المصدر، وSVGOptions.setJpegQuality للتحكم في جودة ترميز JPEG. هذه الإعدادات تقلل من حجم الملف على حساب دقة الصورة أو البيانات المحتفظ بها.
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();
}
تعيين معرفات ثابتة للأشكال والنص
استخدم ISvgShapeFormattingController لتعيين ISvgShape.setId لكل شكل SVG. لتعيين قيم ISvgTSpan.setId على عناصر النص tspan أيضًا، نفذ ISvgShapeAndTextFormattingController. قم بتعيين أي من المتحكمين باستخدام SVGOptions.setShapeFormattingController.
المتحكم التالي يستخدم IShape.getOfficeInteropShapeId، وهو ثابت طوال فترة حياة الشكل، وعدّادًا قابلًا للتكرار لنصوصه. هذا يجعل المعرفات المُولدة مناسبة للمعالجة اللاحقة لعرض تقديمي غير معدل.
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();
}
إضافة معالجات أحداث SVG
في ISvgShapeFormattingController، استدعِ ISvgShape.setEventHandler مع قيمة SvgEvent لإضافة معالج حدث JavaScript إلى الشكل المصدر. قم بتعيين المتحكم باستخدام SVGOptions.setShapeFormattingController وحدد وظيفة JavaScript في الصفحة أو مستند SVG الذي يستضيف النتيجة.
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();
}
يمكن للصفحة المضيفة أن تعرف وظيفة JavaScript المشار إليها من قبل المعالج. تعيين المعرفات ومعالجات الأحداث يمكّن عارضات الشرائح، وتعزيزات إمكانية الوصول، وغيرها من تدفقات عمل SVG التفاعلية.
الأسئلة الشائعة
متى يجب أن أستخدم SVGOptions.setVectorizeText بدلاً من SvgExternalFontsHandling.Vectorize?
استخدم SVGOptions.setVectorizeText عندما يجب أن تكون جميع النصوص مستقلة عن الخطوط. استخدم SvgExternalFontsHandling.Vectorize عندما ينبغي تحويل النص الذي يستخدم خطوطًا خارجية فقط إلى رسومات.
ما هي أفضل طريقة لجعل ملف SVG أصغر؟
ابدأ بضغط الصور المضمنة، حذف المناطق المقطعة من الصورة، واختيار ملفات الخطوط المرتبطة عندما يستطيع بيئة الهدف تقديمها. اختبر النتيجة لأن تقليل دقة الصورة، خفض جودة JPEG، وتحويل النص إلى رسومات متجهة لكل منها موازنة مختلفة بين الجودة والحجم.
هل يمكنني تعديل عناصر SVG المُصدَّرة بعد التصدير؟
نعم. عيّن المعرفات عبر متحكم التنسيق، ثم حدد عناصر SVG المطابقة في أداة المعالجة اللاحقة أو برنامج النص البرمجي للمتصفح.