diff --git a/html/arabic/net/generate-jpg-and-png-images/_index.md b/html/arabic/net/generate-jpg-and-png-images/_index.md index 432f80cdc..dc14e2735 100644 --- a/html/arabic/net/generate-jpg-and-png-images/_index.md +++ b/html/arabic/net/generate-jpg-and-png-images/_index.md @@ -45,6 +45,8 @@ Aspose.HTML for .NET هي مكتبة قوية تتيح للمطورين إنشا تعلم كيفية تمكين مضاد التعرج عند تحويل ملفات DOCX إلى صور PNG أو JPG باستخدام Aspose.HTML. ### [تحويل docx إلى png – إنشاء أرشيف zip في C# – دليل تعليمي](./convert-docx-to-png-create-zip-archive-c-tutorial/) تعلم كيفية تحويل ملفات docx إلى صور PNG وإنشاء أرشيف ZIP باستخدام C# و Aspose.HTML. +### [إنشاء صورة من HTML – دليل خطوة بخطوة بلغة C#](./create-image-from-html-step-by-step-c-guide/) +تعلم كيفية تحويل HTML إلى صورة باستخدام Aspose.HTML في C# من خلال دليل شامل خطوة بخطوة. ## خاتمة diff --git a/html/arabic/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md b/html/arabic/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md new file mode 100644 index 000000000..90d68cd4e --- /dev/null +++ b/html/arabic/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md @@ -0,0 +1,245 @@ +--- +category: general +date: 2026-03-07 +description: إنشاء صورة من HTML في C# بسرعة — تعلم كيفية ضبط حجم الصورة، تحويل HTML + إلى PNG، وتفعيل تحسين الخط للحصول على نص صغير واضح. +draft: false +keywords: +- create image from html +- set image size +- render html to png +- set renderer dimensions +- enable font hinting +language: ar +og_description: إنشاء صورة من HTML باستخدام Aspose.Html، ضبط حجم الصورة، تحويل HTML + إلى PNG، وتفعيل تحسين الخط للحصول على نص صغير واضح. +og_title: إنشاء صورة من HTML – دليل C# الكامل +tags: +- Aspose.Html +- C# +- Image Rendering +title: إنشاء صورة من HTML – دليل C# خطوة بخطوة +url: /ar/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# إنشاء صورة من HTML – دليل C# الكامل + +هل احتجت يوماً إلى **إنشاء صورة من HTML** لكن لم تكن متأكدًا من أي استدعاء API تستخدمه؟ لست وحدك—العديد من المطورين يواجهون نفس المشكلة عندما يحتاجون إلى لقطة PNG لمقتطف نص بحجم خط صغير لاستخدامه كصورة مصغرة أو كعلامة مائية في PDF. الخبر السار هو أنه باستخدام Aspose.Html يمكنك القيام بذلك ببضع أسطر فقط، وستتعلم أيضًا كيفية **تحديد حجم الصورة**، **تحويل HTML إلى PNG**، و**تمكين تحسين الخط** للحصول على نتائج واضحة تمامًا. + +في هذا الدليل سنستعرض مثالًا واقعيًا: تحويل `
` يحتوي على نص بحجم 8 بكسل إلى صورة PNG بأبعاد 400 × 100. في النهاية ستحصل على نمط قابل لإعادة الاستخدام يعمل مع أي قطعة HTML، سواء كانت شارة، رأس بريد إلكتروني، أو تسمية مخطط ديناميكي. لا تحتاج إلى أدوات خارجية—فقط C# ومكتبة Aspose.Html. + +## ما الذي ستحتاجه + +- **.NET 6+** (أو .NET Framework 4.6.2 وما بعده) – الكود يعمل على أي بيئة تشغيل حديثة. +- **Aspose.Html for .NET** – تثبيت عبر NuGet (`Install-Package Aspose.Html`). +- بيئة تطوير C# أساسية (Visual Studio، VS Code، Rider—اختر ما يناسبك). + +هذا كل ما تحتاجه. لا خطوط إضافية، لا تفاعل COM، ولا حيل GDI+ المعقدة. لنبدأ. + +## إنشاء صورة من HTML – المفاهيم الأساسية + +قبل أن نغوص في الكود، دعنا نوضح الأجزاء الثلاثة التي تجعل هذا يعمل: + +1. **HTMLDocument** – تمثيل الذاكرة للعلامات التي تريد تحويلها إلى صورة. +2. **ImageRenderingOptions** – حيث **تحدد حجم الصورة** وتختار **أبعاد المرسِّم**؛ هذا يخبر المحرك بحجم البت ماب الناتج. +3. **TextOptions** – كائن فرعي يتيح لك **تمكين تحسين الخط**، وهي تقنية تُحاذِى الحروف إلى حدود البكسل وتُحسّن بشكل كبير وضوح النص عند الأحجام الصغيرة. + +فهم سبب أهمية كل جزء سيساعدك على تعديل الخط الأنابيب لاحقًا (مثل تغيير DPI، إضافة خلفية، أو التحويل إلى JPEG). + +## الخطوة 1: بناء مستند HTML + +أولاً نحتاج إلى مستند يحتوي على العلامات التي نريد تحويلها إلى صورة. في حالتنا هو `
` واحد بحجم خط صغير جدًا. + +```csharp +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +// Step 1 – create a minimal HTML document +HTMLDocument htmlDoc = new HTMLDocument( + "
Tiny text that needs hinting
" +); +``` + +*لماذا هذا مهم*: عبر تمرير سلسلة نصية مباشرة إلى `HTMLDocument` نتجنب التعامل مع الملفات أو طلبات الشبكة. المحرك يحلل العلامات تمامًا كما يفعل المتصفح، مما يعني أن CSS، الخطوط، وتخطيط الصفحة تُحترم جميعًا. + +## الخطوة 2: تفعيل تحسين الخط + +عند تحويل النص إلى 8 px، معظم المحولات تنتج حروفًا ضبابية لأنها تحاول تطبيق مضاد التعرج على الأشكال تحت البكسل. تحسين الخط يجبر المرسِّم على تثبيت كل حرف إلى أقرب شبكة بكسل، مما ينتج مظهرًا أنظف. + +```csharp +// Step 2 – configure text rendering options +TextOptions textOptions = new TextOptions +{ + UseHinting = true // Enable font hinting for low‑size text +}; +``` + +*نصيحة محترف*: إذا كنت تستهدف شاشات عالية الدقة لاحقًا، قد تُعطل التحسين وتزيد الـ DPI بدلاً من ذلك. بالنسبة للصور المصغرة منخفضة الدقة، عادةً ما يكون التحسين هو الخيار الصحيح. + +## الخطوة 3: تحديد حجم الصورة وأبعاد المرسِّم + +الآن نقرر حجم PNG النهائي. هنا حيث **تحدد حجم الصورة** وتحدد أيضًا **أبعاد المرسِّم** (نفس الكائن في Aspose، لكن من الناحية المفاهيمية هما وجهان لعملة واحدة). + +```csharp +// Step 3 – define rendering options, including size and hinting +ImageRenderingOptions renderingOptions = new ImageRenderingOptions +{ + Width = 400, // Desired width in pixels + Height = 100, // Desired height in pixels + TextOptions = textOptions // Attach the hinting settings +}; +``` + +*لماذا هذا مهم*: إذا حذفت `Width`/`Height`، سيقوم Aspose بحساب حجم القماش وفقًا للأبعاد الطبيعية للمحتوى، والتي قد تكون صغيرة جدًا بالنسبة لحالتك. تحديد القيم صراحةً يؤثر أيضًا على نافذة عرض محرك التخطيط، مما يضمن تمركز النص كما هو متوقع. + +## الخطوة 4: تهيئة مُرسِّل الصورة + +مع وجود المستند والخيارات جاهزة، ننشئ المرسِّل. هذا الكائن يربط كل شيء معًا ويُعد خط أنابيب التحويل إلى صورة. + +```csharp +// Step 4 – instantiate the renderer with the document and options +using var imageRenderer = new ImageRenderer(htmlDoc, renderingOptions); +``` + +*ملاحظة*: جملة `using` تضمن تحرير الموارد غير المُدارة (المخازن الأصلية، مقابض GDI) بسرعة—وذلك مهم للوظائف الدُفعية على الخادم. + +## الخطوة 5: التحويل وحفظ PNG + +أخيرًا، نطلب من المرسِّل رسم الصفحة وكتابة النتيجة إلى القرص. هذه هي الخطوة التي تقوم فعليًا **بتحويل HTML إلى PNG**. + +```csharp +// Step 5 – perform the rendering and write the PNG file +imageRenderer.Render(); // Rasterise the HTML +imageRenderer.Save("output/hinted.png"); // Save as PNG (default format) +``` + +بعد التنفيذ ستجد `hinted.png` داخل مجلد `output`. افتحه، ويجب أن ترى النص الصغير مُظهرًا بوضوح، بفضل الجمع بين **تحسين الخط** و**حجم الصورة** المحدد صراحةً. + +### النتيجة المتوقعة + +| الملف | الأبعاد | الوصف | +|------|------------|-------------| +| `hinted.png` | 400 × 100 px | نص 8 px صغير مُحسّن، واضح ومُتمركز. | + +يمكنك إدراج PNG في أي مكوّن واجهة، أو تضمينه في PDF، أو استخدامه كعنصر بريد إلكتروني—دون الحاجة إلى خطوات تحويل إضافية. + +## تنويعات متقدمة وحالات حافة + +فيما يلي بعض السيناريوهات الشائعة “ماذا لو” التي قد تواجهها، مع حلول سريعة. + +### تغيير DPI لإخراج عالي الدقة + +إذا كنت بحاجة إلى صورة جاهزة لشاشات Retina بمعدل 2×، عدّل خاصية `Resolution`: + +```csharp +renderingOptions.Resolution = 144; // 72 dpi × 2 +renderingOptions.Width = 800; // Double the pixel dimensions +renderingOptions.Height = 200; +``` + +سيتم تحويل نفس HTML بكثافة أعلى، مما يحافظ على الوضوح البصري على الشاشات ذات DPI العالي. + +### تحويل صفحة HTML كاملة (CSS/JS خارجي) + +عندما تشير العلامات إلى ملفات CSS أو سكريبتات خارجية، مرّر عنوان URL أساسي إلى مُنشئ `HTMLDocument`: + +```csharp +HTMLDocument htmlDoc = new HTMLDocument( + "", + new Uri("file:///C:/MyProject/") // Base path for relative resources +); +``` + +سيتولى Aspose حل `styles.css` بالنسبة للـ URI المقدم، مما يتيح لك **تحويل HTML إلى PNG** بالمظهر الدقيق للمتصفح. + +### خلفيات شفافة + +بشكل افتراضي يستخدم المرسِّل خلفية بيضاء. للحصول على PNG شفاف (مفيد للطبقات المتراكبة)، عيّن لون الخلفية إلى `Color.Transparent`: + +```csharp +renderingOptions.BackgroundColor = System.Drawing.Color.Transparent; +``` + +الآن سيحتوي PNG الناتج على قناة ألفا. + +### معالجة صفحات متعددة + +إذا كان HTML الخاص بك يمتد لأكثر من صفحة (مثل مقالة طويلة)، يمكنك التكرار عبر `imageRenderer.Render(pageNumber)` وحفظ كل صفحة على حدة. هذا نادرًا ما يُحتاج إليه للصور المصغرة لكنه مفيد لإنشاء تقارير متعددة الصفحات. + +## مثال كامل يعمل + +بدمج كل ما سبق، إليك برنامج مستقل يمكنك نسخه ولصقه في تطبيق Console. + +```csharp +using System; +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +class Program +{ + static void Main() + { + // 1️⃣ Create the HTML document with tiny text + HTMLDocument htmlDoc = new HTMLDocument( + "
Tiny text that needs hinting
" + ); + + // 2️⃣ Enable font hinting for sharper low‑size rendering + TextOptions textOptions = new TextOptions + { + UseHinting = true + }; + + // 3️⃣ Define image size and attach the text options + ImageRenderingOptions renderingOptions = new ImageRenderingOptions + { + Width = 400, + Height = 100, + TextOptions = textOptions, + // Optional: transparent background + // BackgroundColor = System.Drawing.Color.Transparent + }; + + // 4️⃣ Initialise the renderer + using var imageRenderer = new ImageRenderer(htmlDoc, renderingOptions); + + // 5️⃣ Render and save as PNG + imageRenderer.Render(); + imageRenderer.Save("output/hinted.png"); + + Console.WriteLine("✅ Image created: output/hinted.png"); + } +} +``` + +شغّل البرنامج (`dotnet run`)، وسترى رسالة التأكيد تليها ملف PNG واضح. + +## الأخطاء الشائعة وكيفية تجنّبها + +| العَرَض | السبب المحتمل | الحل | +|---------|--------------|-----| +| النص يبدو ضبابيًا | تحسين الخط مُعطَّل أو DPI منخفض | عيّن `UseHinting = true` أو زد `Resolution`. | +| الصورة المخرجة مقطوعة | العرض/الارتفاع أصغر من المحتوى | زد `Width`/`Height` أو فعّل `AutoFit` (غير معروض). | +| الخطوط مفقودة | الخط غير مثبت على الجهاز المستضيف | أدمج الخط باستخدام `FontSettings` أو ثبّته على النظام. | +| PNG أبيض على أبيض | لون الخلفية يطابق لون النص | غيّر `BackgroundColor` أو عدّل لون CSS. | + +## الخلاصة + +لقد **أنشأنا صورة من HTML** باستخدام Aspose.Html، وأظهرنا كيفية **تحديد حجم الصورة**، **تحويل HTML إلى PNG**، **تحديد أبعاد المرسِّل**، و**تمكين تحسين الخط** للنص الصغير. المثال الكامل القابل للتنفيذ يوضح كل خطوة مطلوبة، والنصائح المرفقة تغطي أكثر التنويعات شيوعًا التي قد تواجهها في المشاريع الواقعية. + +هل أنت مستعد للتحدي التالي؟ جرّب استبدال HTML بمخطط يُولد عبر SVG، أو جرب إعدادات DPI مختلفة لشاشات Retina، أو دمج توليد PNG في نقطة نهاية ASP.NET Core تُعيد الصور في الوقت الحقيقي. النمط نفسه يتوسع من الصور المصغرة الفردية إلى خطوط معالجة دفعات ضخمة. + +إذا وجدت هذا الدليل مفيدًا، شاركه، أضف تعليقًا بتعديلاتك، أو استكشف وثائق Aspose.Html لمزيد من التخصيصات المتعمقة. رندرة سعيدة! + +create image from html example showing tiny text rendered with font hinting + +--- + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/html-extensions-and-conversions/_index.md b/html/arabic/net/html-extensions-and-conversions/_index.md index 980eb7013..ffe59fb49 100644 --- a/html/arabic/net/html-extensions-and-conversions/_index.md +++ b/html/arabic/net/html-extensions-and-conversions/_index.md @@ -39,6 +39,8 @@ url: /ar/net/html-extensions-and-conversions/ ## دروس حول امتدادات HTML وتحويلاتها ### [تحويل HTML إلى PDF في .NET باستخدام Aspose.HTML](./convert-html-to-pdf/) قم بتحويل HTML إلى PDF بسهولة باستخدام Aspose.HTML for .NET. اتبع دليلنا خطوة بخطوة واكتشف قوة تحويل HTML إلى PDF. +### [دليل تحويل HTML إلى PDF – تحويل HTML إلى PDF في C#](./html-to-pdf-tutorial-convert-html-to-pdf-in-c/) +تعلم كيفية تحويل ملفات HTML إلى PDF باستخدام C# ومكتبة Aspose.HTML خطوة بخطوة. ### [إنشاء PDF من HTML – دليل خطوة بخطوة بلغة C#](./create-pdf-from-html-c-step-by-step-guide/) دليل خطوة بخطوة لإنشاء ملف PDF من HTML باستخدام C# ومكتبة Aspose.HTML. ### [إنشاء مستند HTML بنص منسق وتصديره إلى PDF – دليل كامل](./create-html-document-with-styled-text-and-export-to-pdf-full/) diff --git a/html/arabic/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md b/html/arabic/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md new file mode 100644 index 000000000..d7d8637b3 --- /dev/null +++ b/html/arabic/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md @@ -0,0 +1,268 @@ +--- +category: general +date: 2026-03-07 +description: 'دروس تحويل HTML إلى PDF: تعلم كيفية إنشاء PDF من HTML باستخدام Aspose.Html + في C#. طريقة سريعة وموثوقة لتحويل صفحات الويب إلى PDF في دقائق.' +draft: false +keywords: +- html to pdf tutorial +- generate pdf from html +- create pdf from html +- convert web page pdf +- c# pdf generation +language: ar +og_description: 'دليل html إلى pdf: إنشاء ملف PDF بسرعة من HTML باستخدام Aspose.Html + في C#. اتبع هذا الدليل خطوة بخطوة لتحويل أي صفحة ويب إلى PDF.' +og_title: دليل تحويل HTML إلى PDF – تحويل HTML إلى PDF في C# +tags: +- Aspose.Html +- C# +- PDF conversion +title: دليل تحويل HTML إلى PDF – تحويل HTML إلى PDF في C# +url: /ar/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# دليل html إلى pdf – تحويل HTML إلى PDF في C# + +هل احتجت يومًا إلى **دليل html إلى pdf** لا يتركك في حيرة؟ لست وحدك—العديد من المطورين يسألون، *“كيف يمكنني إنشاء pdf من html دون أن أفقد صوابي؟”* خبر سار: باستخدام Aspose.Html يمكنك **إنشاء pdf من html** ببضع أسطر من الشيفرة فقط. في هذا الدليل سنستعرض كل ما تحتاجه، من تثبيت المكتبة إلى معالجة الحالات الخاصة، حتى تتمكن من **تحويل صفحات الويب إلى pdf** مباشرةً من مشروع C# الخاص بك. + +سنتناول: + +* الحزمة NuGet الدقيقة التي تحتاجها. +* كيفية إعداد مسارات الملفات بأمان. +* السطر الواحد الذي يقوم بالعمل الشاق. +* نصائح للمستندات الكبيرة، الموارد النسبية، والتحويل غير المتزامن. + +بنهاية الدليل ستحصل على مثال قابل للتنفيذ يمكنك وضعه في أي حل .NET والبدء في إنشاء ملفات PDF على الفور—بدون غموض، بدون أدوات إضافية. + +## المتطلبات المسبقة + +قبل أن نبدأ، تأكد من أن لديك: + +| المتطلب | لماذا يهم | +|-------------|----------------| +| .NET 6.0 أو أحدث (واجهة برمجة التطبيقات تعمل على .NET Framework 4.6+ أيضًا) | يضمن التوافق مع أحدث أنابيب معالجة Aspose.Html (24.10+). | +| Visual Studio 2022 (أو أي بيئة تطوير متوافقة مع C#) | يسهل عملية تصحيح الأخطاء في عملية التحويل. | +| الاتصال بالإنترنت لاستعادة حزمة NuGet الأولى | حزمة Aspose.Html يتم سحبها من nuget.org. | + +لا توجد مكتبات طرف ثالث أخرى مطلوبة. + +## الخطوة 1 – تثبيت حزمة Aspose.Html NuGet + +افتح **Package Manager Console** (Tools → NuGet Package Manager → Package Manager Console) وشغّل: + +```powershell +Install-Package Aspose.Html -Version 24.10.0 +``` + +**نصيحة احترافية:** إذا كنت تستهدف بيئة تشغيل محددة (مثل .NET Core)، أضف العلم `-IncludePrerelease` للحصول على أحدث محرك عرض. سلسلة 24.10+ تقدم أنبوب معالجة جديد يتعامل مع CSS و JavaScript الحديثة بشكل أفضل بكثير من الإصدارات السابقة. + +## الخطوة 2 – إضافة مساحة الاسم للتحويل + +في أي ملف C# ستجري فيه التحويل، استورد مساحة الاسم إلى النطاق: + +```csharp +using Aspose.Html.Converters; // <-- This gives you HtmlConverter +``` + +**لماذا هذا مهم:** `HtmlConverter` هي الفئة الثابتة التي تج abstracts عملية العرض بالكامل. باستيرادها تتجنب كتابة الأسماء المؤهلة بالكامل وتحافظ على نظافة الشيفرة. + +## الخطوة 3 – تعريف مسارات HTML المصدر و PDF الهدف + +يمكنك كتابة المسارات صراحةً لتجربة سريعة، لكن في بيئة الإنتاج من المحتمل أن تستقبلها من مدخلات المستخدم أو الإعدادات. إليك طريقة آمنة لبناء مسارات مطلقة: + +```csharp +// Step 3: Build absolute file paths +string baseDir = AppDomain.CurrentDomain.BaseDirectory; +string htmlPath = Path.Combine(baseDir, "input.html"); // <-- your source HTML +string pdfPath = Path.Combine(baseDir, "output.pdf"); // <-- where the PDF lands + +// Verify that the source file exists before we try to convert +if (!File.Exists(htmlPath)) +{ + Console.WriteLine($"⚠️ HTML file not found at {htmlPath}"); + return; +} +``` + +**حالة خاصة:** إذا كان HTML الخاص بك يشير إلى صور أو CSS أو خطوط باستخدام عناوين URL نسبية، فإن وضع `input.html` وموارده في نفس المجلد يضمن أن المحول يستطيع حلها تلقائيًا. + +## الخطوة 4 – تحويل مستند HTML إلى PDF + +الآن يحدث السحر. طريقة `ConvertHtmlToPdf` تقرأ HTML، تعرضه باستخدام أحدث محرك، وتكتب ملف PDF—كل ذلك في نداء واحد. + +```csharp +try +{ + // Step 4: Perform the conversion (24.10+ rendering pipeline) + HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath); + Console.WriteLine($"✅ PDF successfully created at {pdfPath}"); +} +catch (Exception ex) +{ + // Catch‑all for demo purposes – in real code handle specific exceptions + Console.WriteLine($"❌ Conversion failed: {ex.Message}"); +} +``` + +### ما الذي يحدث خلف الكواليس؟ + +* **Parsing:** تقوم Aspose.Html بتحليل شجرة DOM للـ HTML، وتطبق نفس القواعد التي يتبعها المتصفح الحديث. +* **Layout:** أنبوب العرض الجديد (متاح منذ الإصدار 24.10) يحسب التخطيط باستخدام نموذج الصندوق CSS، يدعم Flexbox، Grid، وحتى JavaScript محدود. +* **PDF Generation:** يتم تحويل شجرة العرض إلى تعليمات متجهية، ثم تُكتب إلى ملف PDF يحافظ على النص القابل للتحديد والبحث. + +نظرًا لأن الـ API متزامن، فإنه يحجب التنفيذ حتى يكتمل كتابة ملف PDF. إذا كنت تحتاج إلى سلوك غير محجوز، توفر Aspose أيضًا نسخة غير متزامنة (`ConvertHtmlToPdfAsync`)—انظر قسم *المتقدم* أدناه. + +## الخطوة 5 – التحقق من النتيجة + +فحص سريع للمنطق يمكن أن يوفر ساعات من تصحيح الأخطاء لاحقًا. افتح الملف المُولد برمجيًا أو يدويًا: + +```csharp +if (File.Exists(pdfPath)) +{ + // Launch the PDF with the default viewer (Windows only) + Process.Start(new ProcessStartInfo(pdfPath) { UseShellExecute = true }); +} +else +{ + Console.WriteLine("⚠️ PDF file was not created."); +} +``` + +إذا تم فتح الـ PDF ويظهر كما هو الـ HTML الأصلي (الخطوط، الصور، والتخطيط سليم)، تهانينا—لقد نجحت في **إنشاء pdf من html** باستخدام C#. + +## مواضيع متقدمة وتنوعات شائعة + +### 1️⃣ التحويل من سلسلة نصية أو عنوان URL + +أحيانًا لا يكون لديك ملف `.html` فعلي. تسمح لك Aspose بتمرير HTML خام أو عنوان URL بعيد: + +```csharp +string htmlContent = "

