تأثير الظل المسقط SVG C#

SVG الصور هي صور متجهة متوافقة مع الويب يمكن البحث عنها وفهرستها وضغطها وكتابتها. في حين أن الظلال هي ميزة تصميم شائعة تُستخدم لجعل الصور جذابة من الناحية الجمالية وبارزة. في بعض الأحيان ، قد تحتاج إلى إضافة تأثير الظل المسقط إلى صورة SVG ، مثل أيقونة ، أو نص ، وما إلى ذلك. وفقًا لذلك ، تشرح هذه المقالة كيفية إنشاء تأثير الظل المسقط على صورة SVG برمجيًا في C#.

تأثير Drop Shadow على صورة SVG - تنزيل C# API مجانًا

Aspose.SVG for .NET يدعم العمل مع صور SVG لأنه يوفر الكثير من الميزات لتحرير أو تحديث أو تحويل Scalable Vector Graphics برمجيًا في C#. ما عليك سوى الوصول إلى ملفات DLL المرجعية من صفحة الإصدارات الجديدة ، أو قم بتشغيل الأمر NuGet أدناه لتكوينها من معرض NuGet ، إلى جانب جميع التبعيات ، إن وجدت.

PM> Install-Package Aspose.SVG

كيفية إنشاء تأثير Drop Shadow على صورة SVG في C#

توضح الخطوات التالية العملية الكاملة لإضافة تأثير الظل المسقط على صورة SVG:

  1. قم بإنشاء كائن من فئة SVGDocument.
  2. عيّن عنوان URL لمساحة اسم SVG واحصل على عنصر SVG الجذر.
  3. إنشاء عنصر defs و filterElement لإلحاق مرشح feOffset بدائي.
  4. قم بإنشاء مرشح feBlend وعنصر نص.
  5. احفظ صورة SVG الناتجة باستخدام تأثير Drop Shadow عن طريق استدعاء طريقة Save.

إنشاء تأثير الظل المسقط على صورة SVG برمجيًا في C#

يرجى اتباع الخطوات أدناه لإنشاء تأثير الظل المسقط على صورة SVG برمجيًا في C#:

  1. قم بإنشاء كائن من فئة SVGDocument.
  2. عيّن عنوان URL لمساحة اسم SVG واحصل على عنصر SVG الجذر.
  3. إنشاء عنصر defs و filterElement لإلحاق مرشح feOffset بدائي.
  4. قم بإنشاء مرشح feBlend وعنصر نص.
  5. احفظ صورة SVG الناتجة بتأثير Drop Shadow عن طريق استدعاء طريقة Save.

يوضح مقتطف الشفرة أدناه كيفية إنشاء تأثير الظل المسقط على صورة SVG في C#:

// تهيئة كائن لفئة SVGDocument
Aspose.Svg.SVGDocument document = new Aspose.Svg.SVGDocument();

// قم بتعيين عنوان URL لمساحة اسم SVG
string SvgNamespace = "http://www.w3.org/2000/svg";

// الحصول على عنصر svg الجذر للمستند
Aspose.Svg.SVGSVGElement svgElement = document.RootElement;

// قم بإنشاء عنصر defs وأضفه إلى svgElement
Aspose.Svg.SVGDefsElement defsElement = (Aspose.Svg.SVGDefsElement)document.CreateElementNS(SvgNamespace, "defs");
svgElement.AppendChild(defsElement);

// إنشاء عنصر تصفية وإضافة defsElement
var filterElement = (Aspose.Svg.SVGFilterElement)document.CreateElementNS(SvgNamespace, "filter");
filterElement.Id = "shadow";
filterElement.SetAttribute("x", "-20px");
filterElement.SetAttribute("y", "-20px");
filterElement.SetAttribute("height", "150px");
filterElement.SetAttribute("width", "150px");
defsElement.AppendChild(filterElement);

// إنشاء مرشح feOffset بدائي وإضافة عنصر التصفية
var feOffsetElement = (Aspose.Svg.Filters.SVGFEOffsetElement)document.CreateElementNS(SvgNamespace, "feOffset");
feOffsetElement.In1.BaseVal = "SourceAlpha";
feOffsetElement.SetAttribute("result", "offset");
feOffsetElement.SetAttribute("dx", "3");
feOffsetElement.SetAttribute("dy", "3");
filterElement.AppendChild(feOffsetElement);

//// قم بإنشاء مرشح feGaussianBlur بدائي وأضفه إلى عنصر التصفية
//var feGaussianBlurElement = (Aspose.Svg.Filters.SVGFEGaussianBlurElement) document.CreateElementNS (SvgNamespace، "feGaussianBlur") ؛
//feGaussianBlurElement.In1.BaseVal = "offset" ؛
//feGaussianBlurElement.StdDeviationX.BaseVal = 3 ،
//feGaussianBlurElement.StdDeviationY.BaseVal = 3 ،
//feGaussianBlurElement.SetAttribute ("نتيجة"، "طمس")؛
//filterElement.AppendChild (feGaussianBlurElement) ،

// قم بإنشاء مرشح feBlend بدائي وأضفه إلى عنصر التصفية
var feBlendElement = (Aspose.Svg.Filters.SVGFEBlendElement)document.CreateElementNS(SvgNamespace, "feBlend");
feBlendElement.In1.BaseVal = "SourceGraphic";
feBlendElement.In2.BaseVal = "blur";
feBlendElement.SetAttribute("mode", "normal");
filterElement.AppendChild(feBlendElement);

// قم بإنشاء عنصر نص وإضافته إلى svgElement
var textElement = (Aspose.Svg.SVGTextElement)document.CreateElementNS(SvgNamespace, "text");
textElement.Style.FontSize = "5em";
textElement.SetAttribute("x", "20px");
textElement.SetAttribute("fill", "#C0C0C0");
textElement.SetAttribute("y", "100px");
textElement.TextContent = "Aspose.SVG API";
textElement.SetAttribute("filter", "url(#shadow)");
svgElement.InsertBefore(textElement, svgElement.FirstChild);

// احفظ مستند SVG
document.Save(Path.Combine(dataDir, "DropShadow.svg"));

يرجى ملاحظة أنه تم التعليق على بضعة أسطر من التعليمات البرمجية في مقتطف الشفرة أعلاه. يمكنك اختيار إلغاء التعليق لتطبيق تأثير Gaussian blur على الظل إذا كنت تفضل تأثير الظل المسقط الضبابي الذي يجعل الناتج يبرز بظل أكثر سلاسة.

احصل على رخصة مؤقتة مجانية

يمكنك طلب ترخيص مؤقت مجاني لاختبار واجهة برمجة التطبيقات بكامل طاقتها.

استنتاج

في هذه المقالة ، تعلمت كيفية إنشاء تأثير الظل المسقط على صورة SVG برمجيًا في C#. يمكنك معالجة صورة SVG موجودة عن طريق تحميلها أو إنشاء صورة SVG جديدة من البداية وفقًا لمتطلباتك. علاوة على ذلك ، يمكنك زيارة قسم التوثيق للتعرف على العديد من الميزات الأخرى لواجهة برمجة التطبيقات. إذا كنت تريد مناقشة أي استفسارات أو مخاوف معنا ، فيرجى عدم التردد في التواصل معنا عبر المنتدى.

أنظر أيضا