تتوسّع أجهزة Android بسلاسة لتشمل الشاشات المتصلة

يسرّنا الإعلان عن إنجاز كبير في تقريب الحوسبة على الأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي على Android، فقد أصبحت ميزة دعم الشاشات المتصلة متاحة للجميع مع إصدار Android 16 QPR3!

كما تبيّن في Google I/O 2025، تتيح الشاشات المتصلة للمستخدمين ربط أجهزة Android بشاشة خارجية والوصول على الفور إلى بيئة عرض في نافذة على سطح المكتب. يمكن استخدام التطبيقات في نوافذ حرة أو مكبّرة، ويمكن للمستخدمين تنفيذ مهام متعددة تمامًا كما يفعلون على نظام تشغيل سطح المكتب.

تعاونت Google وSamsung لتقديم تجربة عرض في نافذة على سطح المكتب سلسة وفعّالة على الأجهزة التي تعمل بنظام Android 16 في المنظومة المتكاملة لنظام Android عند توصيلها بشاشة خارجية.
أصبحت هذه الميزة متاحة الآن للجميع على الأجهزة المتوافقة* للمستخدمين الذين يمكنهم توصيل هواتف Pixel وSamsung المتوافقة بشاشات خارجية، ما يتيح فرصًا جديدة لإنشاء تجارب تطبيقات أكثر جاذبية وإنتاجية تتكيّف مع مختلف أشكال الأجهزة.

كيف تعمل هذه الميزة؟

عند توصيل هاتف Android متوافق أو جهاز قابل للطي بشاشة خارجية، تبدأ جلسة سطح مكتب جديدة على الشاشة المتصلة.

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

هاتف متصل بشاشة خارجية مع جلسة سطح مكتب على الشاشة، بينما يحتفظ الهاتف بحالته الخاصة

عند توصيل جهاز يدعم العرض في نافذة على سطح المكتب (مثل جهاز لوحي مثل Samsung Galaxy Tab S11) بشاشة خارجية، يتم توسيع جلسة سطح المكتب على كلتا الشاشتين، ما يتيح مساحة عمل أكبر. تعمل الشاشتان بعد ذلك كنظام واحد مستمر، ما يسمح بنقل نوافذ التطبيقات والمحتوى والمؤشر بحرية بين الشاشتين.

جهاز لوحي متصل بشاشة خارجية، ما يؤدي إلى توسيع جلسة سطح المكتب على كلتا الشاشتين

ما أهمية ذلك؟

في إصدار Android 16 QPR3، وضعنا اللمسات الأخيرة على سلوكيات العرض في نافذة وتفاعلات شريط المهام وتوافق أساليب الإدخال (الماوس ولوحة المفاتيح) التي تحدّد تجربة الشاشة المتصلة. أدرجنا أيضًا طرقًا لضمان التوافق لتغيير حجم النوافذ وتجنُّب إعادة تشغيل التطبيقات عند التبديل بين الشاشات.

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

على وجه الخصوص، انتبه إلى أفضل الممارسات الرئيسية التالية للحصول على تجارب تطبيقات مثالية على الشاشات المتصلة:

• لا تفترض وجود عنصر Display ثابت: يمكن أن يتغيّر عنصر Display المرتبط بسياق تطبيقك عند نقل نافذة التطبيق إلى شاشة خارجية أو إذا تغيّرت إعدادات الشاشة. يجب أن يتعامل تطبيقك بسلاسة مع أحداث تغيير الإعدادات وأن يستعلم عن مقاييس الشاشة بشكلٍ ديناميكي بدلاً من تخزينها مؤقتًا.
• ضَع في الاعتبارتغييرات إعدادات الكثافة: يمكن أن يكون للشاشات الخارجية كثافات بكسل مختلفة تمامًا عن شاشة الجهاز الرئيسية. تأكَّد من أنّ تنسيقاتك ومواردك تتكيّف بشكلٍ صحيح مع هذه التغييرات للحفاظ على وضوح واجهة المستخدم وسهولة استخدامها. استخدِم وحدات البكسل غير المرتبطة بالكثافة (dp) للتنسيقات، وقدِّم موارد خاصة بالكثافة، وتأكَّد من أنّ واجهة المستخدم تتغيّر حجمها بشكلٍ مناسب.
• يمكنك دعم الأجهزة الطرفية الخارجية بشكلٍ صحيح: عندما يتصل المستخدمون بشاشة خارجية، غالبًا ما ينشئون بيئة تشبه سطح المكتب أكثر. ويشمل ذلك غالبًا استخدام لوحات المفاتيح الخارجية والفئران ولوحات التتبّع وكاميرات الويب والميكروفونات ومكبّرات الصوت. حسِّن دعم تفاعلات لوحة المفاتيح و الماوس.

الاستعداد لمستقبل سطح المكتب باستخدام أدوات حديثة

