البرمجة

التنقل بين الصفحات في Xamarin

جدول المحتوى

التنقل بين الصفحات في Xamarin.Forms: دليل شامل وموسع

يُعتبر التنقل بين الصفحات من أهم العناصر التي تعتمد عليها تطبيقات الهواتف المحمولة لتوفير تجربة مستخدم سلسة ومنظمة. في بيئة تطوير التطبيقات عبر منصة Xamarin.Forms، التي تتيح بناء تطبيقات متعددة المنصات (Android وiOS وUWP) باستخدام لغة #C وXAML، يمثل التنقل بين الصفحات عنصرًا جوهريًا لبناء التطبيقات الحديثة. في هذا المقال، سوف نتناول بالتفصيل جميع الجوانب المتعلقة بالتنقل بين الصفحات في Xamarin.Forms، مع شرح واسع لمختلف التقنيات، الطرق، الأدوات، وأفضل الممارسات المستخدمة لتحقيق تجربة تنقل سلسة وفعالة داخل التطبيق.


مقدمة حول Xamarin.Forms والتنقل بين الصفحات

Xamarin.Forms هي إطار عمل مفتوح المصدر من مايكروسوفت، صُمم لتطوير تطبيقات الهواتف الذكية عبر كتابة قاعدة شفرة واحدة بلغة #C، بحيث يمكن تشغيلها على أنظمة التشغيل الرئيسية مثل Android وiOS وWindows. تعتمد معظم التطبيقات على واجهات متعددة صفحات، حيث يتنقل المستخدم بين هذه الصفحات لإتمام مهام معينة أو عرض محتوى متنوع. لذلك، تعد آلية التنقل (Navigation) بين الصفحات في Xamarin.Forms من اللبنات الأساسية لبناء تجربة مستخدم متكاملة.


المفاهيم الأساسية للتنقل بين الصفحات في Xamarin.Forms

في Xamarin.Forms، كل صفحة (Page) تمثل واجهة مستخدم مستقلة. هناك عدة أنواع من الصفحات، أشهرها:

  • ContentPage: الصفحة الأكثر استخدامًا، تعرض محتوى واحدًا.

  • NavigationPage: صفحة تحوي صفحات أخرى ضمن كومة (stack) تسمح بالتنقل عبر زر “العودة”.

  • TabbedPage: صفحة تعرض علامات تبويب للتنقل بين صفحات متعددة.

  • MasterDetailPage (المعروفة أيضًا بـ FlyoutPage): توفر تنقلًا جانبيًا عبر قائمة.

  • Shell: هيكل تنقل حديث يقدم بنية مدمجة ومتقدمة للتحكم بالتنقل والتنقل بين الصفحات.

التنقل الأساسي بين الصفحات

يتم التنقل بين الصفحات باستخدام واجهة برمجية (API) خاصة بالتنقل، تتم عبر كائن Navigation المتاح في صفحات Xamarin.Forms. التنقل الأساسي هو الدفع (Push) والعودة (Pop) في كومة الصفحات.

  • PushAsync: لإضافة صفحة جديدة فوق كومة التنقل.

  • PopAsync: لإزالة الصفحة العلوية والعودة للصفحة السابقة.


استخدام NavigationPage لبناء التنقل التقليدي

يُعد NavigationPage العنصر الأساسي للتنقل بين الصفحات في Xamarin.Forms. عند إنشاء تطبيق يحتوي على عدة صفحات، من الأفضل أن تبدأ بصفحة NavigationPage كجذر (Root) ليتيح التنقل من خلاله.

مثال عملي على NavigationPage

csharp
// إنشاء الصفحة الرئيسية مع NavigationPage public App() { InitializeComponent(); MainPage = new NavigationPage(new HomePage()); }

التنقل من صفحة إلى أخرى

داخل أي صفحة، يمكن التنقل إلى صفحة أخرى عبر:

csharp
await Navigation.PushAsync(new DetailPage());

ولتعود إلى الصفحة السابقة:

csharp
await Navigation.PopAsync();

إدارة كومة الصفحات