Hello, PDF!

"; +using (var stream = new MemoryStream(Encoding.UTF8.GetBytes(htmlContent))) +{ + HtmlConverter.ConvertHtmlToPdf(stream, pdfPath); +} +``` + +أو مباشرةً من عنوان ويب: + +```csharp +string url = "https://example.com/report"; +HtmlConverter.ConvertUrlToPdf(url, pdfPath); +``` + +### 2️⃣ التحويل غير المتزامن لخدمات عالية الإنتاجية + +إذا كنت تبني واجهة ويب API يجب أن تتعامل مع العديد من الطلبات في وقت واحد، استخدم الـ API غير المتزامن: + +```csharp +await HtmlConverter.ConvertHtmlToPdfAsync(htmlPath, pdfPath); +``` + +تذكر ضبط وحدة التحكم ASP.NET لتُعيد `Task`. + +### 3️⃣ معالجة المستندات الكبيرة + +لملفات HTML أكبر من 100 ميغابايت، قم بزيادة حد الذاكرة الافتراضي: + +```csharp +var options = new HtmlConversionOptions +{ + RenderingEngine = RenderingEngine.WebKit, // optional, but can improve performance + MaxMemoryUsage = 1024 * 1024 * 1024 // 1 GB +}; + +HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath, options); +``` + +### 4️⃣ إضافة بيانات تعريفية للـ PDF + +يمكنك إثراء الـ PDF الناتج بعنوان، مؤلف، وكلمات مفتاحية: + +```csharp +var pdfSaveOptions = new PdfSaveOptions +{ + DocumentInfo = new DocumentInfo + { + Title = "Monthly Report", + Author = "Your Name", + Keywords = "html to pdf tutorial, generate pdf from html" + } +}; + +HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath, pdfSaveOptions); +``` + +### 5️⃣ مشاكل شائعة + +| العَرَض | السبب المحتمل | الحل | +|---------|--------------|-----| +| الصور مفقودة | المسارات النسبية تشير إلى خارج مجلد HTML | احتفظ بجميع الأصول في نفس الدليل مع `input.html` أو اضبط `BaseUri` في `HtmlLoadOptions`. | +| الخطوط تظهر مختلفة | الخط غير مضمن | استخدم `PdfSaveOptions.EmbedStandardFonts = true`. | +| PDF فارغ | HTML يحتوي على سكريبت يمنع العرض | عطّل JavaScript عبر `HtmlLoadOptions.DisableJavaScript = true`. | + +## مثال كامل وجاهز للتنفيذ + +```csharp +using System; +using System.Diagnostics; +using System.IO; +using System.Text; +using Aspose.Html.Converters; +using Aspose.Html.Saving; + +class Program +{ + static void Main() + { + // 1️⃣ Define paths + string baseDir = AppDomain.CurrentDomain.BaseDirectory; + string htmlPath = Path.Combine(baseDir, "input.html"); + string pdfPath = Path.Combine(baseDir, "output.pdf"); + + // 2️⃣ Validate source file + if (!File.Exists(htmlPath)) + { + Console.WriteLine($"⚠️ Cannot find {htmlPath}"); + return; + } + + // 3️⃣ Convert HTML → PDF + try + { + HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath); + Console.WriteLine($"✅ PDF created at {pdfPath}"); + } + catch (Exception ex) + { + Console.WriteLine($"❌ Conversion error: {ex.Message}"); + } + + // 4️⃣ Open the result (Windows only) + if (File.Exists(pdfPath)) + { + Process.Start(new ProcessStartInfo(pdfPath) { UseShellExecute = true }); + } + } +} +``` + +احفظ الملف باسم `Program.cs`، ضع ملف `input.html` بجانبه، شغّل `dotnet run`، وستظهر لك ملف PDF في نفس المجلد. + +## الخاتمة + +لقد انتهينا للتو من **دليل html إلى pdf** يوضح لك كيفية **إنشاء pdf من html** باستخدام Aspose.Html في C#. الخطوات الأساسية—تثبيت الحزمة، استيراد مساحة الاسم، الإشارة إلى ملفاتك، واستدعاء `HtmlConverter.ConvertHtmlToPdf`—بسطة، لكنها قوية بما يكفي لأحمال الإنتاج. + +من هنا يمكنك استكشاف **إنشاء pdf من html** مع ميزات إضافية مثل البيانات التعريفية، المعالجة غير المتزامنة، أو خيارات العرض المخصصة. إذا كنت بحاجة إلى **تحويل صفحات الويب إلى pdf** في الوقت الفعلي داخل خدمة ويب، ما عليك سوى استبدال النداء المتزامن بنظيره غير المتزامن وستكون جاهزًا. + +هل لديك المزيد من الأسئلة حول **إنشاء pdf باستخدام c#**؟ ربما تتساءل عن دمج ملفات PDF متعددة أو إضافة علامات مائية—هذه مواضيع طبيعية للخطوة التالية. استكشف وثائق Aspose، جرب الشيفرة، ودع المكتبة تتولى العمل الشاق. برمجة سعيدة! + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/rendering-html-documents/_index.md b/html/arabic/net/rendering-html-documents/_index.md index 7d8baa5d7..c4c8cf6fc 100644 --- a/html/arabic/net/rendering-html-documents/_index.md +++ b/html/arabic/net/rendering-html-documents/_index.md @@ -45,11 +45,16 @@ url: /ar/net/rendering-html-documents/ ### [كيفية تحويل HTML إلى PNG – دليل C# كامل](./how-to-render-html-as-png-complete-c-guide/) تعلم خطوة بخطوة كيفية تحويل مستندات HTML إلى صور PNG باستخدام Aspose.HTML وC# في هذا الدليل الشامل. + +### [كيفية تحويل HTML إلى PNG في C# – دليل كامل](./how-to-render-html-to-png-in-c-complete-guide/) +تعلم خطوة بخطوة كيفية تحويل مستندات HTML إلى صور PNG باستخدام C# و Aspose.HTML في دليل شامل. + ### [كيفية استخدام Aspose لتحويل HTML إلى PNG – دليل خطوة بخطوة](./how-to-use-aspose-to-render-html-to-png-step-by-step-guide/) تعلم كيفية تحويل مستندات HTML إلى صور PNG باستخدام Aspose.HTML في .NET خطوة بخطوة. ### [إنشاء PNG من HTML – دليل كامل للتصيير باستخدام C#](./create-png-from-html-full-c-rendering-guide/) تعلم كيفية تحويل صفحات HTML إلى صور PNG باستخدام Aspose.HTML في دليل شامل يوضح كل خطوة في C#. + ### [عرض EPUB بتنسيق XPS في .NET باستخدام Aspose.HTML](./render-epub-as-xps/) تعرف على كيفية إنشاء مستندات HTML وعرضها باستخدام Aspose.HTML لـ .NET في هذا البرنامج التعليمي الشامل. انغمس في عالم معالجة HTML وكشط الويب والمزيد. @@ -68,6 +73,9 @@ url: /ar/net/rendering-html-documents/ ### [كيفية تحويل HTML إلى PNG باستخدام Aspose – دليل كامل](./how-to-render-html-to-png-with-aspose-complete-guide/) تعلم خطوة بخطوة كيفية تحويل مستندات HTML إلى صور PNG باستخدام Aspose.HTML في .NET. +### [إنشاء مستند HTML بلغة C# – التحويل إلى PNG باستخدام Aspose.Html](./create-html-document-c-render-to-png-with-aspose-html/) +تعلم كيفية إنشاء مستند HTML باستخدام C# وتحويله إلى صورة PNG باستخدام مكتبة Aspose.Html. + {{< /blocks/products/pf/tutorial-page-section >}} {{< /blocks/products/pf/main-container >}} diff --git a/html/arabic/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md b/html/arabic/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md new file mode 100644 index 000000000..eb2982053 --- /dev/null +++ b/html/arabic/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md @@ -0,0 +1,192 @@ +--- +category: general +date: 2026-03-07 +description: إنشاء مستند HTML باستخدام C# بسرعة وتحويله إلى صورة (PNG). تعلّم كيفية + تعيين خط مخصص، تحويل HTML إلى PNG، وحفظ الصورة المُصدَّرة في بضع خطوات. +draft: false +keywords: +- create html document c# +- render html to image +- convert html to png +- save rendered image +- set custom font +language: ar +og_description: إنشاء مستند HTML باستخدام C# وتحويل HTML إلى صورة (PNG) باستخدام Aspose.Html. + دليل خطوة بخطوة يغطي الخطوط المخصصة، التحويل، والحفظ. +og_title: إنشاء مستند HTML بـ C# – تحويل إلى PNG باستخدام Aspose.Html +tags: +- C# +- Aspose.Html +- Image Rendering +title: إنشاء مستند HTML باستخدام C# – تحويل إلى PNG باستخدام Aspose.Html +url: /ar/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# إنشاء مستند HTML C# – التحويل إلى PNG باستخدام Aspose.Html + +هل احتجت يوماً إلى **إنشاء مستند HTML C#** وتحويله إلى صورة لتقرير أو صورة مصغرة للبريد الإلكتروني؟ لست وحدك. في العديد من مشاريع .NET ننتهي بقطعات من HTML يجب أن تتحول إلى PNG في الوقت الفعلي، والقيام بذلك يدوياً أمر مرهق. + +توضح لك هذه الدليل بالضبط كيفية **إنشاء مستند HTML C#**، **تعيين خط مخصص**، ضبط إعدادات العرض، **تحويل HTML إلى PNG**، وأخيراً **حفظ الصورة المرسومة**—كل ذلك باستخدام مكتبة Aspose.Html. لا أسرار، فقط كود واضح يمكنك إدراجه في مشروعك اليوم. + +سنتناول كل خطوة، نشرح لماذا كل جزء مهم، وسنغطي بعض الحالات الخاصة التي قد تواجهها. في النهاية ستحصل على طريقة قابلة لإعادة الاستخدام تأخذ أي سلسلة HTML وتنتج ملف PNG واضح على القرص. + +## ما الذي ستحتاجه + +- .NET 6.0 أو أحدث (الكود يعمل أيضاً مع .NET Framework 4.6+) +- Aspose.Html for .NET (متاح عبر NuGet `Aspose.Html.NET`) +- فهم أساسي للغة C# و async/await (اختياري لكن مفيد) + +إذا كان لديك هذه المتطلبات، لنبدأ. + +## الخطوة 1 – إنشاء مستند HTML C# + +أول شيء نفعله هو إنشاء كائن `HTMLDocument` يحمل العلامات التي نريد عرضها. فكر فيه كقماشك؛ بدون هذا القماش لا شيء يمكن رسمه. + +```csharp +using Aspose.Html; +using Aspose.Html.Drawing; +using Aspose.Html.Rendering.Image; + +// Step 1: Create an HTML document with simple content +var html = "