نقدّم عدة أدوات لمساعدتك في إنشاء تجربة سطح المكتب. لنلخّص آخر التعديلات على مكتباتنا التكيّفية الأساسية.

فئات جديدة لأحجام النوافذ: كبيرة وكبيرة جدًا

أهم تعديل في Jetpack WindowManager 1.5.0 هو إضافة فئتَين جديدتَين لأحجام النوافذ حسب العرض: كبيرة وكبيرة جدًا.

فئات أحجام النوافذ هي مجموعة نقاط توقف رسمية ومحدّدة لوجهات العرض تساعدك في تصميم وتطوير تنسيقات تكيّفية. مع الإصدار 1.5.0، نوسّع هذه الإرشادات لتشمل الشاشات التي تتجاوز حجم الأجهزة اللوحية العادية.

في ما يلي نقاط التوقف الجديدة حسب العرض:

• كبيرة: للعروض بين 1200dp و1600dp
• كبيرة جدًا: للعروض ≥1600dp

فئات أحجام النوافذ المختلفة استنادًا إلى عرض الشاشة

على مساحات العرض الكبيرة جدًا، لا يكون مجرد تغيير حجم تنسيق موسّع لجهاز لوحي هو أفضل تجربة للمستخدم دائمًا. على سبيل المثال، قد يعرض برنامج البريد الإلكتروني بشكلٍ مريح لوحتَين (صندوق بريد ورسالة) في فئة حجم النافذة "موسّع". ولكن على شاشة كمبيوتر مكتبي كبيرة جدًا، يمكن لبرنامج بريد إلكتروني عرض ثلاث لوحات أو حتى أربع لوحات بشكلٍ أنيق، ربما صندوق بريد إلكتروني وقائمة رسائل ومحتوى الرسالة الكامل ولوحة تقويم/مهام، كل ذلك في وقت واحد.

لتضمين فئات أحجام النوافذ الجديدة في مشروعك، ما عليك سوى استدعاء الدالة من مجموعة WindowSizeClass.BREAKPOINTS_V2 بدلاً من WindowSizeClass.BREAKPOINTS_V1:

val currentWindowMetrics =
    WindowMetricsCalculator.getOrCreate()
    .computeCurrentWindowMetrics(LocalContext.current)

val sizeClass = WindowSizeClass.BREAKPOINTS_V2
    .computeWindowSizeClass(currentWindowMetrics)

بعد ذلك، طبِّق التنسيق الصحيح عندما تتأكّد من أنّ تطبيقك لديه مساحة كافية على الأقل:

if(sizeClass.isWidthAtLeastBreakpoint(
    WindowSizeClass.WIDTH_DP_LARGE_LOWER_BOUND)){
    ...
	// Window is at least 1200 dp wide.
}

إنشاء تنسيقات تكيّفية باستخدام Jetpack Navigation 3

Navigation 3 هو أحدث إضافة إلى مجموعة Jetpack. Navigation 3، الذي وصل للتو إلى أول إصدار ثابت له، هو مكتبة تنقّل فعّالة مصمّمة للعمل مع Compose.

يُعدّ Navigation 3 أيضًا أداة رائعة لإنشاء تنسيقات تكيّفية من خلال السماح بعرض وجهات متعددة في الوقت نفسه والسماح بالتبديل بسلاسة بين هذه التنسيقات.

يستند هذا النظام لإدارة تدفق واجهة مستخدم تطبيقك إلى المشاهد. المشهد هو تنسيق يعرض وجهة واحدة أو أكثر في الوقت نفسه. تحدّد SceneStrategy ما إذا كان بإمكانها إنشاء مشهد. يسمح لك ربط مثيلات SceneStrategy معًا بإنشاء وعرض مشاهد مختلفة لأحجام شاشات وإعدادات أجهزة مختلفة.

بالنسبة إلى التنسيقات الأساسية الجاهزة، مثل عرض على شكل قائمة مع تفاصيل واللوحة الداعمة، يمكنك استخدام المشاهد من مكتبة Compose Material 3 التكيّفية (المتاحة في الإصدار 1.3 والإصدارات الأحدث).

من السهل أيضًا إنشاء مشاهد مخصّصة من خلال تعديل وصفات المشاهد أو البدء من الصفر. على سبيل المثال، لنفترض مشهدًا يعرض ثلاث لوحات جنبًا إلى جنب:

