اخبار محصول

دستگاه‌های Android به‌طور یکپارچه به نمایشگرهای متصل گسترش می‌یابند

زمان خواندن: ۷ دقیقه
مشاهده نمایه فرانچسکو رومانو
Francesco Romano مهندس روابط توسعه‌دهندگان، Android

با خوشحالی اعلام می‌کنیم که به نقطه عطف مهمی در نزدیک‌تر کردن رایانش تلفن همراه و رایانه در Android رسیده‌ایم: پشتیبانی از نمایشگر متصل با انتشار Android 16 QPR3 به‌طور عمومی دردسترس قرار گرفته است!

همان‌طور که در Google I/O 2025 نشان داده شد، نمایشگرهای متصل به کاربران امکان می‌دهند دستگاه‌های Android خود را به یک نمایشگر خارجی متصل کنند و فوراً به محیط پنجره‌بندی رایانه‌ای دسترسی پیدا کنند. برنامه‌ها را می‌توان در پنجره‌های با قالب آزاد یا بیشینه‌شده استفاده کرد و کاربران می‌توانند درست مانند سیستم‌عامل رایانه چندوظیفگی انجام دهند.

Google و Samsung با همکاری یکدیگر تجربه پنجره‌بندی رایانه‌ای یکپارچه و قدرتمندی را به دستگاه‌های سراسر بوم‌سازگان Android که Android 16 را اجرا می‌کنند و به نمایشگر خارجی متصل هستند آورده‌اند. 
این ویژگی اکنون به‌طور عمومی در دستگاه‌های پشتیبانی‌شده* برای کاربرانی که می‌توانند تلفن‌های Pixel و Samsung پشتیبانی‌شده خود را به مانیتورهای خارجی متصل کنند دردسترس است و فرصت‌های جدیدی را برای ساختن تجربه‌های برنامه جذاب‌تر و پربازده‌تر که با انواع ابعاد سازگار می‌شوند فراهم می‌کند.

چگونه کار می‌کند؟

وقتی تلفن Android یا دستگاه تاشو پشتیبانی‌شده‌ای به نمایشگر خارجی متصل می‌شود، جلسه رایانه‌ای جدیدی در نمایشگر متصل شروع می‌شود.

تجربه در نمایشگر متصل‌شده مشابه تجربه در رایانه است، ازجمله نوار وظیفه‌ای که برنامه‌های فعال را نشان می‌دهد و به کاربران اجازه می‌دهد برنامه‌ها را برای دسترسی سریع سنجاق کنند. کاربران می‌توانند چند برنامه را به‌طور هم‌زمان در پنجره‌هایی با قابلیت تغییر اندازه آزادانه در نمایشگر متصل‌شده اجرا کنند.

materialDisplay.gif

تلفن به نمایشگر خارجی متصل است و جلسه رایانه‌ای در نمایشگر اجرا می‌شود، درحالی‌که تلفن وضعیت خودش را حفظ می‌کند.

وقتی دستگاهی که از پنجره‌بندی رایانه‌ای پشتیبانی می‌کند (مثل رایانه لوحی Samsung Galaxy Tab S11) به نمایشگر خارجی متصل می‌شود، جلسه رایانه در هر دو نمایشگر گسترش می‌یابد و فضای کاری وسیع‌تری را باز می‌کند. سپس دو نمایشگر به‌عنوان یک سیستم پیوسته عمل می‌کنند و به پنجره‌های برنامه، محتوا، و مکان‌نما اجازه می‌دهند آزادانه بین نمایشگرها حرکت کنند.

materialDisplay2.gif

رایانه لوحی به نمایشگر خارجی متصل شده است و جلسه میز کار را در هر دو نمایشگر گسترش می‌دهد.

چرا اهمیت دارد؟

در نسخه Android 16 QPR3، رفتارهای پردازش پنجره‌ای، تعاملات نوار وظیفه، و سازگاری ورودی (موشواره و صفحه‌کلید) را که تجربه نمایشگر متصل را تعریف می‌کنند نهایی کردیم. همچنین اصلاحات سازگاری را برای مقیاس‌بندی پنجره‌ها و جلوگیری از بازراه‌اندازی برنامه هنگام جابه‌جایی بین نمایشگرها اضافه کردیم.