كومة التنقل في NavigationPage هي هيكل بيانات شبيه بالقائمة، يدفع ويخرج الصفحات بطريقة منظمة للحفاظ على الترتيب.


التعامل مع التنقل غير المتزامن (Asynchronous)

تتم معظم عمليات التنقل في Xamarin.Forms عبر أساليب غير متزامنة (async) لعدم حظر واجهة المستخدم وللحفاظ على سلاسة الأداء. لذلك من المهم دائمًا استخدام كلمة await مع عمليات PushAsync وPopAsync:

csharp
await Navigation.PushAsync(new SomePage());

هذا يسمح للنظام بإدارة الانتقالات بسلاسة ودون تجمد الواجهة.


أنواع التنقل المختلفة في Xamarin.Forms

التنقل القائم على NavigationPage (التنقل الهرمي)

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

التنقل القائم على TabbedPage (التنقل عبر علامات التبويب)

يستخدم هذا النوع لتقسيم المحتوى إلى أقسام مختلفة يمكن للمستخدم التبديل بينها بسهولة.

csharp
public class MyTabbedPage : TabbedPage { public MyTabbedPage() { Children.Add(new HomePage()); Children.Add(new SettingsPage()); Children.Add(new ProfilePage()); } }

التنقل عبر MasterDetailPage أو FlyoutPage (القائمة الجانبية)

توفر هذه الصفحة نموذجًا يحتوي على قائمة جانبية (Drawer) تسمح بالتنقل بين أقسام متعددة للتطبيق:

csharp
public class MyMasterDetailPage : MasterDetailPage { public MyMasterDetailPage() { Master = new MenuPage(); Detail = new NavigationPage(new HomePage()); } }

التنقل باستخدام Shell

يعتبر Shell أحدث طريقة للتنقل في Xamarin.Forms، حيث يقدم بنية موحدة لتنظيم الصفحات، مع دعم للتنقل الهيكلي، القوائم، وعلامات التبويب بسهولة.

مثال على إنشاء Shell:

xml
<Shell> <TabBar> <ShellContent Title="Home" ContentTemplate="{DataTemplate local:HomePage}" /> <ShellContent Title="Settings" ContentTemplate="{DataTemplate local:SettingsPage}" /> TabBar> Shell>

والتنقل عبر:

csharp
await Shell.Current.GoToAsync("settings");

إدارة التنقل المتقدم: تمرير البيانات بين الصفحات

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

تمرير البيانات عبر المُنشئ (Constructor)

أسهل الطرق هي تمرير البيانات مباشرة عبر منشئ الصفحة:

csharp
public class DetailPage : ContentPage { public DetailPage(string itemId) { InitializeComponent(); LoadItem(itemId); } }

عند التنقل:

csharp
await Navigation.PushAsync(new DetailPage("123"));

استخدام خاصية BindingContext

يمكن تعيين نموذج بيانات (ViewModel) للصفحة الجديدة ونقل البيانات من خلاله:

csharp
var detailPage = new DetailPage(); detailPage.BindingContext = new DetailViewModel(item); await Navigation.PushAsync(detailPage);

استخدام MessagingCenter

طريقة أخرى للتواصل بين الصفحات أو المكونات هي استخدام MessagingCenter لإرسال رسائل وتنفيذ إجراءات معينة عند استقبالها.


التحكم بالتنقل البرمجي وإدارة الحالة

تعتبر إدارة التنقل من حيث الحالة والتدفق داخل التطبيق من العناصر المهمة خاصة في التطبيقات المعقدة.

التنقل المشروط

يمكن برمجة التنقل بحيث يعتمد على شروط معينة:

csharp
if (userIsLoggedIn) { await Navigation.PushAsync(new DashboardPage()); } else { await Navigation.PushAsync(new LoginPage()); }

إعادة تعيين كومة التنقل

في بعض الأحيان، يرغب المطور في مسح كومة التنقل الحالية وإعادة بناء كومة جديدة، خاصة بعد تسجيل الدخول أو تسجيل الخروج:

csharp
Application.Current.MainPage = new NavigationPage(new HomePage());

أو

csharp
await Navigation.PopToRootAsync();

التعامل مع التنقل في تطبيقات MVVM

