Drop Shadow Effect SVG C#

تصاویر SVG تصاویر برداری وب دوستانه ای هستند که می توانند جستجو، فهرست بندی، فشرده سازی و اسکریپت شوند. در حالی که، سایه ها یک ویژگی طراحی رایج هستند که برای جذاب و برجسته ساختن تصاویر از نظر زیبایی شناختی استفاده می شود. گاهی اوقات، ممکن است لازم باشد که یک افکت drop shadow را به یک تصویر SVG اضافه کنید، مانند یک نماد، یا متن و غیره. بر این اساس، این مقاله نحوه ایجاد افکت drop shadow را بر روی یک تصویر SVG به صورت برنامه‌نویسی در C# توضیح می‌دهد.

Drop Shadow Effect بر روی تصویر SVG – C# API دانلود رایگان

Aspose.SVG for .NET از کار با تصاویر SVG پشتیبانی می کند زیرا ویژگی های زیادی برای ویرایش، به روز رسانی، یا تبدیل گرافیک های برداری مقیاس پذیر به صورت برنامه نویسی در C# ارائه می دهد. به سادگی از صفحه New Releases به فایل های DLL مرجع دسترسی داشته باشید، یا دستور NuGet را در زیر اجرا کنید تا آن را از گالری NuGet پیکربندی کنید، همراه با تمام وابستگی ها، در صورت وجود.

PM> Install-Package Aspose.SVG

نحوه ایجاد افکت Drop Shadow بر روی تصویر SVG در سی شارپ

مراحل زیر کل فرآیند افزودن افکت سایه در یک تصویر SVG را نشان می دهد:

  1. یک شی از کلاس SVGDocument ایجاد کنید.
  2. URL فضای نام SVG را تنظیم کنید و عنصر SVG ریشه را دریافت کنید.
  3. یک عنصر defs و یک filterElement برای اضافه کردن feOffset filter primitive ایجاد کنید.
  4. یک فیلتر feBlend و یک عنصر متنی ایجاد کنید.
  5. با فراخوانی متد Save، تصویر خروجی SVG را با افکت Drop Shadow ذخیره کنید.

ایجاد افکت Drop Shadow بر روی تصویر SVG به صورت برنامه ریزی شده در سی شارپ

لطفاً مراحل زیر را برای ایجاد یک افکت سایه انداختن بر روی تصویر SVG به صورت برنامه‌نویسی در سی شارپ دنبال کنید:

  1. یک شی از کلاس SVGDocument ایجاد کنید.
  2. URL فضای نام SVG را تنظیم کنید و عنصر SVG ریشه را دریافت کنید.
  3. یک عنصر defs و یک filterElement برای اضافه کردن feOffset filter primitive ایجاد کنید.
  4. یک فیلتر feBlend و یک عنصر متنی ایجاد کنید.
  5. با فراخوانی روش Save، تصویر خروجی SVG را با افکت Drop Shadow ذخیره کنید.

قطعه کد زیر نحوه ایجاد یک افکت سایه بر روی یک تصویر SVG در سی شارپ را نشان می دهد:

// یک شی از کلاس SVGDocument را راه اندازی کنید
Aspose.Svg.SVGDocument document = new Aspose.Svg.SVGDocument();

// URL فضای نام SVG را تنظیم کنید
string SvgNamespace = "http://www.w3.org/2000/svg";

// عنصر root 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 ایجاد کنید و به filterElement اضافه کنید
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 ایجاد کنید و به filterElement اضافه کنید
//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 ایجاد کنید و به filterElement اضافه کنید
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"));

لطفاً توجه داشته باشید که چند خط کد در قطعه کد بالا توضیح داده شده است. اگر یک افکت سایه تار را ترجیح می دهید که باعث می شود خروجی با سایه صاف تر برجسته شود، می توانید برای اعمال افکت تاری گاوسی روی سایه، آن را لغو نظر کنید.

مجوز موقت رایگان دریافت کنید

می‌توانید برای آزمایش API با ظرفیت کامل، [مجوز موقت رایگان] درخواست کنید.

نتیجه

در این مقاله نحوه ایجاد افکت دراپ سایه بر روی یک تصویر SVG به صورت برنامه نویسی در سی شارپ را یاد گرفتید. می توانید یک تصویر SVG موجود را با بارگیری آن پردازش کنید یا بسته به نیاز خود یک تصویر SVG جدید از ابتدا ایجاد کنید. علاوه بر این، برای یادگیری بسیاری از ویژگی‌های دیگر API، می‌توانید از بخش مستندات دیدن کنید. اگر نیاز به بحث در مورد هرگونه سؤال یا نگرانی با ما دارید، لطفاً از طریق [فروم 10 با ما تماس بگیرید.

همچنین ببینید