اگر برنامه‌تان با اصول طراحی تطبیقی ساخته شده باشد، به‌طور خودکار ظاهر و حس رایانه را خواهد داشت و کاربران احساس راحتی خواهند کرد. اگر برنامه در حالت عمودی قفل شده است یا فرض می‌کند که رابط فقط لمسی است، اکنون زمان مدرن‌سازی است.

به‌ویژه، به این روال‌های مطلوب کلیدی برای تجربه بهینه برنامه در نمایشگرهای متصل توجه کنید:

  • شیء Display را ثابت فرض نکنید: شیء Display مرتبط با بافت برنامه‌تان می‌تواند هنگام انتقال پنجره برنامه به نمایشگر خارجی یا درصورت تغییر پیکربندی نمایشگر تغییر کند. برنامه شما باید به‌طور مناسبی رویدادهای تغییر پیکربندی را مدیریت کند و سنجه‌های نمایش را به‌جای ذخیره کردن در حافظه نهان، به‌صورت پویا پُرسمان کند.
  • تغییرات پیکربندی تراکم رادرنظر بگیرید: نمایشگرهای خارجی می‌توانند تراکم پیکسلی بسیار متفاوتی نسبت‌به صفحه‌نمایش دستگاه اصلی داشته باشند. مطمئن شوید که چیدمان‌ها و منابع شما به‌درستی با این تغییرات سازگار می‌شوند تا وضوح و کاربردپذیری میانای کاربری حفظ شود. از پیکسل‌های مستقل از تراکم (dp) برای چیدمان‌ها استفاده کنید، منابع مختص تراکم ارائه دهید، و مطمئن شوید که میانای کاربر شما به‌طور مناسب مقیاس‌بندی می‌شود.
  • به‌درستی از لوازم جانبی خارجی پشتیبانی کند: وقتی کاربران به نمایشگر خارجی متصل می‌شوند، اغلب محیطی شبیه به رایانه ایجاد می‌کنند. این کار اغلب شامل استفاده از صفحه‌کلید، موشواره، پد لمسی، وب‌کم، میکروفون، و بلندگوی خارجی می‌شود. بهبود پشتیبانی از تعاملات صفحه‌کلید و موشواره.

ساختن برای آینده رایانه با ابزارهای مدرن

چندین ابزار برای کمک به شما در ساختن تجربه رایانه ارائه می‌دهیم. بیایید جدیدترین به‌روزرسانی‌های کتابخانه‌های تطبیقی اصلی‌مان را مرور کنیم!

کلاس‌های جدید اندازه پنجره: بزرگ و خیلی بزرگ

بزرگ‌ترین به‌روزرسانی در Jetpack WindowManager 1.5.0 اضافه شدن دو کلاس اندازه پنجره عریض جدید است: بزرگ و خیلی بزرگ.

کلاس‌های اندازه پنجره مجموعه رسمی و توصیه‌شده ما از نقاط شکست نمای هدف است که به شما کمک می‌کند چیدمان‌های تطبیقی را طراحی و توسعه دهید. با نسخه ۱.۵.۰، این راهنمایی را برای صفحه‌نمایش‌هایی که بزرگ‌تر از اندازه رایانه‌های لوحی معمولی هستند گسترش می‌دهیم.

در اینجا نقاط شکست عرض جدید آورده شده است:

  • بزرگ: برای عرض‌های بین ۱۲۰۰ و ۱۶۰۰ پیکسل مستقل از تراکم
  • بسیار بزرگ: برای عرض‌های ≥۱۶۰۰dp
windowClasses.png

کلاس‌های مختلف اندازه پنجره براساس عرض نمایشگر.

در سطوح بسیار بزرگ، صرفاً بزرگ کردن چیدمان گسترده رایانه لوحی همیشه بهترین تجربه کاربری را ارائه نمی‌دهد. برای مثال، یک کارخواه ایمیل ممکن است به‌راحتی دو قاب (یک صندوق پستی و یک پیام) را در کلاس اندازه پنجره «گسترده» نشان دهد. اما در یک مانیتور رومیزی بسیار بزرگ، کارخواه ایمیل می‌تواند به‌طور ظریفی سه یا حتی چهار قاب را به‌طور هم‌زمان نمایش دهد، شاید یک صندوق ورودی، یک فهرست پیام، محتوای کامل پیام، و یک پانل تقویم/تکالیف.