في بيئة MVVM (Model-View-ViewModel)، ينصح بفصل منطق التنقل عن الواجهة الرسومية (View) إلى طبقة ViewModel. توجد عدة طرق لتنفيذ ذلك:

  • استخدام خدمات التنقل (INavigationService) التي تُحقن في ViewModel.

  • الاعتماد على إطار عمل مثل Prism أو MVVMCross التي تقدم خدمات مدمجة لإدارة التنقل.

مثال بسيط لخدمة التنقل:

csharp
public interface INavigationService { Task NavigateToAsync<TViewModel>(); Task GoBackAsync(); }

ويمكن استدعاء هذه الخدمة من داخل ViewModel لتنفيذ التنقل بدون الاعتماد المباشر على كائن Navigation.


تأثير التنقل على أداء التطبيق وتجربة المستخدم

التنقل السلس والمباشر يؤثر بشكل كبير على انطباع المستخدم تجاه التطبيق. لذلك يجب:

  • تقليل عدد العمليات الثقيلة عند التنقل.

  • تجنب إعادة تحميل البيانات غير الضرورية في كل مرة يتم فيها عرض الصفحة.

  • استخدام تقنيات التخزين المؤقت (caching) عند الحاجة.

  • تقليل زمن تحميل الصفحات بتقسيم البيانات واستخدام التحميل التدريجي (Lazy Loading).


معالجة التنقل في حالة العودة (Back Navigation)

تدعم أنظمة التشغيل زر العودة (Back Button) سواء المادي أو البرمجي. في Xamarin.Forms:

  • عند استخدام NavigationPage، زر العودة يعيد الصفحة السابقة تلقائيًا.

  • يمكن التحكم في سلوك زر العودة عبر تجاوز الدالة OnBackButtonPressed في الصفحة.

csharp
protected override bool OnBackButtonPressed() { // التحكم في ما يحدث عند الضغط على زر العودة // إرجاع true لمنع العودة، false للسماح بها return true; }

دمج التنقل مع الرسوميات والتحولات (Animations)

Xamarin.Forms يدعم التنقل مع تحولات بصرية مدمجة في PushAsync وPopAsync. يمكن أيضًا إنشاء تأثيرات انتقال مخصصة باستخدام مكتبات خارجية أو التحكم بالرسوميات عبر Renderers مخصصة.


جدول توضيحي لأنواع التنقل الرئيسية في Xamarin.Forms

نوع الصفحة الوصف الاستخدام الشائع طريقة التنقل
ContentPage صفحة عرض واحدة معظم محتوى التطبيق PushAsync / PopAsync
NavigationPage كومة من الصفحات مع زر العودة التطبيقات ذات التنقل الهرمي PushAsync / PopAsync
TabbedPage صفحات بعلامات تبويب التطبيقات متعددة الأقسام التبديل بين علامات التبويب
MasterDetailPage قائمة جانبية + صفحة تفصيلية تطبيقات بها قائمة تنقل جانبية تغيير Detail
Shell هيكل تنقل متكامل حديث تطبيقات معقدة تحتاج تنقل موحد وسهل GoToAsync

ملاحظات ختامية حول التنقل في Xamarin.Forms

يجب مراعاة تحديث Xamarin.Forms بانتظام للاستفادة من تحسينات التنقل الجديدة، كما أن فهم آليات التنقل العميقة يفتح المجال لبناء تطبيقات أكثر قوة ومرونة. التعامل مع التنقل في بيئة Xamarin.Forms يتطلب اهتمامًا دقيقًا ببنية التطبيق، إدارة الحالة، وتجربة المستخدم لضمان تنقل سلس وفعال.


المصادر والمراجع

  1. Official Microsoft Documentation – Xamarin.Forms Navigation:

    https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/navigation/

  2. Xamarin.Forms Shell Documentation:

    https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/shell/


هذا المقال يقدم نظرة موسعة وعميقة عن التنقل بين الصفحات في Xamarin.Forms من خلال شرح شامل لكل الطرق والآليات، مع أمثلة تطبيقية توضح كيفية الاستخدام الأمثل لكل نوع من أنواع التنقل.