التنقل بين الصفحات في 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());
}
التنقل من صفحة إلى أخرى
داخل أي صفحة، يمكن التنقل إلى صفحة أخرى عبر:
csharpawait Navigation.PushAsync(new DetailPage());
ولتعود إلى الصفحة السابقة:
csharpawait Navigation.PopAsync();
إدارة كومة الصفحات
كومة التنقل في NavigationPage هي هيكل بيانات شبيه بالقائمة، يدفع ويخرج الصفحات بطريقة منظمة للحفاظ على الترتيب.
التعامل مع التنقل غير المتزامن (Asynchronous)
تتم معظم عمليات التنقل في Xamarin.Forms عبر أساليب غير متزامنة (async) لعدم حظر واجهة المستخدم وللحفاظ على سلاسة الأداء. لذلك من المهم دائمًا استخدام كلمة await مع عمليات PushAsync وPopAsync:
csharpawait Navigation.PushAsync(new SomePage());
هذا يسمح للنظام بإدارة الانتقالات بسلاسة ودون تجمد الواجهة.
أنواع التنقل المختلفة في Xamarin.Forms
التنقل القائم على NavigationPage (التنقل الهرمي)
كما ذكرنا، يستخدم هذا التنقل كومة من الصفحات. هذا النوع من التنقل شائع في التطبيقات التي تعتمد التسلسل الهرمي للمعلومات، مثل التطبيقات الإخبارية أو تطبيقات التجارة الإلكترونية.
التنقل القائم على TabbedPage (التنقل عبر علامات التبويب)
يستخدم هذا النوع لتقسيم المحتوى إلى أقسام مختلفة يمكن للمستخدم التبديل بينها بسهولة.
csharppublic class MyTabbedPage : TabbedPage
{
public MyTabbedPage()
{
Children.Add(new HomePage());
Children.Add(new SettingsPage());
Children.Add(new ProfilePage());
}
}
التنقل عبر MasterDetailPage أو FlyoutPage (القائمة الجانبية)
توفر هذه الصفحة نموذجًا يحتوي على قائمة جانبية (Drawer) تسمح بالتنقل بين أقسام متعددة للتطبيق:
csharppublic 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>
والتنقل عبر:
csharpawait Shell.Current.GoToAsync("settings");
إدارة التنقل المتقدم: تمرير البيانات بين الصفحات
في كثير من التطبيقات، يحتاج المطور إلى إرسال بيانات من صفحة إلى أخرى عند التنقل. هناك عدة طرق لفعل ذلك:
تمرير البيانات عبر المُنشئ (Constructor)
أسهل الطرق هي تمرير البيانات مباشرة عبر منشئ الصفحة:
csharppublic class DetailPage : ContentPage
{
public DetailPage(string itemId)
{
InitializeComponent();
LoadItem(itemId);
}
}
عند التنقل:
csharpawait Navigation.PushAsync(new DetailPage("123"));
استخدام خاصية BindingContext
يمكن تعيين نموذج بيانات (ViewModel) للصفحة الجديدة ونقل البيانات من خلاله:
csharpvar detailPage = new DetailPage();
detailPage.BindingContext = new DetailViewModel(item);
await Navigation.PushAsync(detailPage);
استخدام MessagingCenter
طريقة أخرى للتواصل بين الصفحات أو المكونات هي استخدام MessagingCenter لإرسال رسائل وتنفيذ إجراءات معينة عند استقبالها.
التحكم بالتنقل البرمجي وإدارة الحالة
تعتبر إدارة التنقل من حيث الحالة والتدفق داخل التطبيق من العناصر المهمة خاصة في التطبيقات المعقدة.
التنقل المشروط
يمكن برمجة التنقل بحيث يعتمد على شروط معينة:
csharpif (userIsLoggedIn)
{
await Navigation.PushAsync(new DashboardPage());
}
else
{
await Navigation.PushAsync(new LoginPage());
}
إعادة تعيين كومة التنقل
في بعض الأحيان، يرغب المطور في مسح كومة التنقل الحالية وإعادة بناء كومة جديدة، خاصة بعد تسجيل الدخول أو تسجيل الخروج:
csharpApplication.Current.MainPage = new NavigationPage(new HomePage());
أو
csharpawait Navigation.PopToRootAsync();
التعامل مع التنقل في تطبيقات MVVM
في بيئة MVVM (Model-View-ViewModel)، ينصح بفصل منطق التنقل عن الواجهة الرسومية (View) إلى طبقة ViewModel. توجد عدة طرق لتنفيذ ذلك:
-
استخدام خدمات التنقل (INavigationService) التي تُحقن في ViewModel.
-
الاعتماد على إطار عمل مثل Prism أو MVVMCross التي تقدم خدمات مدمجة لإدارة التنقل.
مثال بسيط لخدمة التنقل:
csharppublic interface INavigationService
{
Task NavigateToAsync<TViewModel>();
Task GoBackAsync();
}
ويمكن استدعاء هذه الخدمة من داخل ViewModel لتنفيذ التنقل بدون الاعتماد المباشر على كائن Navigation.
تأثير التنقل على أداء التطبيق وتجربة المستخدم
التنقل السلس والمباشر يؤثر بشكل كبير على انطباع المستخدم تجاه التطبيق. لذلك يجب:
-
تقليل عدد العمليات الثقيلة عند التنقل.
-
تجنب إعادة تحميل البيانات غير الضرورية في كل مرة يتم فيها عرض الصفحة.
-
استخدام تقنيات التخزين المؤقت (caching) عند الحاجة.
-
تقليل زمن تحميل الصفحات بتقسيم البيانات واستخدام التحميل التدريجي (Lazy Loading).
معالجة التنقل في حالة العودة (Back Navigation)
تدعم أنظمة التشغيل زر العودة (Back Button) سواء المادي أو البرمجي. في Xamarin.Forms:
-
عند استخدام NavigationPage، زر العودة يعيد الصفحة السابقة تلقائيًا.
-
يمكن التحكم في سلوك زر العودة عبر تجاوز الدالة
OnBackButtonPressedفي الصفحة.
csharpprotected 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 يتطلب اهتمامًا دقيقًا ببنية التطبيق، إدارة الحالة، وتجربة المستخدم لضمان تنقل سلس وفعال.
المصادر والمراجع
-
Official Microsoft Documentation – Xamarin.Forms Navigation:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/navigation/ -
Xamarin.Forms Shell Documentation:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/shell/
هذا المقال يقدم نظرة موسعة وعميقة عن التنقل بين الصفحات في Xamarin.Forms من خلال شرح شامل لكل الطرق والآليات، مع أمثلة تطبيقية توضح كيفية الاستخدام الأمثل لكل نوع من أنواع التنقل.

