AvaloniaUI: ميزات في مثال MessageBox

Avalonia ui هو إطار مبهج تريد العودة إليه مرارًا وتكرارًا. لذلك دعونا نعود إليها مرة أخرى وننظر في بعض الميزات مع صندوق الرسائل الخاص بي.



من هو أفالونيا؟


Avalonia هو إطار عمل متعدد المنصات يسمح لك بتطوير واجهات رسومية على جميع المنصات ذات الصلة.

في هيكلها ، أنها قريبة بشكل لا يصدق من wpf: xaml مماثلة ، المجلدات المماثلة. هناك حتى برنامج تعليمي رسمي لمطوري wpf.

تتميز Avalonia بحقيقة أنها تشير في كل نظام إلى الواجهات الأصلية: Win32 و MonoMac و X11 ...

ما ظهر في النسخة المحدثة
  1. دعم 13 الرموز رسالة مختلفة.
  2. القدرة على نسخ نص الرسالة باستخدام تركيبة المفاتيح Cntrl + C.
  3. ضبط حجم النافذة لمحتوياتها.
  4. نظام أسلوب مبسط يسمح لأولئك الذين يرغبون في الانضمام بسهولة في تطوير ودعم أنظمة جديدة.
  5. استبدال TextBlock بـ TextBox ، يمكن الآن تحديد النص الموجود في النافذة.
  6. تم إعادة تصميم الهيكل بالكامل.



الوثائق يمكن الاطلاع على gitlab .

الحزمة نفسها يمكن تحميلها من nuget .

دعونا نتحدث عن الميزات ورقائق أفالونيا


من الواضح ، إذا كانت هناك مقارنات ، فسيتم مقارنتها بـ wpf.

أول ما يلفت انتباهك بعد أطر عمل ms هو القدرة على ربط الأوامر بالطرق. نعم ، من الناحية الوظيفية ، يوفر هذا عددًا أقل من الفرص ، لكن في المقابل يبسط النهج لتطوير نموذج العرض.

<Button Command="{Binding RunTheThing}" CommandParameter="Hello World"> Do the thing! </Button> 

 public void RunTheThing(string parameter) { // Code for executing the command here. } 

تم تصميم Avalonia أيضًا باستخدام ملحقات تفاعلية ، والتي تتيح لك العمل مع أحداث الإطار ككائنات من الفئة الأولى باستخدام بناء الجملة التصميمية لاستعلامات LINQ - مما يتيح لك كتابة تعليمات برمجية موجزة وقابلة للقراءة.

لكن مع التقدم قليلاً ، يصبح كل شيء غير وردي للغاية ، ولم يتم وضع الوثائق بعد في الاعتبار (ولكن يمكنك المساعدة).

ملزمة للصورة


كانت المشكلة التي قابلتها فورًا عند تحديث مشروعي هي كيفية عرض الصور على نافذتي.

بادئ ذي بدء ، تحتاج إلى تسجيل دليل مع الصور كمورد Avalonia ، لأنه من المهم أن يعرض أي مستخدم الأيقونات ويحزمها بكل رمز.

  <ItemGroup> ... <AvaloniaResource Include="Assets\*" /> </ItemGroup> 

الآن في علامة الصورة ، يمكنك بسهولة تعيين الصورة المحددة.

 <Image Source="/Assets/error.ico" /> 

ولكن عند استخدام vm Source ، لا يمكن إرفاق الصور ببساطة بسلسلة ، ولكن يجب استخدام الصورة النقطية.

 <Image Source="{Binding ImagePath}" /> 

  public Bitmap ImagePath { get; private set; } 

وبناءً عليه ، نحتاج الآن إلى استخراج صورتنا من الموارد. لماذا استخدام محدد موقع أفالونيا؟

 ImagePath = new Bitmap(AvaloniaLocator.Current.GetService<IAssetLoader>() .Open(new Uri($" avares://ASSEMBLYNAME/relative/project/path/{ImageName}.ico"))); 

تجدر الإشارة إلى أنه بالنسبة للموارد المضمنة عند تجميع uri ، يتم استخدام resm res بادئة // // ولأفالونيا - avares: // .

رسم


الأشكال في avalonia و wpf متشابهة ، لكن الخصائص العامة مختلفة. لذلك ، قم بتنزيل صور svg وتحويلها باستخدام mskam إلى ms xaml ، ولا يمكن استخدامها على الفور.

شخصية مخصصة

 <PathGeometry Figures="M30 53 C15.641 53 4 41.359 4 27S15.641 1 30 1s26 11.641 26 26c0 7.135-2.874 13.599-7.528 18.297" FillRule="NonZero"/> 

يتحول إلى:

 <GeometryDrawing Brush="#FF50C8EF" Geometry="M30 53 C15.641 53 4 41.359 4 27S15.641 1 30 1s26 11.641 26 26c0 7.135-2.874 13.599-7.528 18.297" /> 

خط:

 <Line X1="25" Y1="37" X2="25" Y2="39" StrokeThickness="2" Stroke="#FFFFFFFF" StrokeMiterLimit="10" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/> 

يتحول إلى:

 <Line StartPoint="25,37" EndPoint="25,39" StrokeThickness="2" Stroke="#FFFFFFFF" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/> 

الأنماط


حول الأنماط نفسها بما فيه الكفاية يقال في الوثائق . تجدر الإشارة إلى أن هذه الأساليب مألوفة مع المغلق قليلا. أردت أن أوضح كيفية تطبيق النمط من ملف منفصل. أولاً ، يجب أن تكون جميع ملفات xaml موارد avalonia.

 <ItemGroup> <AvaloniaResource Include="**\*.xaml"> <SubType>Designer</SubType> </AvaloniaResource> ..... </ItemGroup> 

ثانياً ، يتم تطبيق الأنماط بالطريقة نفسها التي تستخدم بها موارد الصورة باستخدام uri و locator.

 YourControl.Styles.Add(new StyleInclude(new Uri("avares://ASSEMBLYNAME/relative/project/path.xaml")){Source = new Uri("avares://ASSEMBLYNAME/relative/project/path.xaml")}); 

أشياء صغيرة لطيفة


TextBox لديه خاصية العلامة المائية. يتيح لك هذا عدم البحث عن حزم الجهات الخارجية وعدم حظر TextBlock أعلى TextBox ، والتي يمكن قراءتها في العديد من البرامج التعليمية لـ wpf.

 <TextBox Watermark="Street address" /> 

وأيضًا ، تستخدم جميع المجلدات الروابط PropertyChanged افتراضيًا لتشغيل تحديث خاصية مرتبطة.

في الختام


أقترح الجميع لتجربة هذا الإطار المثير للاهتمام. شكرًا لمستخدمي Artyom Gorchakov و Nikita Tsukanov .

وأذكرك أن أفالونيا تحظى بدعم دافئ ومذهل في Gitter.

Source: https://habr.com/ru/post/ar455896/


All Articles