class ThreePaneScene<T : Any>(
    override val key: Any,
    override val previousEntries: List<NavEntry<T>>,
    val firstEntry: NavEntry<T>,
    val secondEntry: NavEntry<T>,
    val thirdEntry: NavEntry<T>
) : Scene<T> {
    override val entries: List<NavEntry<T>> = listOf(firstEntry, secondEntry, thirdEntry)
    override val content: @Composable (() -> Unit) = {
        Row(modifier = Modifier.fillMaxSize()) {
            Column(modifier = Modifier.weight(1f)) {
                firstEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                secondEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                thirdEntry.Content()
            }
        }
    }

في هذا السيناريو، يمكنك تحديد SceneStrategy لعرض ثلاث لوحات إذا كان عرض النافذة كبيرًا بما يكفي وكانت الإدخالات من الأنشطة السابقة قد أعلنت أنّها تتيح عرضها في مشهد ثلاثي اللوحات.

class ThreePaneSceneStrategy<T : Any>(val windowSizeClass: WindowSizeClass) : SceneStrategy<T> {
    override fun SceneStrategyScope<T>.calculateScene(entries: List<NavEntry<T>>): Scene<T>? {
        if (windowSizeClass.isWidthAtLeastBreakpoint(WIDTH_DP_LARGE_LOWER_BOUND)) {
            val lastThree = entries.takeLast(3)
            if (lastThree.size == 3 && lastThree.all { it.metadata.containsKey(MULTI_PANE_KEY) }) {
                val firstEntry = lastThree[0]
                val secondEntry = lastThree[1]
                val thirdEntry = lastThree[2]


                return ThreePaneScene(
                    key = Triple(firstEntry.contentKey, secondEntry.contentKey, thirdEntry.contentKey),
                    previousEntries = entries.dropLast(3),
                    firstEntry = firstEntry,
                    secondEntry = secondEntry,
                    thirdEntry = thirdEntry
                )
            }
        }
        return null
    }
}

يمكنك استخدام ThreePaneSceneStrategy مع استراتيجيات أخرى عند إنشاء NavDisplay. على سبيل المثال، يمكننا أيضًا إضافة TwoPaneStrategy لعرض لوحتَين جنبًا إلى جنب عندما لا تكون هناك مساحة كافية لعرض ثلاث لوحات.

val strategy = ThreePaneSceneStrategy() then TwoPaneSceneStrategy()

NavDisplay(..., 
  sceneStrategy = strategy,
  entryProvider = entryProvider { 
    entry<MyScreen>(metadata = mapOf(MULTI_PANE_KEY to true))) { ... }
    ... other entries...
  }
)

إذا لم تكن هناك مساحة كافية لعرض ثلاث لوحات أو لوحتَين، ستعرض كلتا استراتيجيتَي المشهد المخصّصتَين null. في هذه الحالة، يعود NavDisplay إلى عرض آخر إدخال في الأنشطة السابقة في لوحة واحدة باستخدام SinglePaneScene.

باستخدام المشاهد والاستراتيجيات، يمكنك إضافة تنسيقات لوحة واحدة ولوحتَين وثلاث لوحات إلى تطبيقك.

تطبيق تكيّفي يعرض تنقلاً ثلاثي اللوحات على الشاشات الكبيرة

يمكنك الاطّلاع على المستندات لمعرفة المزيد حول كيفية إنشاء تنسيقات مخصّصة باستخدام المشاهد في Navigation 3.

تنسيقات تكيّفية مستقلة

إذا كنت بحاجة إلى تنسيق مستقل، تساعدك مكتبة Compose Material 3 التكيّفية في إنشاء واجهات مستخدم تكيّفية، مثل تنسيقات قائمة التفاصيل واللوحة الداعمة التي تتكيّف تلقائيًا مع إعدادات النوافذ استنادًا إلى فئات أحجام النوافذ أو أوضاع الجهاز. 

الخبر السار هو أنّ المكتبة محدّثة بالفعل بأحدث نقاط التوقف. بدءًا من الإصدار 1.2، تتوافق وظائف توجيهات السقالة التلقائية للوحة مع فئتَي أحجام النوافذ حسب العرض: كبيرة وكبيرة جدًا.

ما عليك سوى الموافقة من خلال الإعلان في ملف تصميم Gradle عن رغبتك في استخدام نقاط التوقف الجديدة:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

الخطوات الأولى

يمكنك استكشاف ميزة الشاشة المتصلة في أحدث إصدار من Android. يمكنك الحصول على Android 16 QPR3 على جهاز متوافق، ثم توصيله بشاشة خارجية لبدء اختبار تطبيقك اليوم. 

يمكنك الاطّلاع على المستندات المعدّلة حول دعم الشاشات المتعددة و إدارة النوافذ لمعرفة المزيد عن تنفيذ أفضل الممارسات هذه.

الملاحظات

ملاحظاتك ضرورية بينما نواصل تحسين تجربة سطح المكتب على الشاشة المتصلة. يمكنك مشاركة أفكارك والإبلاغ عن أي مشاكل من خلال قنوات الملاحظات الرسمية.

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

*ملاحظة: في وقت كتابة المقالة، تتوافق الشاشات المتصلة مع سلسلة هواتف Pixel 8 و9 و10 ومجموعة كبيرة من أجهزة Samsung، بما في ذلك S26 وFold7 وFlip7 وTab S11.