Hello, world!

"; +var htmlDocument = new HTMLDocument(html); +``` + +> **لماذا هذا مهم:** `HTMLDocument` يحلل السلسلة ويبني شجرة DOM. هنا يمكنك لاحقاً حقن CSS أو سكريبتات أو موارد خارجية قبل العرض. + +## الخطوة 2 – تعيين خط مخصص + +إذا كان التصميم يتطلب خطًا معينًا—مثلاً Arial غامق مائل بحجم 24 pt—يجب إخبار المُعرض بذلك. هنا يأتي دور **تعيين خط مخصص**. + +```csharp +// Step 2: Define a font (Arial, 24pt) with bold and italic styles +var titleFontInfo = new FontInfo("Arial", 24) +{ + Style = WebFontStyle.Bold | WebFontStyle.Italic +}; +``` + +> **نصيحة احترافية:** Aspose.Html يحترم أي خطوط مثبتة على النظام. إذا كنت بحاجة إلى خط ويب، فقط حمّله عبر `@font-face` داخل كتلة style قبل العرض. + +## الخطوة 3 – ضبط خيارات العرض لتحويل HTML إلى PNG + +الآن نحدد حجم الناتج وما إذا كنا نريد مضاد التعرج (antialiasing). هذه الإعدادات تؤثر مباشرة على جودة الصورة النهائية. + +```csharp +// Step 3: Configure rendering options – set image size and enable antialiasing +var renderingOptions = new ImageRenderingOptions +{ + Width = 800, // output width in pixels + Height = 600, // output height in pixels + UseAntialiasing = true +}; +``` + +> **لماذا هذا مهم:** بدون أبعاد صحيحة، قد تُصبح الصورة مشوهة أو مقصوصة. مضاد التعرج ينعّم الحواف، وهو مهم خصوصاً للنصوص. + +## الخطوة 4 – عرض HTML إلى صورة + +مع المستند، الخط، والإعدادات جاهزة، ن finally **نُظهر html إلى صورة**. يقوم `ImageRenderer` بالعمل الشاق، حيث يحول DOM إلى صورة نقطية (bitmap). + +```csharp +// Step 4: Render the HTML document to an image using the options +using var imageRenderer = new ImageRenderer(htmlDocument, renderingOptions); +imageRenderer.Render(); +``` + +> **ما ستراه:** بعد هذا الاستدعاء، يحتوي `imageRenderer` على تمثيل نقطي للـ HTML. يمكنك فحصه، تعديلّه، أو كتابته مباشرة إلى تدفق (stream). + +![create html document c# example](https://example.com/assets/create-html-document-csharp.png "create html document c# example") + +*نص alt للصورة يتضمن الكلمة المفتاحية الأساسية لتحسين محركات البحث.* + +## الخطوة 5 – حفظ الصورة المرسومة + +القطعة الأخيرة من اللغز هي حفظ البت ماب على القرص. هنا يأتي دور **حفظ الصورة المرسومة**. + +```csharp +// Step 5: Save the rendered image to a file +imageRenderer.Save("YOUR_DIRECTORY/rendered.png"); +``` + +> **نصيحة:** إذا كنت بحاجة إلى تنسيق مختلف (JPEG, BMP, GIF) فقط غيّر امتداد الملف؛ Aspose.Html سيختار الترميز المناسب تلقائيًا. + +### مثال كامل يعمل + +بتجميع كل ما سبق، إليك طريقة مستقلة يمكنك نسخها ولصقها: + +```csharp +using Aspose.Html; +using Aspose.Html.Drawing; +using Aspose.Html.Rendering.Image; + +public static void RenderHtmlToPng(string htmlContent, string outputPath) +{ + // Create the HTML document + var document = new HTMLDocument(htmlContent); + + // Optional: set a custom font (example uses Arial 24pt bold‑italic) + var fontInfo = new FontInfo("Arial", 24) + { + Style = WebFontStyle.Bold | WebFontStyle.Italic + }; + // You could attach the fontInfo to a style element if needed + + // Configure rendering options + var options = new ImageRenderingOptions + { + Width = 800, + Height = 600, + UseAntialiasing = true + }; + + // Render and save + using var renderer = new ImageRenderer(document, options); + renderer.Render(); + renderer.Save(outputPath); +} +``` + +**النتيجة المتوقعة:** تشغيل `RenderHtmlToPng("

Hello, world!