برای گنجاندن کلاس‌های اندازه پنجره جدید در پروژه‌تان، کافی است تابع را از مجموعه 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 Adaptive استفاده کنید (در نسخه ۱.۳ و بالاتر دردسترس است).

همچنین می‌توانید به‌راحتی «صحنه‌های» سفارشی خود را با اصلاح دستورالعمل‌های «صحنه» یا شروع از ابتدا بسازید. برای مثال، «صحنه‌ای» را درنظر بگیرید که سه قاب را کنار هم نمایش می‌دهد:

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 برمی‌گردد. 

بااستفاده از صحنه‌ها و استراتژی‌ها، می‌توانید چیدمان‌های یک، دو، و سه قاب را به برنامه‌تان اضافه کنید!

adaptivepane.gif

برنامه تطبیقی که ناوبری سه‌قاب را در صفحه‌نمایش‌های عریض نشان می‌دهد.

برای کسب اطلاعات بیشتر درباره نحوه ایجاد چیدمان‌های سفارشی بااستفاده از «صحنه‌ها» در Navigation 3، به اسناد مراجعه کنید.

چیدمان‌های تطبیقی مستقل

اگر به چیدمان مستقل نیاز دارید، کتابخانه Compose Material 3 Adaptive به شما کمک می‌کند تا واسط‌های کاربر تطبیقی مانند چیدمان‌های فهرست-جزئیات و قاب پشتیبانی ایجاد کنید که به‌طور خودکار براساس کلاس‌های اندازه پنجره یا وضعیت‌های دستگاه با پیکربندی‌های پنجره تطبیق پیدا می‌کنند. 

خبر خوب این است که کتابخانه ازقبل با نقاط شکست جدید به‌روز شده است! از نسخه ۱.۲، توابع دستور داربست قاب پیش‌فرض از کلاس‌های اندازه پنجره با عرض بزرگ و خیلی بزرگ پشتیبانی می‌کنند.

فقط باید با اعلام اینکه می‌خواهید از نقاط توقف جدید استفاده کنید، در فایل ساخت Gradle خود رضایت دهید:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

شروع کردن

ویژگی نمایشگر متصل را در جدیدترین نسخه Android کاوش کنید. Android 16 QPR3 را در دستگاه پشتیبانی‌شده دریافت کنید، سپس آن را به نمایشگر خارجی متصل کنید تا آزمایش برنامه‌تان را از همین امروز شروع کنید! 

برای کسب اطلاعات بیشتر درباره پیاده‌سازی این روال‌های مطلوب، به اسناد به‌روزشده درباره پشتیبانی از چند نمایشگر و مدیریت پنجره مراجعه کنید.

بازخورد

بازخورد شما برای ما بسیار مهم است زیرا همچنان درحال بهبود تجربه نمایشگر متصل‌شده در رایانه هستیم. نظراتتان را با ما درمیان بگذارید و مشکلات را ازطریق کانال‌های رسمی بازخورد ما گزارش کنید.

ما متعهدیم که Android را به پلاتفرمی همه‌کاره تبدیل کنیم که با روش‌های متعددی که کاربران می‌خواهند با برنامه‌ها و دستگاه‌هایشان تعامل داشته باشند سازگار شود. بهبودهای پشتیبانی از نمایشگر متصل گام دیگری در این جهت است و فکر می‌کنیم کاربران شما از تجربه‌های رایانه‌ای که خواهید ساخت لذت خواهند برد!


*توجه: در زمان نگارش این مقاله، نمایشگرهای متصل در سری‌های Pixel 8،‏ 9،‏ 10 و طیف گسترده‌ای از دستگاه‌های Samsung، ازجمله S26،‏ Fold7،‏ Flip7، و Tab S11 پشتیبانی می‌شوند.

نویسنده:
ادامه خواندن