", "C:\\temp\\hello.png")` يُنشئ ملف PNG بحجم 800 × 600 يحتوي على النص “Hello, world!” معروضًا بخط Arial 24 pt غامق مائل. + +## الأخطاء الشائعة وكيفية تجنّبها + +| العَرَض | السبب المحتمل | الحل | +|---------|--------------|-----| +| النص يظهر غير واضح | تعطيل Antialiasing | تأكد من أن `UseAntialiasing = true` | +| الخط يعود إلى الافتراضي | الخط غير مثبت على الخادم | ثبّت الخط أو أدمجه عبر `@font-face` | +| الصورة مقصوصة | العرض/الارتفاع أصغر من المحتوى | زد `Width`/`Height` أو استخدم خيار `FitToContent` | +| PNG فارغ | سلسلة HTML فارغة أو null | تحقق من `htmlContent` قبل إنشاء `HTMLDocument` | + +**حالة خاصة:** إذا كنت بحاجة إلى عرض صفحة طويلة جداً (مثل تقرير كامل)، اضبط `Height` إلى قيمة أكبر أو استخدم `ImageRenderingOptions.PageHeight` لتسمح لـ Aspose بحساب الحجم المطلوب تلقائيًا. + +## لماذا نستخدم Aspose.Html لهذه المهمة؟ + +- **متعدد المنصات**: يعمل على Windows, Linux, و macOS. +- **بدون متصفحات خارجية**: على عكس Chrome headless، لا توجد عملية ثقيلة. +- **تحكم دقيق**: يمكنك تعديل DPI، لون الخلفية، وحتى العرض إلى PDF ضمن نفس السلسلة. + +إذا كنت تستخدم Aspose.Pdf في أماكن أخرى، ستجد واجهة البرمجة مألوفة. + +## الخطوات التالية + +الآن بعد أن تعلمت كيفية **إنشاء مستند HTML C#**، **تعيين خط مخصص**، **عرض html إلى صورة**، **تحويل HTML إلى PNG**، و **حفظ الصورة المرسومة**، فكر في هذه التوسعات: + +- **معالجة دفعات** – كرّر العملية على مجموعة من قطع HTML لإنشاء معرض PNG. +- **تحديد حجم ديناميكي** – احسب أبعاد الصورة المطلوبة بناءً على `scrollHeight` للـ DOM. +- **إضافة علامة مائية** – بعد العرض، ارسم رسومات إضافية على البت ماب باستخدام `System.Drawing`. + +لا تتردد في تجربة خطوط، ألوان، أو حتى محتوى SVG مختلف. الإمكانيات لا حدود لها بمجرد أن تكون خط أنابيب العرض جاهزة. + +--- + +*برمجة سعيدة! إذا صادفت أي مشاكل أو لديك أفكار لتحسين، اترك تعليقًا أدناه. سنستمر في النقاش.* + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/rendering-html-documents/how-to-render-html-to-png-in-c-complete-guide/_index.md b/html/arabic/net/rendering-html-documents/how-to-render-html-to-png-in-c-complete-guide/_index.md new file mode 100644 index 000000000..8ccb054f9 --- /dev/null +++ b/html/arabic/net/rendering-html-documents/how-to-render-html-to-png-in-c-complete-guide/_index.md @@ -0,0 +1,238 @@ +--- +category: general +date: 2026-03-07 +description: تعلم كيفية تحويل HTML إلى PNG باستخدام Aspose.Html في C#. يوضح لك هذا + الدليل خطوة بخطوة أيضًا كيفية تحويل HTML إلى PNG، وتصدير HTML إلى صورة، وحفظ HTML + كملف PNG. +draft: false +keywords: +- how to render html +- convert html to png +- export html to image +- save html as png +- c# html to image +language: ar +og_description: كيفية عرض HTML في C#؟ اتبع هذا الدليل لتحويل HTML إلى PNG، وتصدير + HTML إلى صورة، وحفظ HTML كملف PNG باستخدام Aspose.Html. +og_title: كيفية تحويل HTML إلى PNG في C# – دليل كامل +tags: +- Aspose.Html +- C# +- Image Rendering +title: كيفية تحويل HTML إلى PNG في C# – دليل كامل +url: /ar/net/rendering-html-documents/how-to-render-html-to-png-in-c-complete-guide/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# كيفية تحويل HTML إلى PNG في C# – دليل كامل + +هل تساءلت يومًا **كيف يتم تحويل html** مباشرةً إلى ملف صورة دون الحاجة إلى تشغيل محرك متصفح بنفسك؟ لست وحدك. في العديد من سيناريوهات سطح المكتب أو الخادم تحتاج إلى لقطة سريعة لصفحة ويب — فكر في صور مصغرة للبريد الإلكتروني، معاينات غلاف PDF، أو اختبار واجهة المستخدم الآلي. الخبر السار؟ باستخدام Aspose.Html يمكنك **تحويل html إلى png** ببضع أسطر من كود C#. + +في هذا الدرس سنستعرض كل ما تحتاج معرفته: من تثبيت المكتبة، ضبط خيارات التحويل، إلى **تصدير html إلى صورة** و**حفظ html كـ png** على القرص. في النهاية ستحصل على مقتطف قابل لإعادة الاستخدام يمكنك إدراجه في أي مشروع .NET، سواء كان أداة سطر أوامر، API ويب، أو خدمة خلفية. + +## ما ستتعلمه + +- كيفية إعداد مشروع C# لتحويل HTML باستخدام Aspose.Html. +- الكود الدقيق المطلوب **لتحويل html إلى png**، بما في ذلك مضاد التعرجات للحصول على رسومات متجهة واضحة. +- نصائح للتعامل مع الصفحات الكبيرة، الأبعاد المخصصة، والمشكلات الشائعة. +- طرق للتحقق من أن ملف PNG الناتج يطابق التوقعات، لتتمكن من الاعتماد على النتيجة في بيئة الإنتاج. + +> **المتطلبات المسبقة:** .NET 6.0 أو أحدث، Visual Studio 2022 (أو أي محرر تفضله)، ورخصة NuGet لـ Aspose.Html. لا تحتاج إلى خبرة سابقة في تحويل الصور. + +--- + +## كيفية تحويل HTML – نظرة عامة خطوة بخطوة + +فيما يلي البرنامج الكامل الجاهز للتنفيذ. يمكنك نسخه ولصقه في تطبيق كونسول جديد والضغط على **F5**. + +```csharp +// ------------------------------------------------------------ +// Complete example: render an HTML file to a PNG image +// ------------------------------------------------------------ +using System; +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +namespace HtmlToPngDemo +{ + class Program + { + static void Main(string[] args) + { + // 1️⃣ Load the source HTML document + // ---------------------------------------------------- + // Replace YOUR_DIRECTORY with the folder that contains sample.html + string htmlPath = @"YOUR_DIRECTORY\sample.html"; + HTMLDocument htmlDoc = new HTMLDocument(htmlPath); + + // 2️⃣ Define rendering options – size and antialiasing + // ---------------------------------------------------- + ImageRenderingOptions options = new ImageRenderingOptions + { + Width = 1024, // Desired image width in pixels + Height = 768, // Desired image height in pixels + UseAntialiasing = true // Improves visual quality of vector elements + }; + + // 3️⃣ Render the HTML to an image and save it as PNG + // ---------------------------------------------------- + using var renderer = new ImageRenderer(htmlDoc, options); + renderer.Render(); // Performs the actual rendering pass + string outputPath = @"YOUR_DIRECTORY\antialiased.png"; + renderer.Save(outputPath); + + Console.WriteLine($"✅ Rendering complete! Image saved to: {outputPath}"); + } + } +} +``` + +### لماذا يعمل هذا + +- **HTMLDocument** يقوم بتحليل العلامات، حل CSS، وبناء DOM يمكن لـ Aspose.Html التعامل معه. +- **ImageRenderingOptions** يخبر المحرك بأبعاد البكسل الدقيقة التي تريدها ويفعل مضاد التعرجات، مما ينعم الحواف على أيقونات SVG أو الرسومات المعتمدة على الخطوط. +- **ImageRenderer** يقوم بالعمل الشاق: يرسم الـ DOM على صورة bitmap ثم يكتب النتيجة إلى نظام الملفات. + +تدفق الخطوات الثلاثة يعكس العملية المنطقية “تحميل → ضبط → تصيير”، وهذا هو السبب في أن الكود يبدو طبيعيًا حتى وإن كنت جديدًا على تحويل **c# html to image**. + +--- + +## تحويل HTML إلى PNG – ضبط خيارات التحويل + +عند **تحويل html إلى png**، قد لا تتطابق الإعدادات الافتراضية مع متطلبات التصميم الخاصة بك. إليك بعض الخيارات التي يمكنك تعديلها: + +| الخيار | حالة الاستخدام النموذجية | القيمة الموصى بها | +|--------|--------------------------|-------------------| +| `Width` / `Height` | مطابقة حجم صورة مصغرة محدد | 1024 × 768 (كما هو موضح) | +| `UseAntialiasing` | تحسين المنحنيات على أيقونات SVG | `true` (دائمًا) | +| `BackgroundColor` | خلفية شفافة للطبقات المتراكبة | `System.Drawing.Color.Transparent` | +| `PageBackgroundColor` | تجاوز خلفية CSS المحددة | `System.Drawing.Color.White` | + +**نصيحة احترافية:** إذا كنت تحتاج إلى PNG شفاف (مثلاً للطبقات UI)، عيّن `options.BackgroundColor = System.Drawing.Color.Transparent;` قبل استدعاء `Render()`. + +--- + +## تصدير HTML إلى صورة – التصيير وحفظ الملف + +عملية **تصدير html إلى صورة** هي استدعاء طريقة واحدة بمجرد ضبط كل شيء، لكن هناك بعض التفاصيل التي تستحق الانتباه: + +1. **يتم استنتاج تنسيق الملف من الامتداد** الذي تمرره إلى `Save()`. استخدم `.png` لجودة غير مضغوطة، `.jpg` لملفات أصغر. +2. **سلامة الخيوط:** `ImageRenderer` غير آمن للاستخدام المتعدد الخيوط، لذا أنشئ نسخة جديدة لكل طلب إذا كنت في سيناريو API ويب. +3. **استهلاك الذاكرة:** الصفحات الكبيرة (مثلاً 3000 × 4000 px) قد تستهلك RAM كبير. إذا واجهت `OutOfMemoryException`، فكر في التصيير على قطع باستخدام `ImageRenderer.Render(Rectangle)`. + +فيما يلي تعديل سريع يوضح حفظ الصورة كـ JPEG بجودة 85 %: + +```csharp +using var renderer = new ImageRenderer(htmlDoc, options); +renderer.Render(); +renderer.Save("output.jpg", ImageFormat.Jpeg, 85); // 85% quality +``` + +--- + +## حفظ HTML كـ PNG – التحقق من النتيجة + +بعد أن **تحفظ html كـ png**، سترغب في التأكد من أن الملف يبدو صحيحًا. أسهل طريقة هي فتحه بأي عارض صور، لكن في خطوط الأنابيب الآلية يمكنك فحص حجم الملف وأبعاده برمجيًا: + +```csharp +using System.Drawing; + +// Load the generated PNG +using var bitmap = new Bitmap(outputPath); +Console.WriteLine($"Image dimensions: {bitmap.Width}x{bitmap.Height}"); +Console.WriteLine($"Pixel format: {bitmap.PixelFormat}"); +``` + +إذا لم تتطابق الأبعاد مع الخيارات التي ضبطتها، تحقق من أن HTML لا يحتوي على CSS يفرض حجمًا مختلفًا (مثلًا `body { width: 500px; }`). في هذه الحالة، يمكنك فرض حجم الـ viewport بإضافة وسم meta أو تجاوز القيم عبر `options.Width`/`options.Height`. + +--- + +## المشكلات الشائعة وكيفية تجنبها + +- **المسارات النسبية في HTML** – إذا كان `sample.html` يشير إلى صور عبر URLs نسبية، تأكد من ضبط دليل العمل إلى المجلد الذي يحتوي على تلك الأصول، أو استخدم `HTMLDocument(string html, string baseUrl)` لتحديد مسار أساسي. +- **الخطوط المفقودة** – قد لا تُظهر الخطوط الويب المخصصة إذا لم يتمكن الخادم من تحميلها. قم بدمج الخطوط محليًا أو عيّن `options.FontsFolder` إلى مجلد يحتوي على ملفات `.ttf` المطلوبة. +- **ملفات CSS الكبيرة** – الأنماط المعقدة قد تبطئ عملية التصيير. فكر في تصغير CSS قبل التحميل، أو فعّل `options.EnableCssOptimization = true` (إذا كانت مدعومة في نسخة Aspose التي تستخدمها). + +--- + +## مثال كامل يعمل (كل شيء في ملف واحد) + +فيما يلي الكود **النهائي الجاهز للإنتاج** الذي يمكنك وضعه مباشرةً في مشروع كونسول جديد اسمه `HtmlToPngDemo`. استبدل `YOUR_DIRECTORY` بمسار مطلق أو نسبي على جهازك. + +```csharp +using System; +using Aspose.Html; +using Aspose.Html.Rendering.Image; +using System.Drawing; // For verification (optional) + +namespace HtmlToPngDemo +{ + class Program + { + static void Main() + { + // ---------------------------------------------------- + // 1️⃣ Load HTML document + // ---------------------------------------------------- + string htmlFile = @"YOUR_DIRECTORY\sample.html"; + HTMLDocument doc = new HTMLDocument(htmlFile); + + // ---------------------------------------------------- + // 2️⃣ Configure rendering options + // ---------------------------------------------------- + ImageRenderingOptions opts = new ImageRenderingOptions + { + Width = 1024, + Height = 768, + UseAntialiasing = true, + BackgroundColor = System.Drawing.Color.Transparent // Transparent PNG + }; + + // ---------------------------------------------------- + // 3️⃣ Render and save as PNG + // ---------------------------------------------------- + using var renderer = new ImageRenderer(doc, opts); + renderer.Render(); + + string pngFile = @"YOUR_DIRECTORY\antialiased.png"; + renderer.Save(pngFile); // PNG is inferred from extension + + // ---------------------------------------------------- + // 4️⃣ (Optional) Verify the result + // ---------------------------------------------------- + using var bmp = new Bitmap(pngFile); + Console.WriteLine($"✅ PNG saved! Size: {bmp.Width}×{bmp.Height} pixels"); + + // Keep console window open + Console.WriteLine("Press any key to exit..."); + Console.ReadKey(); + } + } +} +``` + +تشغيل البرنامج ينتج ملف `antialiased.png` واضح يعكس تخطيط HTML الأصلي، مع جميع أنماط CSS والرسومات المتجهة. + +--- + +## الخلاصة + +أنت الآن تعرف **كيفية تحويل html** إلى ملف PNG باستخدام Aspose.Html في C#. غطى الدليل كل شيء من إعداد المشروع، مرورًا بخيارات **تحويل html إلى png**، إلى **تصدير html إلى صورة** وأخيرًا **حفظ html كـ png**. باتباع الخطوات أعلاه يمكنك دمج تحويل HTML إلى صورة في أي تطبيق .NET، سواء كان أداة سطر أوامر، خدمة ويب، أو مهمة خلفية. + +**الخطوات التالية:** + +- جرّب صيغ صور مختلفة (`.bmp`, `.gif`) بتغيير امتداد الملف في `Save()`. +- حاول تصيير صفحات متعددة داخل حلقة لإنشاء سلسلة PNG تشبه PDF. +- استكشف فئة `PdfRenderer` إذا احتجت للانتقال مباشرةً من HTML إلى PDF بعد التصيير. + +هل لديك أسئلة حول الحالات الخاصة، الترخيص، أو تحسين الأداء؟ اترك تعليقًا أدناه أو راجع وثائق Aspose.Html الرسمية لمزيد من التفاصيل. برمجة سعيدة، واستمتع بتحويل HTML إلى صور جميلة! + +![مثال على تحويل html إلى صورة](/images/html-to-png-sample.png "مثال على تحويل html إلى صورة") + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/working-with-html-documents/_index.md b/html/arabic/net/working-with-html-documents/_index.md index 30c32a306..4e77788e3 100644 --- a/html/arabic/net/working-with-html-documents/_index.md +++ b/html/arabic/net/working-with-html-documents/_index.md @@ -38,6 +38,8 @@ url: /ar/net/working-with-html-documents/ ### [كيفية حفظ HTML في C# – دليل كامل باستخدام معالج موارد مخصص](./how-to-save-html-in-c-complete-guide-using-a-custom-resource/) ### [كيفية جعل العنوان غامقًا باستخدام CSS و C# – دليل خطوة بخطوة كامل](./how-to-bold-heading-with-css-c-complete-step-by-step-guide/) +### [كيفية حفظ HTML باستخدام Aspose – دليل كامل C#](./how-to-save-html-with-aspose-complete-c-guide/) +### [كيفية ضغط HTML في C# – دليل كامل لإنشاء أرشيف ZIP](./how-to-zip-html-in-c-complete-guide-to-create-zip-archive/) {{< /blocks/products/pf/tutorial-page-section >}} diff --git a/html/arabic/net/working-with-html-documents/how-to-save-html-with-aspose-complete-c-guide/_index.md b/html/arabic/net/working-with-html-documents/how-to-save-html-with-aspose-complete-c-guide/_index.md new file mode 100644 index 000000000..4118acc11 --- /dev/null +++ b/html/arabic/net/working-with-html-documents/how-to-save-html-with-aspose-complete-c-guide/_index.md @@ -0,0 +1,235 @@ +--- +category: general +date: 2026-03-07 +description: كيفية حفظ HTML باستخدام Aspose في C# – تعلم تحميل HTML من URL، واستخدام + Aspose، وكتابة HTML إلى تدفق بشكل فعال. +draft: false +keywords: +- how to save html +- load html from url +- how to use aspose +- write html to stream +language: ar +og_description: كيفية حفظ HTML باستخدام Aspose في C# – تعلم تحميل HTML من URL، واستخدام + Aspose، وكتابة HTML إلى التدفق بكفاءة. +og_title: كيفية حفظ HTML باستخدام Aspose – دليل C# الكامل +tags: +- Aspose +- C# +- HTML +- Streaming +title: كيفية حفظ HTML باستخدام Aspose – دليل C# الكامل +url: /ar/net/working-with-html-documents/how-to-save-html-with-aspose-complete-c-guide/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# كيفية حفظ HTML باستخدام Aspose – دليل C# كامل + +**How to save HTML** هو مهمة شائعة عندما تحتاج إلى أرشفة صفحة ويب، أو إمدادها إلى خدمة أخرى، أو ببساطة فحص مواردها دون اتصال. هل تساءلت يومًا كيف تحمل HTML من URL، وتستخدم Aspose، وتكتب HTML إلى تدفق دون التعامل مع ملفات مؤقتة؟ في هذا الدرس سنستعرض حلًا عمليًا من البداية إلى النهاية يفعل ذلك بالضبط. + +سنغطي كل شيء بدءًا من سحب صفحة حية إلى `HTMLDocument`، وتكوين `ResourceHandler` مخصص، وأخيرًا استخراج الحزمة بالكامل كـ `MemoryStream` واحد. في النهاية ستحصل على مقتطف قابل لإعادة الاستخدام يمكن إدراجه في أي مشروع .NET، سواء كنت تبني أداة استخراج، أو مولد تقارير، أو خدمة تخزين مؤقت للمحتوى. + +> **المتطلبات المسبقة** – تحتاج إلى .NET 6+ (أو .NET Framework 4.7 أو أعلى) وحزمة **Aspose.HTML for .NET** من NuGet. لا توجد مكتبات طرف ثالث أخرى مطلوبة، والكود يعمل في Visual Studio أو Rider أو أي محرر تفضله. + +--- + +## كيفية حفظ HTML – تنفيذ خطوة بخطوة + +فيما يلي البرنامج الكامل الجاهز للتنفيذ. لا تتردد في نسخه ولصقه في تطبيق Console جديد واضغط **F5**. + +```csharp +using System; +using System.IO; +using Aspose.Html; +using Aspose.Html.Saving; + +/// +/// Custom handler that captures every external resource (images, CSS, scripts) +/// into the same MemoryStream. In real‑world scenarios you might branch on +/// info.ResourceType to store them separately. +/// +class MyMemoryHandler : ResourceHandler +{ + public MemoryStream Output { get; } = new MemoryStream(); + + public override Stream HandleResource(ResourceInfo info) + { + // Return the same stream for every resource – Aspose will write sequentially. + return Output; + } +} + +class Program +{ + static void Main() + { + // 1️⃣ Load the HTML document from a live URL. + var htmlDocument = new HTMLDocument("https://example.com"); + + // 2️⃣ Set up save options and plug in our custom memory handler. + var htmlSaveOptions = new HTMLSaveOptions() + { + OutputStorage = new MyMemoryHandler() + }; + + // 3️⃣ Save – Aspose writes the HTML + all linked resources into the stream. + htmlDocument.Save(htmlSaveOptions); + + // 4️⃣ Retrieve the generated package as a UTF‑8 string for demonstration. + string htmlContent = System.Text.Encoding.UTF8.GetString( + htmlSaveOptions.OutputStorage.Output.ToArray()); + + Console.WriteLine("=== Extracted HTML Package ==="); + Console.WriteLine(htmlContent); + } +} +``` + +### ما يفعله الكود، بلغة بسيطة + +1. **Load HTML from URL** – `HTMLDocument` تقبل عنوان URL كسلسلة نصية، تقوم بإجراء طلب HTTP، وتبني شجرة DOM داخليًا. هذه أبسط طريقة لـ **load html from url** دون الحاجة إلى إعداد `HttpClient` يدويًا. +2. **Create a custom `ResourceHandler`** – Aspose يستدعي `HandleResource` لكل مورد خارجي (صور، CSS، JS). بإرجاع نفس الـ `MemoryStream`، نجبر جميع البايتات على التجميع في مخزن واحد. هذه هي الحيلة التي تسمح لنا بـ **write html to stream** في خطوة واحدة. +3. **Configure `HTMLSaveOptions`** – خاصية `OutputStorage` تخبر Aspose أين يضع النتيجة. توصيل `MyMemoryHandler` هنا هو الخطوة الإضافية الوحيدة المطلوبة لإعادة توجيه الإخراج. +4. **Save and read back** – بعد `Save`، يحتوي تدفق `Output` على حزمة شبيهة بـ ZIP (HTML + الموارد). تحويله إلى سلسلة UTF‑8 يتيح لنا طباعتها في وحدة التحكم للتحقق السريع. + +> **نصيحة احترافية:** في بيئة الإنتاج ربما ترغب في إعادة ضبط موضع التدفق (`Output.Seek(0, SeekOrigin.Begin)`) قبل تمريره إلى API آخر، أو كتابته مباشرةً إلى تدفق استجابة في ASP.NET. + +## تحميل HTML من URL باستخدام Aspose + +إذا كنت معتادًا على استخدام `HttpClient` ثم تمرير السلسلة الخام إلى محلل، قد تتساءل لماذا يمكن لـ Aspose جلب الصفحة لك. الجواب يكمن في **طبقة الشبكة المدمجة** التي تحترم عمليات إعادة التوجيه، الكوكيز، وحتى المصادقة الأساسية مباشرةً. + +```csharp +// Simple one‑liner – no extra using statements needed +var document = new HTMLDocument("https://example.com"); +``` + +- **Why this matters:** تتجنب استدعاء شبكة منفصل وتسمح لـ Aspose بمعالجة حل عناوين URL النسبية تلقائيًا. هذا يعني عندما تشير الصفحة إلى `styles/main.css`، يعرف Aspose كيفية العثور عليه بالنسبة للعنوان الأصلي. +- **Edge case:** إذا كان الموقع المستهدف يتطلب رؤوس مخصصة (مثل مفتاح API)، يمكنك تزويد كائن `HttpWebRequest` إلى المُنشئ. يركز الدرس على الحالة الافتراضية لتبسيط الأمور. + +## كتابة HTML إلى تدفق باستخدام معالج مخصص + +جوهر **how to save html** بكفاءة هو `ResourceHandler`. بشكل افتراضي، يقوم Aspose بكتابة كل مورد إلى ملف منفصل على القرص، وهو مناسب للتصحيح لكنه غير فعال في سيناريوهات الذاكرة. + +```csharp +class MyMemoryHandler : ResourceHandler +{ + public MemoryStream Output { get; } = new MemoryStream(); + + public override Stream HandleResource(ResourceInfo info) + { + // All resources share the same stream – Aspose appends data. + return Output; + } +} +``` + +### متى نوسع هذا النمط + +- **Large images:** إذا كنت تتوقع ملفات ثنائية ضخمة، فكر في تخزين كل مورد في `MemoryStream` منفصل لتجنب كتلة واحدة هائلة. +- **Selective saving:** استخدم شرطًا على `info.ResourceType` (مثل `ResourceType.Image`) لتخطي السكريبتات غير المطلوبة. +- **Progress reporting:** زد عدادًا داخل `HandleResource` وعرّفه لتوفير تغذية راجعة للواجهة. + +## استخدام خيارات حفظ Aspose HTML + +`HTMLSaveOptions` توفر العديد من الإعدادات—مستوى الضغط، الترميز، وحتى القدرة على إنتاج **حزمة HTML ملف واحد** (MHTML). في مثالنا قمنا فقط بتعيين `OutputStorage`، ولكن إليك نظرة سريعة على خصائص أخرى مفيدة: + +| Property | Description | Typical Value | +|----------|-------------|---------------| +| `Encoding` | ترميز النص للـ HTML المُولد | `Encoding.UTF8` | +| `CompressResources` | ما إذا كان سيتم ضغط الموارد المرتبطة بـ gzip | `true` | +| `MhtmlSaveMode` | حفظ كـ MHTML بدلاً من ملفات منفصلة | `MhtmlSaveMode.AllResources` | + +يمكنك ربطها بسلاسة: + +```csharp +var saveOptions = new HTMLSaveOptions() +{ + OutputStorage = new MyMemoryHandler(), + Encoding = System.Text.Encoding.UTF8, + CompressResources = true +}; +``` + +## التحقق من النتيجة – ماذا يجب أن ترى؟ + +تشغيل البرنامج يطبع سلسلة طويلة تبدأ بوسم HTML الخاص بـ *example.com* متبوعًا ببيانات ثنائية لكل مورد. إذا قمت بتفريغ تدفق `Output` إلى ملف (`File.WriteAllBytes("page.zip", stream.ToArray())`) وفك ضغطه، ستجد: + +- `index.html` – المستند الرئيسي +- `styles.css`, `script.js`, `image.png` – جميع الأصول المشار إليها في الصفحة + +هذا يؤكد **how to save html** كحزمة ذاتية الاحتواء، جاهزة للتخزين، النقل، أو المعالجة الإضافية. + +## الأخطاء الشائعة وكيفية تجنبها + +| Symptom | Likely Cause | Fix | +|---------|--------------|-----| +| `ArgumentNullException` from `HandleResource` | إرجاع `null` بدلاً من تدفق | يجب دائمًا إرجاع `Stream` صالح (مثال: `new MemoryStream()`) | +| Empty output | عدم استدعاء `htmlDocument.Save` | تأكد من استدعاء طريقة `Save` بعد تكوين الخيارات | +| Corrupted images | عدم إعادة ضبط التدفق قبل إعادة الاستخدام | استدعِ `Output.Seek(0, SeekOrigin.Begin)` إذا قرأت التدفق عدة مرات | +| Slow performance on huge pages | استخدام `MemoryStream` واحد لكل شيء | قسّم الموارد إلى تدفقات منفصلة أو اكتب مباشرةً إلى ملف | + +## مثال كامل يعمل (جاهز للنسخ واللصق) + +```csharp +using System; +using System.IO; +using Aspose.Html; +using Aspose.Html.Saving; + +class MyMemoryHandler : ResourceHandler +{ + public MemoryStream Output { get; } = new MemoryStream(); + + public override Stream HandleResource(ResourceInfo info) + { + return Output; + } +} + +class Program +{ + static void Main() + { + // Load the page from the web + var htmlDocument = new HTMLDocument("https://example.com"); + + // Prepare save options with our custom handler + var htmlSaveOptions = new HTMLSaveOptions() + { + OutputStorage = new MyMemoryHandler(), + Encoding = System.Text.Encoding.UTF8, + CompressResources = true + }; + + // Save – everything goes into the MemoryStream + htmlDocument.Save(htmlSaveOptions); + + // Convert to string for demo purposes + string htmlContent = System.Text.Encoding.UTF8.GetString( + htmlSaveOptions.OutputStorage.Output.ToArray()); + + Console.WriteLine("=== Extracted HTML Package ==="); + Console.WriteLine(htmlContent); + } +} +``` + +شغّله، وسترى حزمة HTML الكاملة مطبوعة في وحدة التحكم. استبدل عنوان URL بأي موقع تحتاجه، وستكون قد أتقنت **how to save html** في الوقت الفعلي. + +## توضيح بالصورة + +![مثال على كيفية حفظ html](https://example.com/placeholder-image.png) + +*نص بديل:* **how to save html example** – يوضح تدفق الذاكرة الذي يحتوي على HTML + الموارد. + +## الخلاصة + +لقد عرضنا للتو **how to save HTML** باستخدام واجهة برمجة التطبيقات القوية لـ Aspose، وتناولنا تفاصيل **loading html from url**، وشرحنا **how to use Aspose** لمعالجة الموارد، وأظهرنا طريقة نظيفة لـ **write HTML to stream**. النهج خفيف الوزن، لا يتطلب ملفات مؤقتة، ويمكن تكييفه لوظائف السحابة، والمهام الخلفية، + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/working-with-html-documents/how-to-zip-html-in-c-complete-guide-to-create-zip-archive/_index.md b/html/arabic/net/working-with-html-documents/how-to-zip-html-in-c-complete-guide-to-create-zip-archive/_index.md new file mode 100644 index 000000000..bfa5daf5a --- /dev/null +++ b/html/arabic/net/working-with-html-documents/how-to-zip-html-in-c-complete-guide-to-create-zip-archive/_index.md @@ -0,0 +1,248 @@ +--- +category: general +date: 2026-03-07 +description: تعلم كيفية ضغط ملفات HTML في C# باستخدام ضغط zip المثالي. يوضح لك هذا + الدليل خطوة بخطوة كيفية إنشاء أرشيف zip وحفظ ملفات HTML كملف zip بكفاءة. +draft: false +keywords: +- how to zip html +- c# create zip archive +- save html as zip +- optimal zip compression +- create zip from html +language: ar +og_description: تعلم كيفية ضغط HTML في C# باستخدام ضغط zip الأمثل. اتبع هذا الدليل + لإنشاء أرشيف zip وحفظ HTML كملف zip في دقائق. +og_title: كيفية ضغط HTML في C# – دليل كامل لإنشاء أرشيف ZIP +tags: +- C# +- Aspose.Html +- ZIP +- File Compression +title: كيفية ضغط ملفات HTML في C# – دليل كامل لإنشاء أرشيف ZIP +url: /ar/net/working-with-html-documents/how-to-zip-html-in-c-complete-guide-to-create-zip-archive/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# كيفية ضغط ملفات HTML في C# – دليل كامل لإنشاء أرشيف ZIP + +هل تساءلت يومًا **كيفية ضغط ملفات HTML** مباشرةً من تطبيق C# الخاص بك دون استخراجها أولاً؟ لست وحدك. يواجه العديد من المطورين صعوبة عندما يحتاجون إلى شحن صفحة HTML مع صورها وملفات CSS والسكريبتات كحزمة واحدة محمولة. الخبر السار؟ ببضع أسطر من الشيفرة يمكنك فعل ذلك تمامًا—**كيفية ضغط HTML** يصبح أمرًا سهلًا. + +في هذا الدرس سنستعرض حلًا عمليًا يستخدم Aspose.HTML لتحميل مستند HTML، و`ResourceHandler` مخصص لتدفق كل مورد مباشرةً إلى إدخال ZIP، و`ZipArchive` المدمج في .NET لضغط **ZIP أمثل**. بنهاية الدرس ستعرف **c# create zip archive**، **save html as zip**، وحتى تعديل العملية لحالات خاصة مثل الأصول الثنائية الكبيرة. لا أدوات خارجية، فقط C# نقي. + +## ما ستحتاجه + +- .NET 6.0 أو أحدث (الكود يعمل أيضًا على .NET Framework 4.7+). +- Aspose.HTML for .NET (الإصدار التجريبي المجاني يكفي للاختبار). +- فهم أساسي للـ streams وإدخال/إخراج الملفات في C#. + +إذا كان لديك حل Visual Studio مفتوح بالفعل، رائع—فقط أضف حزمة NuGet `Aspose.Html` وستكون جاهزًا للانطلاق. + +## الخطوة 1 – إعداد `ResourceHandler` مخصص (كيفية ضغط HTML – المنطق الأساسي) + +قلب **كيفية ضغط HTML** يكمن في اعتراض كل طلب مورد يقدمه محرك HTML (الصور، CSS، الخطوط) وتوجيهه إلى إدخال ZIP بدلاً من الكتابة إلى القرص. يتيح لك Aspose.HTML فعل ذلك عبر توريث `ResourceHandler`. + +```csharp +using System; +using System.IO; +using System.IO.Compression; +using Aspose.Html; +using Aspose.Html.Saving; + +/// +/// Handles each HTML resource by creating a ZIP entry on the fly. +/// This class is the key to answering “how to zip HTML” without temporary files. +/// +class ZipHandler : ResourceHandler +{ + private readonly ZipArchive _zipArchive; + + // The constructor receives the output stream that will become the .zip file. + public ZipHandler(Stream zipStream) => + _zipArchive = new ZipArchive(zipStream, ZipArchiveMode.Create, leaveOpen: true); + + // Called for every external resource (image, CSS, etc.). + public override Stream HandleResource(ResourceInfo info) + { + // Use the last segment of the URI (e.g., "logo.png") as the entry name. + string entryName = info.Uri.Segments[^1]; + var entry = _zipArchive.CreateEntry(entryName, CompressionLevel.Optimal); + // The HTML engine writes directly into the entry stream. + return entry.Open(); + } + + protected override void Dispose(bool disposing) + { + if (disposing) _zipArchive.Dispose(); + base.Dispose(disposing); + } +} +``` + +**لماذا هذا مهم:** من خلال تزويد محرك HTML بـ stream يشير مباشرةً إلى `ZipArchiveEntry`، تلغي الحاجة إلى مجلدات مؤقتة. هذا هو النهج الأكثر **ضغطًا أمثل للـ ZIP** لأن البيانات لا تلمس القرص مرتين. + +## الخطوة 2 – تحميل مستند HTML الخاص بك + +الآن نقوم بتحميل HTML المصدر إلى `HTMLDocument`. هذه الخطوة بسيطة لكن تستحق ملاحظة سريعة: Aspose.HTML يحل تلقائيًا عناوين URL النسبية بالنسبة لمجلد المستند الأساسي، وهذا هو السبب في أن المعالج المخصص يتلقى الـ URIs الصحيحة. + +```csharp +// Replace with the actual path to your HTML file. +var document = new HTMLDocument(@"C:\MySite\input.html"); +``` + +إذا كان HTML الخاص بك يشير إلى موارد خارجية موجودة خارج المجلد، تأكد من أن تلك الملفات قابلة للوصول؛ وإلا سيتسبب المعالج في رمي `FileNotFoundException`. + +## الخطوة 3 – إعداد Stream إخراج ZIP + +نفتح `FileStream` للأرشيف النهائي وننشئ كائن `ZipHandler` الخاص بنا. هنا يلتقي **c# create zip archive** مع خط أنابيب Aspose. + +```csharp +using var zipStream = new FileStream(@"C:\MySite\output.zip", FileMode.Create); +var zipHandler = new ZipHandler(zipStream); +``` + +**نصيحة احترافية:** ضع `leaveOpen: true` في مُنشئ `ZipArchive` (كما فعلنا في `ZipHandler`) حتى يتمكن بلوك `using` الخارجي من إغلاق الـ stream فقط بعد تفريغ جميع الإدخالات. + +## الخطوة 4 – ربط المعالج بخيارات حفظ Aspose.HTML + +تتيح لك `HTMLSaveOptions` في Aspose.HTML توصيل `ResourceHandler` المخصص. هذا يخبر المحرك باستخدام منطق كتابة ZIP لكل مورد. + +```csharp +var saveOptions = new HTMLSaveOptions +{ + // Direct all resources into the ZipHandler we just created. + OutputStorage = zipHandler +}; +``` + +يمكنك أيضًا تعديل `HTMLSaveOptions` للتحكم في أمور مثل `EmbedImages` (ضعه `false` إذا كنت تفضل إبقاء الصور كإدخالات منفصلة) أو `CompressImages` لتوفير مساحة إضافية. + +## الخطوة 5 – حفظ المستند – اللحظة التي يصبح فيها “كيفية ضغط HTML” حقيقة + +أخيرًا، نستدعي `document.Save(saveOptions)`. ملف HTML نفسه، بالإضافة إلى كل مورد مرتبط، يصبح إدخالات داخل `output.zip`. + +```csharp +document.Save(saveOptions); +``` + +عند خروج بلوك `using`، يُغلق أرشيف ZIP ويصبح جاهزًا للتوزيع. + +### مثال كامل يعمل + +فيما يلي البرنامج الكامل المجمّع من القطع السابقة. انسخه‑الصقه في تطبيق console، عدل مسارات الملفات، وشغّله—سيتم ضغط HTML في خطوة واحدة. + +```csharp +using System; +using System.IO; +using System.IO.Compression; +using Aspose.Html; +using Aspose.Html.Saving; + +class ZipHandler : ResourceHandler +{ + private readonly ZipArchive _zipArchive; + + public ZipHandler(Stream zipStream) => + _zipArchive = new ZipArchive(zipStream, ZipArchiveMode.Create, leaveOpen: true); + + public override Stream HandleResource(ResourceInfo info) + { + string entryName = info.Uri.Segments[^1]; + var entry = _zipArchive.CreateEntry(entryName, CompressionLevel.Optimal); + return entry.Open(); + } + + protected override void Dispose(bool disposing) + { + if (disposing) _zipArchive.Dispose(); + base.Dispose(disposing); + } +} + +class Program +{ + static void Main() + { + // Step 2: Load the source HTML file. + var document = new HTMLDocument(@"C:\MySite\input.html"); + + // Step 3: Create a file stream for the output ZIP package. + using var zipStream = new FileStream(@"C:\MySite\output.zip", FileMode.Create); + var zipHandler = new ZipHandler(zipStream); + + // Step 4: Tell Aspose.HTML to store resources using the custom handler. + var saveOptions = new HTMLSaveOptions { OutputStorage = zipHandler }; + + // Step 5: Save the document; the HTML and its resources are written into the ZIP. + document.Save(saveOptions); + } +} +``` + +**النتيجة المتوقعة:** سيحتوي `output.zip` على `input.html` بالإضافة إلى كل صورة، CSS، وخط تم الإشارة إليه في تلك الصفحة. افتح الـ ZIP، استخرج، وافتح `input.html` في المتصفح؛ يجب أن يُظهر نفس الشكل كما كان، مما يثبت أنك تعلمت **كيفية ضغط HTML** بنجاح. + +![how to zip html example](image.png "Illustration of ZIP archive containing HTML and resources") + +## الاختلافات الشائعة وحالات الحافة + +### 1. ضغط عدة صفحات HTML + +إذا كنت بحاجة إلى تجميع موقع كامل، قم بالتكرار عبر كل ملف `.html`، أنشئ `ZipHandler` منفصل لنفس الأرشيف، وأضف كل مستند مع موارده. احرص فقط على عدم إعادة استخدام نفس كائن `ZipHandler` لعدة استدعاءات `HTMLDocument.Save`—أنشئ معالجًا جديدًا لكل مستند لتجنب تصادم أسماء الإدخالات. + +### 2. التحكم في مستوى الضغط + +`CompressionLevel.Optimal` يوفر توازنًا جيدًا، لكن لمجموعات صور ضخمة قد تفضّل `CompressionLevel.SmallestSize`. وعلى العكس، إذا كانت السرعة أهم من الحجم، فإن `CompressionLevel.Fastest` يقلل من استهلاك المعالج. + +### 3. معالجة أسماء الموارد المكررة + +صفحتان مختلفتان قد تشيران إلى `style.css` موجودين في مجلدات مختلفة. التنفيذ الافتراضي يستخدم الجزء الأخير من الـ URI فقط، ما قد يسبب تعارضًا. لتجنب ذلك، أضف مسارًا نسبيًا للمجلد: + +```csharp +string entryName = Path.Combine(info.Uri.Segments.Skip(1).Select(s => s.Trim('/')).ToArray()); +var entry = _zipArchive.CreateEntry(entryName, CompressionLevel.Optimal); +``` + +### 4. استبعاد ملفات معينة + +أحيانًا لا تريد شحن فيديوهات كبيرة أو سكريبتات تحليلات. داخل `HandleResource`، افحص `info.Uri` وأرجع `Stream.Null` للملفات التي تريد تخطيها. + +```csharp +if (info.Uri.AbsolutePath.EndsWith(".mp4")) + return Stream.Null; // Skip video files +``` + +### 5. التوافق مع .NET Core مقابل .NET Framework + +الكود يعمل دون تعديل على كلا البيئتين لأن `System.IO.Compression` جزء من مكتبة الفئة الأساسية. فقط تأكد من أن نسخة Aspose.HTML التي تستخدمها تستهدف نفس الإطار. + +## نصائح احترافية لحزم ZIP جاهزة للإنتاج + +- **تحقق من الأرشيف** بعد الإنشاء باستخدام وضع القراءة في `ZipArchive` لاكتشاف أي إدخالات تالفة مبكرًا. +- **سجل كل مورد** تقوم بتدفقه؛ هذا يساعد في تتبع الملفات المفقودة عندما يفشل HTML في العرض بعد الاستخراج. +- **عيّن تعليق ZIP** (اختياري) لتخزين بيانات مثل طابع الوقت لإنشاء الأرشيف. +- **استخدم I/O غير متزامن** (`FileStream` مع `useAsync: true`) إذا كنت تعالج مواقع كبيرة في خدمة ويب—هذا يحافظ على سعادة مجموعة الخيوط. + +## الأسئلة المتكررة + +**س: هل يعمل هذا النهج مع الموارد البعيدة (مثل صور CDN)؟** +ج: نعم، Aspose.HTML سيقوم بتحميل الملف البعيد قبل استدعاء `HandleResource`. الـ stream الذي تستقبله يحتوي بالفعل على البايتات التي تم تحميلها، ويمكنك بعدها ضغطها. + +**س: ماذا لو كان HTML يحتوي على صور مشفرة بـ base64؟** +ج: هذه الصور مدمجة بالفعل في شفرة HTML، لذا لا تُستدعى `HandleResource`. سيحتوي الـ ZIP النهائي فقط على ملف HTML، وهذا مقبول تمامًا. + +**س: هل يمكنني تشفير الـ ZIP؟** +ج: `ZipArchive` المدمج لا يدعم التشفير. لذلك ستحتاج إلى مكتبة طرف ثالث (مثل SharpZipLib) ومعالج مخصص يكتب تدفقات مشفرة. + +## الخلاصة + +أصبح لديك الآن إجابة كاملة وجاهزة للإنتاج حول **كيفية ضغط HTML** في C#. من خلال الاستفادة من `ResourceHandler` مخصص، يمكنك **c# create zip archive**، **save html as zip**، وتحقيق **ضغط ZIP أمثل** دون الحاجة للوصول إلى نظام الملفات أكثر من مرة. النمط مرن بما يكفي للتعامل مع مواقع متعددة الصفحات، استثناءات انتقائية، ومخططات تسمية مخصصة—فقط عدل منطق المعالج حسب الحاجة. + +جاهز للخطوة التالية + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/chinese/net/generate-jpg-and-png-images/_index.md b/html/chinese/net/generate-jpg-and-png-images/_index.md index 3a7bc53dc..1b69cf355 100644 --- a/html/chinese/net/generate-jpg-and-png-images/_index.md +++ b/html/chinese/net/generate-jpg-and-png-images/_index.md @@ -45,6 +45,8 @@ Aspose.HTML for .NET 提供了一种将 HTML 转换为图像的简单方法。 了解如何在使用 Aspose.HTML for .NET 将 DOCX 文档转换为 PNG 或 JPG 图像时启用抗锯齿，以提升图像质量。 ### [使用 C# 将 docx 转换为 png 并创建 zip 存档教程](./convert-docx-to-png-create-zip-archive-c-tutorial/) 学习如何使用 C# 将 DOCX 文档转换为 PNG 图像并打包为 ZIP 文件的完整步骤。 +### [使用 C# 从 HTML 创建图像 – 步骤指南](./create-image-from-html-step-by-step-c-guide/) +学习如何使用 C# 将 HTML 渲染为图像的完整步骤，包括设置、渲染选项和保存为 JPG/PNG。 ## 结论 diff --git a/html/chinese/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md b/html/chinese/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md new file mode 100644 index 000000000..1b85f7959 --- /dev/null +++ b/html/chinese/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/_index.md @@ -0,0 +1,243 @@ +--- +category: general +date: 2026-03-07 +description: 在 C# 中快速从 HTML 创建图像——学习设置图像尺寸、将 HTML 渲染为 PNG，并启用字体微调以获得清晰的细小文字。 +draft: false +keywords: +- create image from html +- set image size +- render html to png +- set renderer dimensions +- enable font hinting +language: zh +og_description: 使用 Aspose.Html 从 HTML 创建图像，设置图像尺寸，将 HTML 渲染为 PNG，并启用字体微调以获得清晰的细小文字。 +og_title: 从HTML生成图像 – 完整的C#教程 +tags: +- Aspose.Html +- C# +- Image Rendering +title: 从HTML创建图像 – C# 步骤指南 +url: /zh/net/generate-jpg-and-png-images/create-image-from-html-step-by-step-c-guide/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# 从 HTML 创建图像 – 完整 C# 教程 + +是否曾经需要**从 HTML 创建图像**却不确定该使用哪个 API 调用？你并不孤单——很多开发者在需要为缩略图或 PDF 水印获取一段小字体 PNG 快照时都会卡在这一步。好消息是，使用 Aspose.Html 只需几行代码，你还可以学习如何**设置图像尺寸**、**将 HTML 渲染为 PNG**以及**启用字体微调**（font hinting）以获得晶莹剔透的效果。 + +在本指南中，我们将通过一个真实案例演示：将一个包含 8 像素文字的 `
` 渲染为 400 × 100 PNG。完成后，你将拥有一个可复用的模式，适用于任何 HTML 片段，无论是徽章、邮件头部还是动态图表标签。无需外部工具——只需纯 C# 与 Aspose.Html 库。 + +## 所需环境 + +- **.NET 6+**（或 .NET Framework 4.6.2 及以上）——代码可在任意近期运行时上运行。 +- **Aspose.Html for .NET**——通过 NuGet 安装 (`Install-Package Aspose.Html`)。 +- 基本的 C# 开发环境（Visual Studio、VS Code、Rider——任选其一）。 + +就这些。无需额外字体、COM 互操作，也不需要繁琐的 GDI+ hack。我们开始吧。 + +## 从 HTML 创建图像 – 核心概念 + +在深入代码之前，先明确实现此功能的三个关键部件： + +1. **HTMLDocument** —— 你想要光栅化的标记的内存表示。 +2. **ImageRenderingOptions** —— 用于**设置图像尺寸**并可选**设置渲染器尺寸**；它告诉引擎输出位图的大小。 +3. **TextOptions** —— 子对象，允许你**启用字体微调**，这是一种将字形对齐到像素边界的技术，可在极小字号时显著提升可读性。 + +了解每个部件为何重要，有助于后续微调管线（例如更改 DPI、添加背景或切换为 JPEG）。 + +## 步骤 1：构建 HTML 文档 + +首先需要一个文档，其中包含我们想要转换为图像的标记。这里我们使用一个仅包含极小字体的 `
`。 + +```csharp +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +// Step 1 – create a minimal HTML document +HTMLDocument htmlDoc = new HTMLDocument( + "
Tiny text that needs hinting
" +); +``` + +*为什么重要*：直接将字符串传给 `HTMLDocument` 可以避免处理文件或网络请求。引擎会像浏览器一样解析标记，这意味着 CSS、字体和布局都会被正确尊重。 + +## 步骤 2：启用字体微调 + +在 8 px 的文字渲染时，大多数光栅化器会因为尝试对次像素形状进行抗锯齿而产生模糊的字形。字体微调会强制渲染器将每个字符捕捉到最近的像素网格，从而得到更清晰的效果。 + +```csharp +// Step 2 – configure text rendering options +TextOptions textOptions = new TextOptions +{ + UseHinting = true // Enable font hinting for low‑size text +}; +``` + +*小技巧*：如果以后面向高分辨率显示器，你可以关闭微调并提升 DPI。对于低分辨率缩略图，微调通常是最佳选择。 + +## 步骤 3：设置图像尺寸和渲染器尺寸 + +接下来决定最终 PNG 的大小。这一步既**设置图像尺寸**，也**设置渲染器尺寸**（在 Aspose 中是同一个对象，但概念上是两面硬币）。 + +```csharp +// Step 3 – define rendering options, including size and hinting +ImageRenderingOptions renderingOptions = new ImageRenderingOptions +{ + Width = 400, // Desired width in pixels + Height = 100, // Desired height in pixels + TextOptions = textOptions // Attach the hinting settings +}; +``` + +*为什么重要*：如果省略 `Width`/`Height`，Aspose 会根据内容的自然尺寸来确定画布大小，可能会太小而不符合需求。显式设置两者还能影响布局引擎的视口，确保文字居中显示。 + +## 步骤 4：初始化图像渲染器 + +文档和选项准备好后，创建渲染器。该对象将所有内容串联起来，并准备好光栅化管线。 + +```csharp +// Step 4 – instantiate the renderer with the document and options +using var imageRenderer = new ImageRenderer(htmlDoc, renderingOptions); +``` + +*注意*：`using` 语句确保非托管资源（本机缓冲区、GDI 句柄）及时释放——这对服务器端批处理任务尤为重要。 + +## 步骤 5：渲染并保存 PNG + +最后，调用渲染器绘制页面并将结果写入磁盘。这一步实际执行了**将 HTML 渲染为 PNG**的操作。 + +```csharp +// Step 5 – perform the rendering and write the PNG file +imageRenderer.Render(); // Rasterise the HTML +imageRenderer.Save("output/hinted.png"); // Save as PNG (default format) +``` + +执行后，你会在 `output` 文件夹中看到 `hinted.png`。打开它，你应该能看到经过 **字体微调** 且已 **设置图像尺寸** 的细小文字清晰呈现。 + +### 预期结果 + +| 文件 | 尺寸 | 描述 | +|------|------|------| +| `hinted.png` | 400 × 100 px | 经过微调的 8 px 小文字，清晰且居中。 | + +你可以将 PNG 放入任何 UI 组件、嵌入 PDF，或作为邮件资源使用——无需额外转换步骤。 + +## 高级变体与边缘情况 + +下面列出了一些常见的“如果…怎么办”情形以及快速解决方案。 + +### 为高分辨率输出更改 DPI + +如果需要 2× Retina 级别的图像，调整 `Resolution` 属性： + +```csharp +renderingOptions.Resolution = 144; // 72 dpi × 2 +renderingOptions.Width = 800; // Double the pixel dimensions +renderingOptions.Height = 200; +``` + +相同的 HTML 将以更高的密度光栅化，在高 DPI 屏幕上保持视觉保真度。 + +### 渲染完整 HTML 页面（外部 CSS/JS） + +当标记引用外部样式表或脚本时，向 `HTMLDocument` 构造函数传入基准 URL： + +```csharp +HTMLDocument htmlDoc = new HTMLDocument( + "", + new Uri("file:///C:/MyProject/") // Base path for relative resources +); +``` + +Aspose 将相对于提供的 URI 解析 `styles.css`，从而实现 **将 HTML 渲染为 PNG** 时与浏览器完全相同的外观。 + +### 透明背景 + +默认渲染器使用白色画布。若需透明 PNG（用于叠加），将背景颜色设为 `Color.Transparent`： + +```csharp +renderingOptions.BackgroundColor = System.Drawing.Color.Transparent; +``` + +此时输出的 PNG 将包含 alpha 通道。 + +### 处理多页 + +如果 HTML 超出一页（例如长文章），可以遍历 `imageRenderer.Render(pageNumber)` 并分别保存每页。对缩略图来说很少用到，但在生成多页报告时非常便利。 + +## 完整工作示例 + +将所有步骤整合在一起，下面是一个可直接复制到控制台应用的自包含程序。 + +```csharp +using System; +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +class Program +{ + static void Main() + { + // 1️⃣ Create the HTML document with tiny text + HTMLDocument htmlDoc = new HTMLDocument( + "
Tiny text that needs hinting
" + ); + + // 2️⃣ Enable font hinting for sharper low‑size rendering + TextOptions textOptions = new TextOptions + { + UseHinting = true + }; + + // 3️⃣ Define image size and attach the text options + ImageRenderingOptions renderingOptions = new ImageRenderingOptions + { + Width = 400, + Height = 100, + TextOptions = textOptions, + // Optional: transparent background + // BackgroundColor = System.Drawing.Color.Transparent + }; + + // 4️⃣ Initialise the renderer + using var imageRenderer = new ImageRenderer(htmlDoc, renderingOptions); + + // 5️⃣ Render and save as PNG + imageRenderer.Render(); + imageRenderer.Save("output/hinted.png"); + + Console.WriteLine("✅ Image created: output/hinted.png"); + } +} +``` + +运行程序（`dotnet run`），你会看到确认信息以及一张清晰的 PNG 文件。 + +## 常见陷阱及规避方法 + +| 症状 | 可能原因 | 解决方案 | +|------|----------|----------| +| 文字模糊 | 未启用字体微调或 DPI 太低 | 设置 `UseHinting = true` 或提升 `Resolution`。 | +| 输出图像被截断 | Width/Height 小于内容尺寸 | 增大 `Width`/`Height` 或启用 `AutoFit`（未示例）。 | +| 缺少字体 | 主机机器未安装所需字体 | 使用 `FontSettings` 嵌入字体或全局安装。 | +| PNG 白底白字 | 背景颜色与文字颜色相同 | 更改 `BackgroundColor` 或调整 CSS 颜色。 | + +## 结论 + +我们已经使用 Aspose.Html **从 HTML 创建图像**，演示了如何 **设置图像尺寸**、**将 HTML 渲染为 PNG**、**设置渲染器尺寸**，以及 **启用字体微调** 以呈现细小文字。完整、可运行的示例展示了每一步必需的操作，附带的技巧覆盖了实际项目中最常见的变体。 + +准备好迎接下一个挑战了吗？尝试将 HTML 替换为 SVG 生成的图表，实验不同的 DPI 设置以适配 Retina 显示，或将 PNG 生成集成到 ASP.NET Core 端点，实现即时图片返回。同样的模式可以从单次缩略图扩展到批量处理流水线。 + +如果本教程对你有帮助，请分享、留下你的改进建议，或查阅 Aspose.Html 文档获取更深入的自定义。祝渲染愉快！ + +create image from html example showing tiny text rendered with font hinting + +--- + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/chinese/net/html-extensions-and-conversions/_index.md b/html/chinese/net/html-extensions-and-conversions/_index.md index a6c24babf..8f993e5ac 100644 --- a/html/chinese/net/html-extensions-and-conversions/_index.md +++ b/html/chinese/net/html-extensions-and-conversions/_index.md @@ -39,6 +39,10 @@ Aspose.HTML for .NET 不仅仅是一个库；它是 Web 开发领域的变革者 ## HTML 扩展和转换教程 ### [使用 Aspose.HTML 在 .NET 中将 HTML 转换为 PDF](./convert-html-to-pdf/) 使用 Aspose.HTML for .NET 轻松将 HTML 转换为 PDF。按照我们的分步指南，释放 HTML 到 PDF 转换的强大功能。 + +### [使用 Aspose.HTML 在 C# 中将 HTML 转换为 PDF 教程](./html-to-pdf-tutorial-convert-html-to-pdf-in-c/) +在 C# 中使用 Aspose.HTML 将 HTML 转换为 PDF 的完整分步指南，涵盖代码示例和最佳实践。 + ### [使用 Aspose.HTML 在 .NET 中将 EPUB 转换为图像](./convert-epub-to-image/) 了解如何使用 Aspose.HTML for .NET 将 EPUB 转换为图像。带有代码示例和可自定义选项的分步教程。 ### [使用 Aspose.HTML 在 .NET 中将 EPUB 转换为 PDF](./convert-epub-to-pdf/) diff --git a/html/chinese/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md b/html/chinese/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md new file mode 100644 index 000000000..02283a107 --- /dev/null +++ b/html/chinese/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/_index.md @@ -0,0 +1,268 @@ +--- +category: general +date: 2026-03-07 +description: HTML 转 PDF 教程：学习如何使用 Aspose.Html 在 C# 中将 HTML 生成 PDF。快速、可靠的方式，几分钟内即可将网页转换为 + PDF。 +draft: false +keywords: +- html to pdf tutorial +- generate pdf from html +- create pdf from html +- convert web page pdf +- c# pdf generation +language: zh +og_description: HTML 转 PDF 教程：使用 Aspose.Html 在 C# 中快速将 HTML 生成 PDF。请按照本分步指南将任何网页转换为 + PDF。 +og_title: HTML转PDF教程 – 在C#中将HTML转换为PDF +tags: +- Aspose.Html +- C# +- PDF conversion +title: HTML转PDF教程 – 在C#中将HTML转换为PDF +url: /zh/net/html-extensions-and-conversions/html-to-pdf-tutorial-convert-html-to-pdf-in-c/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# html to pdf 教程 – 在 C# 中将 HTML 转换为 PDF + +是否曾经需要一个 **html to pdf 教程**，但又不想让人摸不着头脑？你并不孤单——许多开发者都会问，*“如何在不抓狂的情况下从 html 生成 pdf？”* 好消息：使用 Aspose.Html，你只需几行代码就能 **create pdf from html**。在本指南中，我们将从安装库到处理边缘情况，逐步讲解你需要的所有内容，让你能够可靠地 **convert web page pdf** 文件，直接在 C# 项目中使用。 + +我们将涵盖： + +* 所需的确切 NuGet 包。 +* 如何安全地设置文件路径。 +* 完成繁重工作的一行代码。 +* 针对大文档、相对资源和异步转换的技巧。 + +完成后，你将拥有一个可直接放入任何 .NET 解决方案并立即生成 PDF 的可运行示例——无需猜测，无需额外工具。 + +## 前提条件 + +在深入之前，请确保你具备以下条件： + +| 需求 | 为什么重要 | +|-------------|----------------| +| .NET 6.0 或更高（API 也支持 .NET Framework 4.6+） | 确保与最新的 Aspose.Html 渲染管线（24.10+）兼容。 | +| Visual Studio 2022（或任何支持 C# 的 IDE） | 使调试转换过程变得轻松。 | +| 首次 NuGet 恢复所需的互联网访问 | Aspose.Html 包从 nuget.org 拉取。 | + +不需要其他第三方库。 + +## 第一步 – 安装 Aspose.Html NuGet 包 + +打开 **Package Manager Console**（Tools → NuGet Package Manager → Package Manager Console）并运行： + +```powershell +Install-Package Aspose.Html -Version 24.10.0 +``` + +> **专业提示：** 如果你针对特定运行时（例如 .NET Core），请添加 `-IncludePrerelease` 标志以获取最新的渲染引擎。24.10+ 系列引入了新管线，能够比旧版本更好地处理现代 CSS 和 JavaScript。 + +## 第二步 – 添加转换命名空间 + +在任何执行转换的 C# 文件中，引入命名空间： + +```csharp +using Aspose.Html.Converters; // <-- This gives you HtmlConverter +``` + +> **为什么重要：** `HtmlConverter` 是封装整个渲染过程的静态类。通过导入它，你可以避免使用完全限定名，使代码更简洁。 + +## 第三步 – 定义源 HTML 和目标 PDF 路径 + +你可以硬编码路径进行快速演示，但在生产环境中通常会从用户输入或配置中获取。以下是构建绝对路径的安全方式： + +```csharp +// Step 3: Build absolute file paths +string baseDir = AppDomain.CurrentDomain.BaseDirectory; +string htmlPath = Path.Combine(baseDir, "input.html"); // <-- your source HTML +string pdfPath = Path.Combine(baseDir, "output.pdf"); // <-- where the PDF lands + +// Verify that the source file exists before we try to convert +if (!File.Exists(htmlPath)) +{ + Console.WriteLine($"⚠️ HTML file not found at {htmlPath}"); + return; +} +``` + +> **边缘情况：** 如果你的 HTML 引用了相对 URL 的图片、CSS 或字体，将 `input.html` 与其资源放在同一文件夹可确保转换器自动解析它们。 + +## 第四步 – 将 HTML 文档转换为 PDF + +现在魔法开始了。`ConvertHtmlToPdf` 方法读取 HTML，使用最新引擎渲染，并一次性写入 PDF 文件。 + +```csharp +try +{ + // Step 4: Perform the conversion (24.10+ rendering pipeline) + HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath); + Console.WriteLine($"✅ PDF successfully created at {pdfPath}"); +} +catch (Exception ex) +{ + // Catch‑all for demo purposes – in real code handle specific exceptions + Console.WriteLine($"❌ Conversion failed: {ex.Message}"); +} +``` + +### 背后发生了什么？ + +* **解析：** Aspose.Html 解析 HTML DOM，应用现代浏览器相同的规则。 +* **布局：** 新的渲染管线（自 24.10 版起可用）使用 CSS Box Model 计算布局，支持 Flexbox、Grid，甚至有限的 JavaScript。 +* **PDF 生成：** 可视化树被光栅化为矢量指令，然后写入 PDF 文件，保留可选择的文本和可搜索的内容。 + +由于 API 为同步调用，它会阻塞直至 PDF 完全写入。如果需要非阻塞行为，Aspose 还提供了异步重载 (`ConvertHtmlToPdfAsync`)——请参见下文 *高级* 部分。 + +## 第五步 – 验证输出 + +快速的完整性检查可以为后续调试节省数小时时间。以编程方式或手动打开生成的文件： + +```csharp +if (File.Exists(pdfPath)) +{ + // Launch the PDF with the default viewer (Windows only) + Process.Start(new ProcessStartInfo(pdfPath) { UseShellExecute = true }); +} +else +{ + Console.WriteLine("⚠️ PDF file was not created."); +} +``` + +如果 PDF 能打开且外观与原始 HTML（字体、图片、布局）保持一致，恭喜——你已成功使用 C# **create pdf from html**。 + +## 高级主题 & 常见变体 + +### 1️⃣ 从字符串或 URL 转换 + +有时你没有实体 `.html` 文件。Aspose 允许你直接提供原始 HTML 或远程 URL： + +```csharp +string htmlContent = "

Hello, PDF!

"; +using (var stream = new MemoryStream(Encoding.UTF8.GetBytes(htmlContent))) +{ + HtmlConverter.ConvertHtmlToPdf(stream, pdfPath); +} +``` + +或直接使用网页地址： + +```csharp +string url = "https://example.com/report"; +HtmlConverter.ConvertUrlToPdf(url, pdfPath); +``` + +### 2️⃣ 高吞吐服务的异步转换 + +如果你正在构建必须并发处理大量请求的 Web API，请使用异步 API： + +```csharp +await HtmlConverter.ConvertHtmlToPdfAsync(htmlPath, pdfPath); +``` + +记得将 ASP.NET 控制器的返回类型配置为 `Task`。 + +### 3️⃣ 处理大文档 + +对于大于 100 MB 的 HTML 文件，请提升默认内存限制： + +```csharp +var options = new HtmlConversionOptions +{ + RenderingEngine = RenderingEngine.WebKit, // optional, but can improve performance + MaxMemoryUsage = 1024 * 1024 * 1024 // 1 GB +}; + +HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath, options); +``` + +### 4️⃣ 添加 PDF 元数据 + +你可以为生成的 PDF 添加标题、作者和关键字： + +```csharp +var pdfSaveOptions = new PdfSaveOptions +{ + DocumentInfo = new DocumentInfo + { + Title = "Monthly Report", + Author = "Your Name", + Keywords = "html to pdf tutorial, generate pdf from html" + } +}; + +HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath, pdfSaveOptions); +``` + +### 5️⃣ 常见陷阱 + +| 症状 | 可能原因 | 解决办法 | +|---------|--------------|-----| +| 图片缺失 | 相对路径指向 HTML 文件夹之外 | 将所有资源放在与 `input.html` 相同的目录，或在 `HtmlLoadOptions` 中设置 `BaseUri`。 | +| 字体显示不同 | 字体未嵌入 | 使用 `PdfSaveOptions.EmbedStandardFonts = true`。 | +| PDF 空白 | HTML 中的脚本阻塞渲染 | 通过 `HtmlLoadOptions.DisableJavaScript = true` 禁用 JavaScript。 | + +## 完整、可直接运行的示例 + +```csharp +using System; +using System.Diagnostics; +using System.IO; +using System.Text; +using Aspose.Html.Converters; +using Aspose.Html.Saving; + +class Program +{ + static void Main() + { + // 1️⃣ Define paths + string baseDir = AppDomain.CurrentDomain.BaseDirectory; + string htmlPath = Path.Combine(baseDir, "input.html"); + string pdfPath = Path.Combine(baseDir, "output.pdf"); + + // 2️⃣ Validate source file + if (!File.Exists(htmlPath)) + { + Console.WriteLine($"⚠️ Cannot find {htmlPath}"); + return; + } + + // 3️⃣ Convert HTML → PDF + try + { + HtmlConverter.ConvertHtmlToPdf(htmlPath, pdfPath); + Console.WriteLine($"✅ PDF created at {pdfPath}"); + } + catch (Exception ex) + { + Console.WriteLine($"❌ Conversion error: {ex.Message}"); + } + + // 4️⃣ Open the result (Windows only) + if (File.Exists(pdfPath)) + { + Process.Start(new ProcessStartInfo(pdfPath) { UseShellExecute = true }); + } + } +} +``` + +将文件保存为 `Program.cs`，在同目录放置 `input.html`，运行 `dotnet run`，即可在同一文件夹看到生成的 PDF。 + +## 结论 + +我们刚刚完成了一个 **html to pdf 教程**，展示了如何使用 Aspose.Html 在 C# 中 **generate pdf from html**。核心步骤——安装包、导入命名空间、指向文件并调用 `HtmlConverter.ConvertHtmlToPdf`——简单易懂，却足以支撑生产工作负载。 + +从这里你可以进一步探索 **create pdf from html** 的额外功能，如元数据、异步处理或自定义渲染选项。如果需要在 Web 服务中即时 **convert web page pdf**，只需将同步调用换成其异步对应即可，轻松搞定。 + +还有关于 **c# pdf generation** 的其他问题吗？也许你对合并多个 PDF 或添加水印感兴趣——这些都是自然的下一步。深入阅读 Aspose 文档，动手实验代码，让库帮你完成繁重工作。祝编码愉快！ + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/chinese/net/rendering-html-documents/_index.md b/html/chinese/net/rendering-html-documents/_index.md index 320ef98cc..d57cdd5d0 100644 --- a/html/chinese/net/rendering-html-documents/_index.md +++ b/html/chinese/net/rendering-html-documents/_index.md @@ -43,6 +43,9 @@ Aspose.HTML for .NET 凭借其丰富的功能、出色的文档和活跃的社 ### [使用 Aspose.HTML 在 .NET 中将 HTML 渲染为 PNG](./render-html-as-png/) 学习使用 Aspose.HTML for .NET：操作 HTML、转换为各种格式等等。深入了解这个全面的教程！ +### [使用 Aspose.Html 在 C# 中创建 HTML 文档并渲染为 PNG](./create-html-document-c-render-to-png-with-aspose-html/) +学习如何在 C# 中使用 Aspose.Html 创建 HTML 文档并将其渲染为高质量 PNG 图像的完整示例。 + ### [如何将 HTML 渲染为 PNG – 完整 C# 指南](./how-to-render-html-as-png-complete-c-guide/) 学习使用 Aspose.HTML for .NET 将 HTML 渲染为 PNG 的完整 C# 示例，涵盖关键步骤和最佳实践。 @@ -66,9 +69,13 @@ Aspose.HTML for .NET 凭借其丰富的功能、出色的文档和活跃的社 ### [使用 Aspose.HTML 在 .NET 中将 SVG 文档渲染为 PNG](./render-svg-doc-as-png/) 解锁 Aspose.HTML for .NET 的强大功能！了解如何轻松将 SVG Doc 渲染为 PNG。深入了解分步示例和常见问题解答。立即开始！ + ### [使用 Aspose.HTML 在 .NET 中从 HTML 创建 PNG – 完整 C# 渲染指南](./create-png-from-html-full-c-rendering-guide/) 完整的 C# 示例，展示如何使用 Aspose.HTML 将 HTML 渲染为 PNG，涵盖所有关键步骤和最佳实践。 +### [如何在 C# 中将 HTML 渲染为 PNG – 完整指南](./how-to-render-html-to-png-in-c-complete-guide/) +学习使用 Aspose.HTML for .NET 在 C# 中将 HTML 渲染为 PNG 的完整步骤和最佳实践。 + {{< /blocks/products/pf/tutorial-page-section >}} {{< /blocks/products/pf/main-container >}} diff --git a/html/chinese/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md b/html/chinese/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md new file mode 100644 index 000000000..0c21426a4 --- /dev/null +++ b/html/chinese/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/_index.md @@ -0,0 +1,190 @@ +--- +category: general +date: 2026-03-07 +description: 快速使用 C# 创建 HTML 文档并将 HTML 渲染为图像（PNG）。学习设置自定义字体、将 HTML 转换为 PNG，并在几步内保存渲染的图像。 +draft: false +keywords: +- create html document c# +- render html to image +- convert html to png +- save rendered image +- set custom font +language: zh +og_description: 使用 Aspose.Html 在 C# 中创建 HTML 文档并将其渲染为 PNG 图像。一步步指南，涵盖自定义字体、转换和保存。 +og_title: 使用 C# 创建 HTML 文档 – 用 Aspose.Html 渲染为 PNG +tags: +- C# +- Aspose.Html +- Image Rendering +title: 创建 HTML 文档 C# – 使用 Aspose.Html 渲染为 PNG +url: /zh/net/rendering-html-documents/create-html-document-c-render-to-png-with-aspose-html/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# 创建 HTML 文档 C# – 使用 Aspose.Html 渲染为 PNG + +是否曾需要 **创建 HTML 文档 C#** 并将其转换为报告或邮件缩略图的图片？你并不孤单。在许多 .NET 项目中，我们经常需要将 HTML 片段即时生成 PNG，而手动操作非常麻烦。 + +本指南将手把手教你如何 **创建 HTML 文档 C#**、**设置自定义字体**、配置渲染、**将 HTML 转换为 PNG**，以及最后 **保存渲染后的图像**——全部使用 Aspose.Html 库。没有神秘操作，只有可以直接复制到项目中的清晰代码。 + +我们将逐步演示每一步，解释每个环节的意义，并覆盖可能遇到的几个边缘情况。完成后，你将拥有一个可复用的方法，接受任意 HTML 字符串并在磁盘上生成清晰的 PNG 文件。 + +## 你需要准备的环境 + +- .NET 6.0 或更高版本（代码同样适用于 .NET Framework 4.6+） +- Aspose.Html for .NET（可通过 NuGet `Aspose.Html.NET` 获取） +- 对 C# 与 async/await 有基本了解（可选，但有帮助） + +如果你已经具备上述条件，下面开始吧。 + +## 第一步 – 创建 HTML 文档 C# + +首先我们实例化一个 `HTMLDocument` 对象，用来保存待渲染的标记。把它想象成画布；没有它，就没有可绘制的内容。 + +```csharp +using Aspose.Html; +using Aspose.Html.Drawing; +using Aspose.Html.Rendering.Image; + +// Step 1: Create an HTML document with simple content +var html = "

Hello, world!

"; +var htmlDocument = new HTMLDocument(html); +``` + +> **为什么重要：** `HTMLDocument` 会解析字符串并构建 DOM。之后你可以在渲染前向其中注入 CSS、脚本或外部资源。 + +## 第二步 – 设置自定义字体 + +如果你的设计需要特定的字体——比如 Arial 粗斜体 24 pt——就必须告诉渲染器。这时 **设置自定义字体** 就派上用场了。 + +```csharp +// Step 2: Define a font (Arial, 24pt) with bold and italic styles +var titleFontInfo = new FontInfo("Arial", 24) +{ + Style = WebFontStyle.Bold | WebFontStyle.Italic +}; +``` + +> **小技巧：** Aspose.Html 会使用系统已安装的字体。如果需要使用网页字体，只需在渲染前的 `