Media | Gallery | Android Developers

<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="721724668570-nbkv1cfusk7kk4eni4pjvepaus73b13t.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Android Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#34a853"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/android/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500,600,700|Google+Sans+Text:400,400italic,500,500italic,600,600italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/css/app.css"> <link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/css/dark-theme.css" disabled> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/favicon.svg"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/touchicon-180.png"><link rel="canonical" href="https://developer.android.com/large-screens/gallery/media"><link rel="search" type="application/opensearchdescription+xml" title="Android Developers" href="https://developer.android.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://developer.android.com/large-screens/gallery/media" /><link rel="alternate" hreflang="x-default" href="https://developer.android.com/large-screens/gallery/media" /><link rel="alternate" hreflang="ar" href="https://developer.android.com/large-screens/gallery/media?hl=ar" /><link rel="alternate" hreflang="bn" href="https://developer.android.com/large-screens/gallery/media?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://developer.android.com/large-screens/gallery/media?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://developer.android.com/large-screens/gallery/media?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://developer.android.com/large-screens/gallery/media?hl=fa" /><link rel="alternate" hreflang="fr" href="https://developer.android.com/large-screens/gallery/media?hl=fr" /><link rel="alternate" hreflang="de" href="https://developer.android.com/large-screens/gallery/media?hl=de" /><link rel="alternate" hreflang="he" href="https://developer.android.com/large-screens/gallery/media?hl=he" /><link rel="alternate" hreflang="hi" href="https://developer.android.com/large-screens/gallery/media?hl=hi" /><link rel="alternate" hreflang="id" href="https://developer.android.com/large-screens/gallery/media?hl=id" /><link rel="alternate" hreflang="it" href="https://developer.android.com/large-screens/gallery/media?hl=it" /><link rel="alternate" hreflang="ja" href="https://developer.android.com/large-screens/gallery/media?hl=ja" /><link rel="alternate" hreflang="ko" href="https://developer.android.com/large-screens/gallery/media?hl=ko" /><link rel="alternate" hreflang="pl" href="https://developer.android.com/large-screens/gallery/media?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://developer.android.com/large-screens/gallery/media?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://developer.android.com/large-screens/gallery/media?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://developer.android.com/large-screens/gallery/media?hl=es-419" /><link rel="alternate" hreflang="th" href="https://developer.android.com/large-screens/gallery/media?hl=th" /><link rel="alternate" hreflang="tr" href="https://developer.android.com/large-screens/gallery/media?hl=tr" /><link rel="alternate" hreflang="vi" href="https://developer.android.com/large-screens/gallery/media?hl=vi" /><title>Media  |  Gallery  |  Android Developers</title> <meta property="og:title" content="Media  |  Gallery  |  Android Developers"><meta property="og:url" content="https://developer.android.com/large-screens/gallery/media"><meta property="og:image" content="https://developer.android.com/static/images/social/android-developers.png"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="675"><meta property="og:locale" content="en"><meta name="twitter:card" content="summary_large_image"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Media" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "UI Design", "item": "https://developer.android.com/design/ui" },{ "@type": "ListItem", "position": 2, "name": "Large Screens", "item": "https://developer.android.com/design/ui/large-screens" },{ "@type": "ListItem", "position": 3, "name": "Gallery", "item": "https://developer.android.com/large-screens/gallery" },{ "@type": "ListItem", "position": 4, "name": "Media", "item": "https://developer.android.com/large-screens/gallery/media" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="android-gallery-reddish android-large-screens-gallery android-large-screens-media" template="landing" theme="android-theme" type="article" appearance layout="full" pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <a href="#main-content" class="skip-link button"> Skip to main content </a> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner"> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="androidDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Android Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup.svg" class="devsite-site-logo" alt="Android Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab class="devsite-dropdown devsite-dropdown-full "> <a href="https://developer.android.com/get-started" class="devsite-tabs-content gc-analytics-event android-dropdown-tab" track-metadata-eventdetail="https://developer.android.com/get-started" track-type="nav" track-metadata-position="nav - essentials" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Essentials" track-name="essentials" > Essentials </a> <button aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown menu for Essentials" track-type="nav" track-metadata-eventdetail="https://developer.android.com/get-started" track-metadata-position="nav - essentials" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Essentials" track-name="essentials" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></button> <div class="devsite-tabs-dropdown" role="menu" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column android-dropdown android-dropdown-primary android-dropdown-studio"> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Gemini in Android Studio</li> <li class="devsite-nav-description">Your AI development companion for Android development. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/gemini-in-android" track-type="nav" track-metadata-eventdetail="https://developer.android.com/gemini-in-android" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="gemini in android studio" tooltip class="button button-primary" > <div class="devsite-nav-item-title"> Learn more </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/studio" track-type="nav" track-metadata-eventdetail="https://developer.android.com/studio" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="gemini in android studio" tooltip class="button button-white" > <div class="devsite-nav-item-title"> Get Android Studio </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-launch"> <li class="devsite-nav-title" role="heading" tooltip>Get started</li> <li class="devsite-nav-description">Start by creating your first app. Go deeper with our training courses or explore app development on your own. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/get-started/overview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/get-started/overview" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Hello world </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/courses" track-type="nav" track-metadata-eventdetail="https://developer.android.com/courses" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Training courses </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/get-started/codelabs" track-type="nav" track-metadata-eventdetail="https://developer.android.com/get-started/codelabs" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Tutorials </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop/ui/compose/adopt" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop/ui/compose/adopt" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Compose for teams </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/kotlin" track-type="nav" track-metadata-eventdetail="https://developer.android.com/kotlin" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Kotlin for Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://play.google.com/console/about/guides/monetize/" track-type="nav" track-metadata-eventdetail="https://play.google.com/console/about/guides/monetize/" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Monetization with Play ↗️ </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-multiple-screens"> <li class="devsite-nav-title" role="heading" tooltip>Extend by device</li> <li class="devsite-nav-description">Build apps that give your users seamless experiences from phones to tablets, watches, headsets, and more. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/adaptive-apps" track-type="nav" track-metadata-eventdetail="https://developer.android.com/adaptive-apps" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> Adaptive apps </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/xr" track-type="nav" track-metadata-eventdetail="https://developer.android.com/xr" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> Android XR </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/wear" track-type="nav" track-metadata-eventdetail="https://developer.android.com/wear" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> Wear OS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/cars" track-type="nav" track-metadata-eventdetail="https://developer.android.com/cars" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> Android for Cars </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/tv" track-type="nav" track-metadata-eventdetail="https://developer.android.com/tv" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> Android TV </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/chrome-os" track-type="nav" track-metadata-eventdetail="https://developer.android.com/chrome-os" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="extend by device" tooltip > <div class="devsite-nav-item-title"> ChromeOS </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-platform"> <li class="devsite-nav-title" role="heading" tooltip>Build by category</li> <li class="devsite-nav-description">Learn to build for your use case by following Google's prescriptive and opinionated guidance. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/games" track-type="nav" track-metadata-eventdetail="https://developer.android.com/games" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Games </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/media" track-type="nav" track-metadata-eventdetail="https://developer.android.com/media" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Camera & media </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/social-and-messaging" track-type="nav" track-metadata-eventdetail="https://developer.android.com/social-and-messaging" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Social & messaging </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/health-and-fitness" track-type="nav" track-metadata-eventdetail="https://developer.android.com/health-and-fitness" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Health & fitness </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/productivity" track-type="nav" track-metadata-eventdetail="https://developer.android.com/productivity" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Productivity </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/work/overview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/work/overview" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="build by category" tooltip > <div class="devsite-nav-item-title"> Enterprise apps </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-stars"> <li class="devsite-nav-title" role="heading" tooltip>Get the latest</li> <li class="devsite-nav-description">Stay in touch with the latest releases throughout the year, join our preview programs, and give us your feedback. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/latest-updates" track-type="nav" track-metadata-eventdetail="https://developer.android.com/latest-updates" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Latest updates </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/latest-updates/experimental" track-type="nav" track-metadata-eventdetail="https://developer.android.com/latest-updates/experimental" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Experimental updates </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/studio/preview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/studio/preview" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Android Studio preview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/jetpack/androidx/versions" track-type="nav" track-metadata-eventdetail="https://developer.android.com/jetpack/androidx/versions" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Jetpack & Compose libraries </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/wearables/versions/4" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/wearables/versions/4" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Wear OS preview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design-for-safety/privacy-sandbox" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design-for-safety/privacy-sandbox" track-metadata-position="nav - essentials" track-metadata-module="tertiary nav" track-metadata-module_headline="get the latest" tooltip > <div class="devsite-nav-item-title"> Privacy Sandbox </div> </a> </li> </ul> </div> </div> </div> </tab> <tab class="devsite-dropdown devsite-dropdown-full devsite-active "> <a href="https://developer.android.com/design" class="devsite-tabs-content gc-analytics-event android-dropdown-tab" track-metadata-eventdetail="https://developer.android.com/design" track-type="nav" track-metadata-position="nav - design & plan" track-metadata-module="primary nav" aria-label="Design & Plan, selected" data-category="Site-Wide Custom Events" data-label="Tab: Design & Plan" track-name="design & plan" > Design & Plan </a> <button aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown menu for Design & Plan" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design" track-metadata-position="nav - design & plan" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Design & Plan" track-name="design & plan" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></button> <div class="devsite-tabs-dropdown" role="menu" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-layout"> <li class="devsite-nav-title" role="heading" tooltip>UI Design</li> <li class="devsite-nav-description">Design a beautiful user interface using Android best practices.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Design for Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/mobile" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/mobile" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Mobile </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/large-screens" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/large-screens" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Adaptive UI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/xr" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/xr" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Android XR </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/widget" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/widget" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Widgets </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/wear" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/wear" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Wear OS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/design/ui/tv" track-type="nav" track-metadata-eventdetail="https://developer.android.com/design/ui/tv" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="ui design" tooltip > <div class="devsite-nav-item-title"> Android TV </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-design"> <li class="devsite-nav-title" role="heading" tooltip>Architecture</li> <li class="devsite-nav-description">Design robust, testable, and maintainable app logic and services.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/topic/architecture/intro" track-type="nav" track-metadata-eventdetail="https://developer.android.com/topic/architecture/intro" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="architecture" tooltip > <div class="devsite-nav-item-title"> Introduction </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/topic/libraries/view-binding" track-type="nav" track-metadata-eventdetail="https://developer.android.com/topic/libraries/view-binding" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="architecture" tooltip > <div class="devsite-nav-item-title"> Libraries </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/navigation/navigation-principles" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/navigation/navigation-principles" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="architecture" tooltip > <div class="devsite-nav-item-title"> Navigation </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/topic/modularization" track-type="nav" track-metadata-eventdetail="https://developer.android.com/topic/modularization" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="architecture" tooltip > <div class="devsite-nav-item-title"> Modularization </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/testing/fundamentals" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/testing/fundamentals" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="architecture" tooltip > <div class="devsite-nav-item-title"> Testing </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-vitals"> <li class="devsite-nav-title" role="heading" tooltip>Quality</li> <li class="devsite-nav-description">Plan for app quality and align with Play store guidelines.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/quality" track-type="nav" track-metadata-eventdetail="https://developer.android.com/quality" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> Overview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/quality/core-value" track-type="nav" track-metadata-eventdetail="https://developer.android.com/quality/core-value" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> Core value </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/quality/user-experience" track-type="nav" track-metadata-eventdetail="https://developer.android.com/quality/user-experience" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> User experience </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/topics/ui/accessibility" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/topics/ui/accessibility" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> Accessibility </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/quality/technical" track-type="nav" track-metadata-eventdetail="https://developer.android.com/quality/technical" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> Technical quality </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/quality/privacy-and-security" track-type="nav" track-metadata-eventdetail="https://developer.android.com/quality/privacy-and-security" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="quality" tooltip > <div class="devsite-nav-item-title"> Security </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-security-2"> <li class="devsite-nav-title" role="heading" tooltip>Security</li> <li class="devsite-nav-description">Safeguard users against threats and ensure a secure Android experience.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/security" track-type="nav" track-metadata-eventdetail="https://developer.android.com/security" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="security" tooltip > <div class="devsite-nav-item-title"> Overview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/privacy-and-security/about" track-type="nav" track-metadata-eventdetail="https://developer.android.com/privacy-and-security/about" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="security" tooltip > <div class="devsite-nav-item-title"> Privacy </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/topics/permissions/overview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/topics/permissions/overview" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="security" tooltip > <div class="devsite-nav-item-title"> Permissions </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/identity" track-type="nav" track-metadata-eventdetail="https://developer.android.com/identity" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="security" tooltip > <div class="devsite-nav-item-title"> Identity </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/security/fraud-prevention" track-type="nav" track-metadata-eventdetail="https://developer.android.com/security/fraud-prevention" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="security" tooltip > <div class="devsite-nav-item-title"> Fraud prevention </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-earth"> <li class="devsite-nav-title" role="heading" tooltip>Build for Billions</li> <li class="devsite-nav-description">Create the best experience for entry-level devices</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/build-for-billions" track-type="nav" track-metadata-eventdetail="https://developer.android.com/build-for-billions" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="build for billions" tooltip > <div class="devsite-nav-item-title"> Overview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/docs/quality-guidelines/build-for-billions" track-type="nav" track-metadata-eventdetail="https://developer.android.com/docs/quality-guidelines/build-for-billions" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="build for billions" tooltip > <div class="devsite-nav-item-title"> About new markets </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/topics/androidgo" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/topics/androidgo" track-metadata-position="nav - design & plan" track-metadata-module="tertiary nav" track-metadata-module_headline="build for billions" tooltip > <div class="devsite-nav-item-title"> Android (Go edition) </div> </a> </li> </ul> </div> </div> </div> </tab> <tab class="devsite-dropdown devsite-dropdown-full "> <a href="https://developer.android.com/develop" class="devsite-tabs-content gc-analytics-event android-dropdown-tab" track-metadata-eventdetail="https://developer.android.com/develop" track-type="nav" track-metadata-position="nav - develop" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Develop" track-name="develop" > Develop </a> <button aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown menu for Develop" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop" track-metadata-position="nav - develop" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Develop" track-name="develop" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></button> <div class="devsite-tabs-dropdown" role="menu" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column android-dropdown android-dropdown-primary android-dropdown-ai"> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Build AI experiences</li> <li class="devsite-nav-description">Build AI-powered Android apps with Gemini APIs and more. </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/ai" track-type="nav" track-metadata-eventdetail="https://developer.android.com/ai" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="build ai experiences" tooltip class="button button-primary" > <div class="devsite-nav-item-title"> Get started </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-flag"> <li class="devsite-nav-title" role="heading" tooltip>Core areas</li> <li class="devsite-nav-description">Get the samples and docs for the features you need.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/samples" track-type="nav" track-metadata-eventdetail="https://developer.android.com/samples" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> Samples </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop/ui" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop/ui" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> User interfaces </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop/background-work" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop/background-work" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> Background work </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/topics/data" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/topics/data" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> Data and files </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop/connectivity" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop/connectivity" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> Connectivity </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop#core-areas" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop#core-areas" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="core areas" tooltip > <div class="devsite-nav-item-title"> All core areas ⤵️ </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-tools-2"> <li class="devsite-nav-title" role="heading" tooltip>Tools and workflow</li> <li class="devsite-nav-description">Use the IDE to write and build your app, or create your own pipeline.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/studio/write" track-type="nav" track-metadata-eventdetail="https://developer.android.com/studio/write" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Write and debug code </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/build/gradle-build-overview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/build/gradle-build-overview" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Build projects </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/testing" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/testing" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Test your app </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/topic/performance/overview" track-type="nav" track-metadata-eventdetail="https://developer.android.com/topic/performance/overview" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Performance </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/tools" track-type="nav" track-metadata-eventdetail="https://developer.android.com/tools" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Command-line tools </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/reference/tools/gradle-api" track-type="nav" track-metadata-eventdetail="https://developer.android.com/reference/tools/gradle-api" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="tools and workflow" tooltip > <div class="devsite-nav-item-title"> Gradle plugin API </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-multiple-screens"> <li class="devsite-nav-title" role="heading" tooltip>Device tech</li> <li class="devsite-nav-description">Write code for form factors. Connect devices and share data.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/guide/topics/large-screens/get-started-with-large-screens" track-type="nav" track-metadata-eventdetail="https://developer.android.com/guide/topics/large-screens/get-started-with-large-screens" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Adaptive UI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/wearables" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/wearables" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Wear OS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop/xr" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop/xr" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Android XR </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/health-and-fitness/guides" track-type="nav" track-metadata-eventdetail="https://developer.android.com/health-and-fitness/guides" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Android Health </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/cars" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/cars" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Android for Cars </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/training/tv" track-type="nav" track-metadata-eventdetail="https://developer.android.com/training/tv" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> Android TV </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/develop#devices" track-type="nav" track-metadata-eventdetail="https://developer.android.com/develop#devices" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="device tech" tooltip > <div class="devsite-nav-item-title"> All devices ⤵️ </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column android-dropdown"> <ul class="devsite-tabs-dropdown-section android-dropdown-section-icon android-dropdown-section-icon-core-library"> <li class="devsite-nav-title" role="heading" tooltip>Libraries</li> <li class="devsite-nav-description">Browse API reference documentation with all the details.</li> <li class="devsite-nav-item"> <a href="https://developer.android.com/reference/packages" track-type="nav" track-metadata-eventdetail="https://developer.android.com/reference/packages" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="libraries" tooltip > <div class="devsite-nav-item-title"> Android platform </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/jetpack/androidx/explorer" track-type="nav" track-metadata-eventdetail="https://developer.android.com/jetpack/androidx/explorer" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="libraries" tooltip > <div class="devsite-nav-item-title"> Jetpack libraries </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.android.com/jetpack/androidx/releases/compose" track-type="nav" track-metadata-eventdetail="https://developer.android.com/jetpack/androidx/releases/compose" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="libraries" tooltip > <div class="devsite-nav-item-title"> Compose libraries </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/android/reference/packages" track-type="nav" track-metadata-eventdetail="https://developers.google.com/android/reference/packages" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="libraries" tooltip > <div class="devsite-nav-item-title"> Google Play services ↗️ </div> </a> </li> <li class="devsite-nav-item"> <a href="https://play.google.com/sdks" track-type="nav" track-metadata-eventdetail="https://play.google.com/sdks" track-metadata-position="nav - develop" track-metadata-module="tertiary nav" track-metadata-module_headline="libraries" tooltip > <div class="devsite-nav-item-title"> Google Play SDK index ↗️ </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://developer.android.com/distribute" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/distribute" track-type="nav" track-metadata-position="nav - google play" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Google Play" track-name="google play" > Google Play </a> </tab> <tab > <a href="https://developer.android.com/community" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/community" track-type="nav" track-metadata-position="nav - community" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Community" track-name="community" > Community </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Gallery" tenant-name="Android Developers" > <form class="devsite-search-form" action="https://developer.android.com/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-appearance-selector></devsite-appearance-selector> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <a class="devsite-header-link devsite-top-button button gc-analytics-event" href="https://developer.android.com/studio" data-category="Site-Wide Custom Events" data-label="Site header link" > Android Studio </a> <devsite-user enable-profiles id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-product-id-row" > <div class="devsite-product-description-row"> <ul class="devsite-breadcrumb-list" aria-label="Lower header breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developer.android.com/design/ui" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="UI Design" > UI Design </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/design/ui/large-screens" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="Large Screens" > Large Screens </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/large-screens/gallery" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="Gallery" > Gallery </a> </li> </ul> </div> </div> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab > <a href="https://developer.android.com/large-screens/gallery" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery" track-type="nav" track-metadata-position="nav - overview" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Overview" track-name="overview" > Overview </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/social" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/social" track-type="nav" track-metadata-position="nav - social media" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Social media" track-name="social media" > Social media </a> </tab> <tab class="devsite-active"> <a href="https://developer.android.com/large-screens/gallery/media" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/media" track-type="nav" track-metadata-position="nav - media" track-metadata-module="primary nav" aria-label="Media, selected" data-category="Site-Wide Custom Events" data-label="Tab: Media" track-name="media" > Media </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/productivity" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/productivity" track-type="nav" track-metadata-position="nav - productivity" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Productivity" track-name="productivity" > Productivity </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/shopping" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/shopping" track-type="nav" track-metadata-position="nav - shopping" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Shopping" track-name="shopping" > Shopping </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/reading" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/reading" track-type="nav" track-metadata-position="nav - reading" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Reading" track-name="reading" > Reading </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/creativity" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/creativity" track-type="nav" track-metadata-position="nav - creativity" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Creativity" track-name="creativity" > Creativity </a> </tab> <tab > <a href="https://developer.android.com/large-screens/gallery/games" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://developer.android.com/large-screens/gallery/games" track-type="nav" track-metadata-position="nav - games" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Games" track-name="games" > Games </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars hidden> <div class="devsite-book-nav-filter" hidden> <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="androidDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Android Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup.svg" class="devsite-site-logo" alt="Android Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/get-started" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Essentials" track-name="essentials" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Essentials" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Essentials </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Essentials" track-name="essentials" > <span class="devsite-nav-text" tooltip menu="Essentials"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Essentials"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/design" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Design & Plan" track-name="design & plan" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Design & Plan" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Design & Plan </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Design & Plan" track-name="design & plan" > <span class="devsite-nav-text" tooltip menu="Design & Plan"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Design & Plan"> </span> </span> </li> </ul> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/large-screens/gallery" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Overview" track-name="overview" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Overview" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Overview </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/social" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Social media" track-name="social media" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Social media" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Social media </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/media" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Media" track-name="media" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Media" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Media </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/productivity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Productivity" track-name="productivity" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Productivity" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Productivity </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/shopping" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Shopping" track-name="shopping" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Shopping" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Shopping </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/reading" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Reading" track-name="reading" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Reading" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Reading </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/creativity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Creativity" track-name="creativity" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Creativity" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Creativity </span> </a> </li> <li class="devsite-nav-item"> <a href="/large-screens/gallery/games" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Games" track-name="games" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Games" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Games </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/develop" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Develop" track-name="develop" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Develop" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Develop </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Develop" track-name="develop" > <span class="devsite-nav-text" tooltip menu="Develop"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Develop"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/distribute" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Google Play" track-name="google play" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google Play" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google Play </span> </a> </li> <li class="devsite-nav-item"> <a href="/community" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Community" track-name="community" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Community" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Community </span> </a> </li> <li class="devsite-nav-item"> <a href="/studio" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android Studio" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android Studio </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="Essentials" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Gemini in Android Studio </span> </span> </li> <li class="devsite-nav-item"> <a href="/gemini-in-android" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Learn more" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Learn more </span> </a> </li> <li class="devsite-nav-item"> <a href="/studio" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get Android Studio" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Get Android Studio </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Get started </span> </span> </li> <li class="devsite-nav-item"> <a href="/get-started/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Hello world" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Hello world </span> </a> </li> <li class="devsite-nav-item"> <a href="/courses" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Training courses" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Training courses </span> </a> </li> <li class="devsite-nav-item"> <a href="/get-started/codelabs" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Tutorials" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Tutorials </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop/ui/compose/adopt" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Compose for teams" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Compose for teams </span> </a> </li> <li class="devsite-nav-item"> <a href="/kotlin" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Kotlin for Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Kotlin for Android </span> </a> </li> <li class="devsite-nav-item"> <a href="https://play.google.com/console/about/guides/monetize/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Monetization with Play ↗️" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Monetization with Play ↗️ </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Extend by device </span> </span> </li> <li class="devsite-nav-item"> <a href="/adaptive-apps" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Adaptive apps" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Adaptive apps </span> </a> </li> <li class="devsite-nav-item"> <a href="/xr" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android XR" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android XR </span> </a> </li> <li class="devsite-nav-item"> <a href="/wear" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Wear OS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Wear OS </span> </a> </li> <li class="devsite-nav-item"> <a href="/cars" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android for Cars" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android for Cars </span> </a> </li> <li class="devsite-nav-item"> <a href="/tv" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android TV" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android TV </span> </a> </li> <li class="devsite-nav-item"> <a href="/chrome-os" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: ChromeOS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > ChromeOS </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Build by category </span> </span> </li> <li class="devsite-nav-item"> <a href="/games" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Games" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Games </span> </a> </li> <li class="devsite-nav-item"> <a href="/media" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Camera & media" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Camera & media </span> </a> </li> <li class="devsite-nav-item"> <a href="/social-and-messaging" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Social & messaging" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Social & messaging </span> </a> </li> <li class="devsite-nav-item"> <a href="/health-and-fitness" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Health & fitness" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Health & fitness </span> </a> </li> <li class="devsite-nav-item"> <a href="/productivity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Productivity" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Productivity </span> </a> </li> <li class="devsite-nav-item"> <a href="/work/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Enterprise apps" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Enterprise apps </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Get the latest </span> </span> </li> <li class="devsite-nav-item"> <a href="/latest-updates" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Latest updates" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Latest updates </span> </a> </li> <li class="devsite-nav-item"> <a href="/latest-updates/experimental" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Experimental updates" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Experimental updates </span> </a> </li> <li class="devsite-nav-item"> <a href="/studio/preview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android Studio preview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android Studio preview </span> </a> </li> <li class="devsite-nav-item"> <a href="/jetpack/androidx/versions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Jetpack & Compose libraries" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Jetpack & Compose libraries </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/wearables/versions/4" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Wear OS preview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Wear OS preview </span> </a> </li> <li class="devsite-nav-item"> <a href="/design-for-safety/privacy-sandbox" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Privacy Sandbox" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Privacy Sandbox </span> </a> </li> </ul> <ul class="devsite-nav-list" menu="Design & Plan" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > UI Design </span> </span> </li> <li class="devsite-nav-item"> <a href="/design/ui" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Design for Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Design for Android </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/mobile" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Mobile" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Mobile </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/large-screens" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Adaptive UI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Adaptive UI </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/xr" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android XR" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android XR </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/widget" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Widgets" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Widgets </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/wear" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Wear OS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Wear OS </span> </a> </li> <li class="devsite-nav-item"> <a href="/design/ui/tv" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android TV" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android TV </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Architecture </span> </span> </li> <li class="devsite-nav-item"> <a href="/topic/architecture/intro" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Introduction" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Introduction </span> </a> </li> <li class="devsite-nav-item"> <a href="/topic/libraries/view-binding" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Libraries" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Libraries </span> </a> </li> <li class="devsite-nav-item"> <a href="/guide/navigation/navigation-principles" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Navigation" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Navigation </span> </a> </li> <li class="devsite-nav-item"> <a href="/topic/modularization" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Modularization" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Modularization </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/testing/fundamentals" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Testing" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Testing </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Quality </span> </span> </li> <li class="devsite-nav-item"> <a href="/quality" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Overview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Overview </span> </a> </li> <li class="devsite-nav-item"> <a href="/quality/core-value" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Core value" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Core value </span> </a> </li> <li class="devsite-nav-item"> <a href="/quality/user-experience" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: User experience" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > User experience </span> </a> </li> <li class="devsite-nav-item"> <a href="/guide/topics/ui/accessibility" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessibility" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessibility </span> </a> </li> <li class="devsite-nav-item"> <a href="/quality/technical" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Technical quality" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Technical quality </span> </a> </li> <li class="devsite-nav-item"> <a href="/quality/privacy-and-security" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Security" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Security </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Security </span> </span> </li> <li class="devsite-nav-item"> <a href="/security" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Overview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Overview </span> </a> </li> <li class="devsite-nav-item"> <a href="/privacy-and-security/about" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Privacy" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Privacy </span> </a> </li> <li class="devsite-nav-item"> <a href="/guide/topics/permissions/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Permissions" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Permissions </span> </a> </li> <li class="devsite-nav-item"> <a href="/identity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Identity" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Identity </span> </a> </li> <li class="devsite-nav-item"> <a href="/security/fraud-prevention" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Fraud prevention" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Fraud prevention </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Build for Billions </span> </span> </li> <li class="devsite-nav-item"> <a href="/build-for-billions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Overview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Overview </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/quality-guidelines/build-for-billions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: About new markets" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > About new markets </span> </a> </li> <li class="devsite-nav-item"> <a href="/guide/topics/androidgo" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android (Go edition)" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android (Go edition) </span> </a> </li> </ul> <ul class="devsite-nav-list" menu="Develop" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Build AI experiences </span> </span> </li> <li class="devsite-nav-item"> <a href="/ai" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get started" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Get started </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Core areas </span> </span> </li> <li class="devsite-nav-item"> <a href="/samples" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Samples" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Samples </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop/ui" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: User interfaces" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > User interfaces </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop/background-work" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Background work" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Background work </span> </a> </li> <li class="devsite-nav-item"> <a href="/guide/topics/data" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Data and files" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Data and files </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop/connectivity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Connectivity" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Connectivity </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop#core-areas" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: All core areas ⤵️" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > All core areas ⤵️ </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Tools and workflow </span> </span> </li> <li class="devsite-nav-item"> <a href="/studio/write" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Write and debug code" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Write and debug code </span> </a> </li> <li class="devsite-nav-item"> <a href="/build/gradle-build-overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Build projects" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Build projects </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/testing" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Test your app" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Test your app </span> </a> </li> <li class="devsite-nav-item"> <a href="/topic/performance/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance </span> </a> </li> <li class="devsite-nav-item"> <a href="/tools" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Command-line tools" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Command-line tools </span> </a> </li> <li class="devsite-nav-item"> <a href="/reference/tools/gradle-api" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Gradle plugin API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Gradle plugin API </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Device tech </span> </span> </li> <li class="devsite-nav-item"> <a href="/guide/topics/large-screens/get-started-with-large-screens" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Adaptive UI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Adaptive UI </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/wearables" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Wear OS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Wear OS </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop/xr" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android XR" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android XR </span> </a> </li> <li class="devsite-nav-item"> <a href="/health-and-fitness/guides" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android Health" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android Health </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/cars" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android for Cars" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android for Cars </span> </a> </li> <li class="devsite-nav-item"> <a href="/training/tv" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android TV" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android TV </span> </a> </li> <li class="devsite-nav-item"> <a href="/develop#devices" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: All devices ⤵️" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > All devices ⤵️ </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Libraries </span> </span> </li> <li class="devsite-nav-item"> <a href="/reference/packages" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Android platform" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Android platform </span> </a> </li> <li class="devsite-nav-item"> <a href="/jetpack/androidx/explorer" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Jetpack libraries" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Jetpack libraries </span> </a> </li> <li class="devsite-nav-item"> <a href="/jetpack/androidx/releases/compose" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Compose libraries" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Compose libraries </span> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/android/reference/packages" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google Play services ↗️" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google Play services ↗️ </span> </a> </li> <li class="devsite-nav-item"> <a href="https://play.google.com/sdks" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google Play SDK index ↗️" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google Play SDK index ↗️ </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" id="main-content" class="devsite-main-content" > <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars disabled></devsite-toc> <devsite-recommendations-sidebar class="nocontent devsite-nav"> </devsite-recommendations-sidebar> </div> </div> <devsite-content> <article class="devsite-article"><style> /* Styles inlined from /assets/css/gallery.css */ :root { --android-green: #34a853; --android-grey-50: #f8f9fa; --android-grey-200: #e8eaed; --android-grey-700: #5f6368; --android-navy: #073042; --android-yellow: #c6ff00; --bluish: #f1f3fc; --purplish: #f3edf7; --reddish: #ffede3; --tealish: #eef0ff; --greenish: #ebf5d4; --orangish: #ffefd0; --pinkish: #f8ecf0; --cyanish: #e6f1f0; --purplish-grey: #25232a; --reddish-grey: #282320; --tealish-grey: #23232a; --greenish-grey: #23251f; --orangish-grey: #282319; --pinkish-grey: #2b2222; --cyanish-grey: #1c2626; --item-border-radius: 24px; --primary-font-family: Google Sans Text, Noto Sans, Noto Sans JP, Noto Sans KR, Noto Naskh Arabic, Noto Sans Thai, Noto Sans Hebrew, Noto Sans Bengali, sans-serif; --headline-font-family: Google Sans, Noto Sans, Noto Sans JP, Noto Sans KR, Noto Naskh Arabic, Noto Sans Thai, Noto Sans Hebrew, Noto Sans Bengali, sans-serif; --callout-description-color: var(--android-grey-700); --callout-xlarge-heading-color: black; --lower-tabs-border-color: var(--android-navy); --lower-tabs-link-color: var(--android-navy); } .color-scheme--dark { --android-green: #2a8642; --bluish: #343d66; --purplish: #473a5c; --reddish: #5c3f33; --tealish: #404966; --greenish: #436632; --orangish: #755b26; --pinkish: #6e4545; --cyanish: #224242; --callout-description-color: white; --callout-xlarge-heading-color: var(--android-grey-50); --lower-tabs-border-color: white; --lower-tabs-link-color: white; } /* Generic styles */ .devsite-product-description { display: none; } .devsite-landing-row[background="white"] + [background="white"] { padding-top: 0; } .devsite-header-no-lower-tabs .devsite-product-id-row { padding: 24px !important; } devsite-header devsite-tabs.lower-tabs .devsite-tabs-content, devsite-header devsite-tabs.lower-tabs tab[active]>.devsite-tabs-content, devsite-header devsite-tabs.lower-tabs a { color: var(--lower-tabs-link-color); } devsite-header devsite-tabs.lower-tabs>.devsite-tabs-wrapper>tab[active]>a:after { border-color: var(--lower-tabs-border-color); } .devsite-landing-row-item-image a { position: relative; } .devsite-landing-row-item-image a::before { border-radius: var(--item-border-radius); bottom: 0; box-shadow: inset 0 0 0 4px rgba(0, 0, 0, .2); content: ''; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: opacity .2s ease-out; } .devsite-landing-row-item-image a:hover::before { opacity: 1; } .android-spotlight-hero .devsite-landing-row-item-media { width: 100% !important; } .android-split-hero .devsite-landing-row-item-image { display: flex; justify-content: flex-end; } .android-split-hero .devsite-landing-row-item-image img { max-width: 200px; } .android-split-hero .devsite-landing-row-item-description-content { font-weight: 500; } .android-section-intro-featured h2 { font-size: 40px; font-weight: 600; letter-spacing: -1.5px; line-height: 48px; margin-bottom: 16px; max-width: 900px; } .android-section-intro-featured .devsite-landing-row-description { font-family: var(--headline-font-family); } .android-callout video { vertical-align: middle; } .android-callout .devsite-landing-row-item-description-content { color: var(--callout-description-color); font-size: 16px; line-height: 24px; } .android-callout .devsite-landing-row-item-buttons { align-items: flex-start; flex-direction: column; grid-gap: 16px; } .android-callout .button { height: auto; line-height: 24px; overflow: visible; text-align: left; white-space: normal; } .android-callout-centered-full-width .devsite-landing-row-group, .android-callout-centered-full-width .devsite-landing-row-header-text { max-width: none; } .android-callout-small-heading h2 { font: 600 24px / 32px var(--headline-font-family); } .android-callout-medium-heading h2 { font: 600 32px / 40px var(--headline-font-family); letter-spacing: -.25px; } .android-callout-large-heading h2 { font: 600 40px / 48px var(--headline-font-family); letter-spacing: -.5px; } .android-callout-centered-full-width .devsite-landing-row-description h3 { font-size: 24px; font-weight: 500; line-height: 32px; margin-top: 40px; } .android-callout-centered-full-width .devsite-landing-row-item h3 { font-size: 20px; font-weight: 500; line-height: 28px; } .android-callout-xlarge-heading .devsite-landing-row-header-text { margin: 0 auto; max-width: 280px; } .android-callout-xlarge-heading h2 { color: var(--callout-xlarge-heading-color); font-size: 40px; letter-spacing: -1.5px; line-height: 48px; } .android-callout-xlarge-heading .android-highlight { color: var(--android-green); text-decoration: none !important; } .android-callout-large-description .devsite-landing-row-description { font: 500 24px / 32px var(--headline-font-family); } .android-callout-large-description .devsite-landing-row-header-buttons, .android-callout-small-heading .devsite-landing-row-header-buttons { margin-top: 16px; } .android-callout-small-description .devsite-landing-row-description { font: 400 16px / 24px var(--primary-font-family); } .android-callout-featured h3 { font: 600 32px / 40px var(--headline-font-family); letter-spacing: -.25px; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-media { background: var(--android-grey-50); border-radius: var(--item-border-radius); overflow: hidden; padding: 0; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-media video { vertical-align: middle; } .android-callout-value-props .devsite-landing-row-group { grid: auto-flow / repeat(3, 1fr); max-width: 350px; } .android-callout-value-props h3 { font: 600 20px / 24px var(--headline-font-family); } .android-callout-value-props .devsite-landing-row-item-description-content { color: var(--android-grey-700); font-family: var(--headline-font-family); font-size: 15px; line-height: 18px; } .android-illustrated-nav .devsite-landing-row-group { max-width: 1040px; } .android-illustrated-nav .devsite-landing-row-item { border: 2px solid var(--android-grey-200); border-radius: var(--item-border-radius); } .android-illustrated-nav .devsite-landing-row-item::before { border-radius: var(--item-border-radius); } .android-illustrated-nav .devsite-landing-row-item-media { border-radius: calc(var(--item-border-radius) - 2px) calc(var(--item-border-radius) - 2px) 0 0; } .android-illustrated-nav .devsite-landing-row-item-description { padding: 24px; margin: 0; } .android-illustrated-nav .devsite-landing-row-item-description-content { font: 400 20px / 32px var(--headline-font-family); letter-spacing: .25px; } .android-video .devsite-landing-row-item-description { align-self: flex-start; } .android-customer-quote .devsite-landing-row-item, .android-customer-story .devsite-landing-row-item { align-items: center; } .android-customer-quote .devsite-landing-row-item-image, .android-customer-story .devsite-landing-row-item-image, .android-value-props .devsite-landing-row-item-image { border-radius: var(--item-border-radius); overflow: hidden; } .android-customer-quote .devsite-landing-row-item-description-content p:first-child { font-family: var(--headline-font-family); font-size: 24px; font-weight: 500; line-height: 32px; } .android-customer-quote .android-customer-quote-attribution-name { font-weight: 700; margin-bottom: 0; } .android-customer-quote .android-customer-quote-attribution-title { margin: 0; } .android-logo-row { align-items: center; display: flex; grid-gap: 48px; margin: 0 auto; max-width: 640px; } .android-section-inverted h2, .android-section-inverted h3, .android-section-inverted .devsite-landing-row-description, .android-section-inverted .devsite-landing-row-item-description-content, .android-section-inverted:not([background]):not([foreground]) .devsite-landing-row-description { color: white; } .android-section-inverted a { color: var(--android-yellow) !important; } .android-value-props h2 { font: 600 40px / 48px var(--headline-font-family); letter-spacing: -.5px; } .android-value-props h3 { font: 500 24px / 32px var(--headline-font-family); } .android-value-props .devsite-landing-row-item-buttons { margin-top: auto; } /* Page specific styles */ .android-gallery-bluish .devsite-wrapper, .android-gallery-bluish .devsite-product-id-row, .android-gallery-bluish .devsite-doc-set-nav-row, .android-gallery-bluish .android-spotlight-hero { background: var(--bluish); } .android-gallery-purplish .devsite-wrapper, .android-gallery-purplish .devsite-product-id-row, .android-gallery-purplish .devsite-doc-set-nav-row, .android-gallery-purplish .android-split-hero, .android-gallery-purplish:not([background]) { background: var(--purplish); } .android-gallery-purplish .android-section-inverted { background: var(--purplish-grey); } .android-gallery-reddish .devsite-wrapper, .android-gallery-reddish .devsite-product-id-row, .android-gallery-reddish .devsite-doc-set-nav-row, .android-gallery-reddish .android-split-hero { background: var(--reddish); } .android-gallery-reddish .android-section-inverted { background: var(--reddish-grey); } .android-gallery-tealish .devsite-wrapper, .android-gallery-tealish .devsite-product-id-row, .android-gallery-tealish .devsite-doc-set-nav-row, .android-gallery-tealish .android-split-hero { background: var(--tealish); } .android-gallery-tealish .android-section-inverted { background: var(--tealish-grey); } .android-gallery-greenish .devsite-wrapper, .android-gallery-greenish .devsite-product-id-row, .android-gallery-greenish .devsite-doc-set-nav-row, .android-gallery-greenish .android-split-hero { background: var(--greenish); } .android-gallery-greenish .android-section-inverted { background: var(--greenish-grey); } .android-gallery-orangish .devsite-wrapper, .android-gallery-orangish .devsite-product-id-row, .android-gallery-orangish .devsite-doc-set-nav-row, .android-gallery-orangish .android-split-hero { background: var(--orangish); } .android-gallery-orangish .android-section-inverted { background: var(--orangish-grey); } .android-gallery-pinkish .devsite-wrapper, .android-gallery-pinkish .devsite-product-id-row, .android-gallery-pinkish .devsite-doc-set-nav-row, .android-gallery-pinkish .android-split-hero { background: var(--pinkish); } .android-gallery-pinkish .android-section-inverted { background: var(--pinkish-grey); } .android-gallery-cyanish .devsite-wrapper, .android-gallery-cyanish .devsite-product-id-row, .android-gallery-cyanish .devsite-doc-set-nav-row, .android-gallery-cyanish .android-split-hero, .android-section-cyanish, .android-section-cyanish:not([background]) { background: var(--cyanish); } .android-gallery-cyanish .android-section-inverted { background: var(--cyanish-grey); } .android-large-screens-gallery .android-illustrated-nav .devsite-landing-row-item-media { padding: 36px 36px 0; } .android-wear-gallery .android-illustrated-nav .devsite-landing-row-item-media a { padding: 64px 0; text-align: center; } .android-wear-gallery .android-illustrated-nav .devsite-landing-row-item-media img { max-width: 210px; } .android-large-screens-gallery .android-illustrated-nav-social .devsite-landing-row-item-media, .android-wear-gallery .android-illustrated-nav-messaging .devsite-landing-row-item-media { background: var(--purplish); } .android-large-screens-gallery .android-illustrated-nav-media .devsite-landing-row-item-media, .android-wear-gallery .android-illustrated-nav-media .devsite-landing-row-item-media { background: var(--reddish); } .android-large-screens-gallery .android-illustrated-nav-productivity .devsite-landing-row-item-media { background: var(--tealish); } .android-large-screens-gallery .android-illustrated-nav-shopping .devsite-landing-row-item-media, .android-wear-gallery .android-illustrated-nav-fitness-health .devsite-landing-row-item-media { background: var(--greenish); } .android-large-screens-gallery .android-illustrated-nav-reading .devsite-landing-row-item-media { background: var(--orangish); } .android-large-screens-gallery .android-illustrated-nav-creativity .devsite-landing-row-item-media { background: var(--pinkish); } .android-large-screens-gallery .android-illustrated-nav-games .devsite-landing-row-item-media { background: var(--cyanish); } .android-large-screens-overview .android-illustrated-nav .devsite-landing-row-group { grid-gap: 40px 32px; max-width: none; } .android-large-screens-overview .android-hero-image-bar { background: var(--bluish) top / cover url(/images/large-screens/gallery/gallery-header.png); height: 422px; padding-bottom: 33%; } .android-large-screens-social .android-hero-image-bar { background: var(--purplish) top / cover url(/images/large-screens/gallery/social/social-header.png); height: 550px; padding-bottom: 40%; } .android-large-screens-media .android-hero-image-bar { background: var(--reddish) top / cover url(/images/large-screens/gallery/media/media-header.png); height: 540px; padding-bottom: 30%; } .android-large-screens-productivity .android-hero-image-bar { background: var(--tealish) top / cover url(/images/large-screens/gallery/productivity/productivity-header.png); height: 540px; padding-bottom: 30%; } .android-large-screens-shopping .android-hero-image-bar { background: var(--greenish) top / cover url(/images/large-screens/gallery/shopping/shopping-header.png); height: 540px; padding-bottom: 30%; } .android-large-screens-reading .android-hero-image-bar { background: var(--orangish) top / cover url(/images/large-screens/gallery/reading/reading-header.png); height: 540px; padding-bottom: 30%; } .android-large-screens-creativity .android-hero-image-bar { background: var(--pinkish) top / cover url(/images/large-screens/gallery/creativity/creativity-header.png); height: 540px; padding-bottom: 30%; } .android-large-screens-games .android-hero-image-bar { background: var(--cyanish) top / cover url(/images/large-screens/gallery/games/games-header.png); height: 540px; padding-bottom: 30%; } .android-wear-overview .android-hero-image-bar { background: var(--bluish) top / cover url(/images/wear/gallery/new-overview-head.png); height: 360px; padding-bottom: 25%; } .android-wear-fitness-health .android-hero-image-bar { background: var(--greenish) top / cover url(/images/wear/gallery/fitness/new-fitness-header.png); height: 360px; padding-bottom: 25%; } .android-wear-media .android-hero-image-bar { background: var(--reddish) top / cover url(/images/wear/gallery/media/new-media-header.png); height: 360px; padding-bottom: 25%; } .android-wear-messaging .android-hero-image-bar { background: var(--purplish) top / cover url(/images/wear/gallery/messaging/new-messaging-header.png); height: 360px; padding-bottom: 25%; } .android-wear-gallery .android-callout-nav .devsite-landing-row-group { grid-gap: 32px; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-media a { border-radius: var(--item-border-radius); display: flex; justify-content: center; min-height: 266px; padding: 56px 0; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-media picture { display: flex; justify-content: center; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-image { align-self: center; min-width: 210px; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-image img { align-self: center; width: auto; } .android-wear-gallery .android-callout-nav h3 { font: 600 24px / 32px var(--headline-font-family); } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-description-content { font: 400 16px / 24px var(--headline-font-family); letter-spacing: .25px; } .android-wear-gallery .android-callout-nav-fitness-health .devsite-landing-row-item-media a { background: var(--greenish); } .android-wear-gallery .android-callout-nav-media .devsite-landing-row-item-media a { background: var(--reddish); } .android-wear-gallery .android-callout-nav-messaging .devsite-landing-row-item-media a { background: var(--purplish); } .android-wear-gallery .android-watch-faces .devsite-landing-row-item-media { background: var(--android-grey-50); border-radius: var(--item-border-radius); text-align: center; } .android-wear-gallery .android-watch-faces .devsite-landing-row-item-media a { padding: 64px; } .android-wear-gallery .android-watch-faces .devsite-landing-row-item-media img { max-width: 210px; } @media screen and (min-width: 601px) { .android-section-intro-featured h2 { font-size: 64px; letter-spacing: -2.5px; line-height: 70px; margin-bottom: 24px; } .android-section-intro-featured .devsite-landing-row-description { font-size: 20px; line-height: 32px; } .android-callout { font-size: 18px; line-height: 28px; } .android-callout-medium-heading h2 { font: 600 48px / 56px var(--headline-font-family); letter-spacing: -.5px; } .android-callout-large-heading h2 { font: 700 48px / 56px var(--headline-font-family); } .android-callout-xlarge-heading .devsite-landing-row-header-text { max-width: 450px; } .android-callout-xlarge-heading h2 { font-size: 64px; letter-spacing: -2.5px; line-height: 70px; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-media { padding: 0; } .android-callout-value-props .devsite-landing-row-group { max-width: 450px; } .android-callout-value-props h3 { font-size: 24px; line-height: 32px; } .android-callout-value-props .devsite-landing-row-item-description-content { font-size: 18px; line-height: 28px; } .android-description-80 .devsite-landing-row-description { width: 80%; } .android-large-screens-overview .android-section-intro-featured h2 { font-size: 48px; letter-spacing: -.5px; line-height: 56px; } } @media screen and (min-width: 601px) and (max-width: 840px) { .android-wear-gallery .android-callout-nav h3 { font: 600 32px / 40px var(--headline-font-family); letter-spacing: -.25px; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-description-content { font: 400 20px / 32px var(--headline-font-family); } .android-wear-gallery .android-callout-nav .devsite-landing-row-item:last-child:nth-child(2n - 1) { grid-column: span 2; } } @media screen and (min-width: 841px) { .android-split-hero .devsite-landing-row-item-description { grid-column: 1 / span 5; } .android-section-intro-featured h2 { font-size: 80px; line-height: 84px; margin-bottom: 32px; } .android-callout.devsite-landing-row-50 .devsite-landing-row-item-media { grid-column: 7 / span 6; } .android-callout.devsite-landing-row-50 .devsite-landing-row-item-description { grid-column: 1 / span 4; } .android-callout.devsite-landing-row-50 .devsite-landing-row-item-media-left { grid-column: 1 / span 6; } .android-callout.devsite-landing-row-50 .devsite-landing-row-item-media-left + .devsite-landing-row-item-description { grid-column: 8 / span 4; } .android-callout-small-heading h2 { font: 600 32px / 40px var(--headline-font-family); letter-spacing: -.25px; } .android-callout-large-heading h2 { font: 700 64px / 72px var(--headline-font-family); } .android-callout-xlarge-heading .devsite-landing-row-header-text { max-width: 700px; } .android-callout-xlarge-heading h2 { font-size: 80px; line-height: 84px; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-description { grid-column: 1 / span 4; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-media { grid-column: 6 / span 7; } .android-callout-value-props .devsite-landing-row-group { max-width: 550px; } .android-callout-value-props h3 { font-size: 32px; line-height: 40px; } .android-illustrated-nav .devsite-landing-row-item-description { padding: 32px; } .android-customer-quote.devsite-landing-row-50 .devsite-landing-row-item-media, .android-customer-story.devsite-landing-row-50 .devsite-landing-row-item-media { grid-column: 7 / span 6; } .android-customer-quote.devsite-landing-row-50 .devsite-landing-row-item-description, .android-customer-story.devsite-landing-row-50 .devsite-landing-row-item-description { grid-column: 1 / span 5; } .android-customer-quote.devsite-landing-row-50 .devsite-landing-row-item-media-left, .android-customer-story.devsite-landing-row-50 .devsite-landing-row-item-media-left { grid-column: 1 / span 6; } .android-customer-quote.devsite-landing-row-50 .devsite-landing-row-item-media-left + .devsite-landing-row-item-description, .android-customer-story.devsite-landing-row-50 .devsite-landing-row-item-media-left + .devsite-landing-row-item-description { grid-column: 8 / span 5; } .android-row-padding-top-xxlarge { padding-top: 120px; } .android-row-padding-bottom-xxlarge { padding-bottom: 120px; } .android-value-props h2 { font: 600 48px / 56px var(--headline-font-family); } .android-large-screens-overview .android-section-intro-featured h2 { font-size: 64px; font-weight: 700; line-height: 72px; } .android-large-screens-gallery .android-illustrated-nav .devsite-landing-row-item-media { padding: 54px 54px 0; } .android-wear-gallery .android-illustrated-nav .devsite-landing-row-item-media a { padding: 72px 0; } .android-large-screens-overview .android-illustrated-nav .devsite-landing-row-item-media { padding: 66px 66px 0; } .android-wear-gallery .android-callout-nav h3 { font: 600 32px / 40px var(--headline-font-family); letter-spacing: -.25px; } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-description-content { font: 400 20px / 32px var(--headline-font-family); } .android-wear-gallery .android-callout-nav .devsite-landing-row-item-media a { min-height: 504px; } .android-wear-gallery .android-callout-nav .devsite-landing-row-group { max-width: 1040px; } .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-group { grid-gap: 80px; grid-template-columns: 1fr; } .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-item { align-items: center; display: grid; grid-gap: 80px; grid-template-columns: 1fr 1fr; } .android-wear-gallery.android-wear-overview .android-callout-nav h3 { font: 600 40px / 48px var(--headline-font-family); letter-spacing: -.5px; } .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-item-media a { min-height: 456px; } .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-item-media, .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-item-description { grid-column: auto; margin: 0; } .android-wear-gallery.android-wear-overview .android-callout-nav .devsite-landing-row-item-buttons { margin: 0; margin-inline-start: -12px; } .android-wear-gallery .android-watch-faces .devsite-landing-row-item-media a { padding: 32px; } } @media screen and (min-width: 1281px) { .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-description { grid-column: 1 / span 3; } .android-callout-featured.devsite-landing-row-50 .devsite-landing-row-item-media { grid-column: 5 / span 8; padding: 0; } .android-wear-gallery .android-illustrated-nav .devsite-landing-row-item-media a { padding: 144px 0; } .android-large-screens-overview .android-illustrated-nav .devsite-landing-row-group { grid-template-columns: repeat(12, 1fr); } .android-large-screens-overview .android-illustrated-nav .devsite-landing-row-item:nth-child(odd) { grid-column: 2 / span 5; } .android-large-screens-overview .android-illustrated-nav .devsite-landing-row-item:nth-child(even) { grid-column: 7 / span 5; } } @media screen and (max-width: 840px) { .android-split-hero .devsite-landing-row-item-media + .devsite-landing-row-item-description { padding: 0; } .android-large-screens-overview .android-hero-image-bar, .android-large-screens-social .android-hero-image-bar, .android-large-screens-media .android-hero-image-bar, .android-large-screens-productivity .android-hero-image-bar, .android-large-screens-shopping .android-hero-image-bar, .android-large-screens-reading .android-hero-image-bar, .android-large-screens-creativity .android-hero-image-bar, .android-large-screens-games .android-hero-image-bar { height: 320px; } } @media screen and (max-width: 600px) { .android-callout .devsite-landing-row-item, .android-customer-quote .devsite-landing-row-item, .android-customer-story .devsite-landing-row-item { grid-gap: 32px; } .android-customer-quote .devsite-landing-row-item, .android-customer-story .devsite-landing-row-item { display: flex; } .android-customer-quote .devsite-landing-row-item-media, .android-customer-story .devsite-landing-row-item-media { order: 2 !important; } .android-customer-quote .devsite-landing-row-item-description, .android-customer-story .devsite-landing-row-item-description { order: 1 !important; } .android-large-screens-overview .android-hero-image-bar, .android-large-screens-social .android-hero-image-bar, .android-large-screens-media .android-hero-image-bar, .android-large-screens-productivity .android-hero-image-bar, .android-large-screens-shopping .android-hero-image-bar, .android-large-screens-reading .android-hero-image-bar, .android-large-screens-creativity .android-hero-image-bar, .android-large-screens-games .android-hero-image-bar { height: 210px; } .android-large-screens-overview .android-image-bar { height: 320px; } } </style> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developer.android.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Android Developers" > Android Developers </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/design" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="" > Design & Plan </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/design/ui" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="UI Design" > UI Design </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/design/ui/large-screens" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="Large Screens" > Large Screens </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/large-screens/gallery" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="5" track-type="globalNav" track-name="breadcrumb" track-metadata-position="5" track-metadata-eventdetail="Gallery" > Gallery </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.android.com/large-screens/gallery/media" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="6" track-type="globalNav" track-name="breadcrumb" track-metadata-position="6" track-metadata-eventdetail="" > Media </a> </li> </ul> </div> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded disabled> </devsite-toc> <div class="devsite-article-body clearfix "> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-hero devsite-landing-row-75 devsite-landing-row-no-image-background android-decorative-media android-split-hero android-row-padding-top-xlarge-bottom-large" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/icons/media.svg" srcset="https://developer.android.com/static/images/large-screens/gallery/icons/media.svg" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 342px" fetchpriority="high"> </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="media" data-text="Media" class="hide-from-toc no-link" tabindex="0"> Media </h3> <div class="devsite-landing-row-item-description-content"> Create a big-screen media experience on large screen devices. </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up android-hero-image-bar" header-position="top" > <div class="devsite-landing-row-inner"> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-header-centered devsite-landing-row-large-headings devsite-landing-row-padding-xlarge android-row-padding-bottom-xxlarge android-row-padding-top-xxlarge android-section-intro-featured" header-position="top" > <div class="devsite-landing-row-inner"> <header class="devsite-landing-row-header" > <div class="devsite-landing-row-header-text"> <div class="devsite-landing-row-description"> The big screen is the ultimate viewing experience for motion pictures, animated feature films, and even television. Give your users a better viewing experience with the big screens of tablets, foldables, and ChromeOS devices. Enhance the listening experience of audio media with playlists and photos. Make all kinds of media more discoverable, more enjoyable in a display area that maximizes the media experience. </div> </div> </header> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-callout-featured" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media"> <video autoplay loop muted playsinline> <source src="/static/videos/large-screens/gallery/Media-Discover-Hero.mp4" type="video/mp4"> </video> </div> <div class="devsite-landing-row-item-description"> <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-labels"> <span>Feed</span> </div> <h3 id="media" class="hide-from-toc no-link" tabindex="-1" data-text="Media discovery"> Media discovery </h3> <div class="devsite-landing-row-item-description-content"> Create a rich media feed that enables users to discover new content, new artists, new recommendations and reviews, with more to see, more to choose from on large screens. </div> <div class="devsite-landing-row-item-buttons"> <a class="button button-white" href="https://material.io/foundations/layout/canonical-layouts/feed" > Learn about feed layout design </a> <a class="button button-white" href="/guide/topics/large-screens/large-screen-canonical-layouts#feed" > Implement a feed layout </a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-row-padding-bottom-xxlarge" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media devsite-landing-row-item-media-left "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/media-browsing.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/media-browsing_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-labels"> <span class=" " >Feed</span> </div> <h3 id="media-browsing" data-text="Media browsing" class="hide-from-toc no-link" tabindex="0"> Media browsing </h3> <div class="devsite-landing-row-item-description-content"> Create a media kiosk that lets users browse, sort, filter, and select their favorite movies, music, or TV shows from an extensive media collection on a big-production display. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://material.io/foundations/layout/canonical-layouts/feed" class="button button-white " >Learn about feed layout design</a> <a href="https://developer.android.com/guide/topics/large-screens/large-screen-canonical-layouts#feed" class="button button-white " >Implement a feed layout</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-row-padding-bottom-xxlarge" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/media+.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/media+_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/media+_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/media+_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/media+_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/media+_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/media+_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/media+_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/media+_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/media+_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/media+_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/media+_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-labels"> <span class=" " >Supporting pane</span> </div> <h3 id="media" data-text="Media+" class="hide-from-toc no-link" tabindex="0"> Media+ </h3> <div class="devsite-landing-row-item-description-content"> Enhance the media viewing or listening experience in the expanded space of large screens with a scrolling list of similar titles, published reviews, or additional works by the same artists or actors. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://material.io/foundations/layout/canonical-layouts/supporting-pane" class="button button-white " >Learn about supporting pane design</a> <a href="https://developer.android.com/guide/topics/large-screens/large-screen-canonical-layouts#supporting_pane" class="button button-white " >Implement a supporting pane layout</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-row-padding-bottom-xxlarge" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media devsite-landing-row-item-media-left "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/immersive-mode_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-labels"> <span class=" " >Supporting pane</span> </div> <h3 id="immersive-mode" data-text="Immersive mode" class="hide-from-toc no-link" tabindex="0"> Immersive mode </h3> <div class="devsite-landing-row-item-description-content"> Embed a supporting pane for context, relevance, or reference while maintaining an immersive viewing experience. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://material.io/foundations/layout/canonical-layouts/supporting-pane" class="button button-white " >Learn about supporting pane design</a> <a href="https://developer.android.com/guide/topics/large-screens/large-screen-canonical-layouts#supporting_pane" class="button button-white " >Implement a supporting pane layout</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/easy-exploration_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-labels"> <span class=" " >List-Detail</span> </div> <h3 id="easy-exploration" data-text="Easy exploration" class="hide-from-toc no-link" tabindex="0"> Easy exploration </h3> <div class="devsite-landing-row-item-description-content"> Create an interactive media browser to make media searches productive and engaging. Enable users to browse while watching or listening. With a large screen layout, display a collection of media titles side by side with a playing video or audio file to give users a preview or quick listen of selection after selection. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://material.io/foundations/layout/canonical-layouts/list-detail" class="button button-white " >Learn about list-detail design</a> <a href="https://developer.android.com/guide/topics/large-screens/large-screen-canonical-layouts#list-detail" class="button button-white " >Implement a list-detail layout</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-header-centered devsite-landing-row-100 devsite-landing-row-large-headings devsite-landing-row-padding-xlarge android-row-padding-top-xxlarge android-section-intro-featured android-section-inverted" header-position="top" > <div class="devsite-landing-row-inner"> <header class="devsite-landing-row-header" > <div class="devsite-landing-row-header-text"> <h2 id="differentiated-experiences" data-text="Differentiated experiences" tabindex="0"> Differentiated experiences </h2> <div class="devsite-landing-row-description"> Distinctive features and capabilities not possible on small screen devices. </div> </div> </header> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-row-padding-bottom-xxlarge android-section-inverted" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media devsite-landing-row-item-media-left "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/tabletop.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/tabletop_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/tabletop_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="tabletop" data-text="Tabletop" class="hide-from-toc no-link" tabindex="0"> Tabletop </h3> <div class="devsite-landing-row-item-description-content"> Let users lean back and enjoy their favorite content with tabletop posture on foldables. Place playback media above the fold, controls and supplementary content below, for a hands-free viewing or listening experience. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://m3.material.io/foundations/layout/applying-layout/window-size-classes" class="button button-white " >Learn about foldable device design</a> <a href="https://developer.android.com/guide/topics/large-screens/make-apps-fold-aware#tabletop_mode" class="button button-white " >See “Make your app fold aware”</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-row-padding-bottom-xxlarge android-section-inverted" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/picture-in-picture_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="picture-in-picture" data-text="Picture-in-picture" class="hide-from-toc no-link" tabindex="0"> Picture-in-picture </h3> <div class="devsite-landing-row-item-description-content"> Bring the small screen to the big screen so users can watch and work, learn and do at the same time. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://developer.android.com/develop/ui/views/picture-in-picture" class="button button-white " >See “Picture-in-picture (PIP) support”</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-border-radius-opt-out android-callout android-section-inverted" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media devsite-landing-row-item-media-left "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/media/multi-window.png" srcset="https://developer.android.com/static/images/large-screens/gallery/media/multi-window_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/media/multi-window_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="multi-window" data-text="Multi-window" class="hide-from-toc no-link" tabindex="0"> Multi-window </h3> <div class="devsite-landing-row-item-description-content"> Let users multitask with two apps side by side to browse a collection of movies while checking out casts and characters, or listen to music while searching for covers or the latest music news and reviews. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://developer.android.com/develop/ui/compose/layouts/adaptive/support-multi-window-mode" class="button button-white " >See “Support multi-window mode”</a> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-header-centered devsite-landing-row-100 devsite-landing-row-large-headings devsite-landing-row-padding-xlarge android-callout-centered android-callout-centered-full-width android-callout-large-heading android-row-padding-bottom-xxlarge" header-position="top" > <div class="devsite-landing-row-inner"> <header class="devsite-landing-row-header" > <div class="devsite-landing-row-header-text"> <h2 id="customer-stories" data-text="Customer stories" tabindex="0"> Customer stories </h2> </div> </header> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-customer-quote android-row-padding-bottom-xxlarge" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media devsite-landing-row-item-media-left"> <figure class="devsite-landing-row-item-image"> <img alt src="/static/images/large-screens/gallery/media/Better_Together_Disney.gif"> </figure> </div> <div class="devsite-landing-row-item-description" icon-position="top"> <div class="devsite-landing-row-item-icon-container"> <img alt="" class="devsite-landing-row-item-icon" src="/static/images/large-screens/gallery/logos/disney.png" srcset="https://developer.android.com/static/images/large-screens/gallery/logos/disney.png 1x,https://developer.android.com/static/images/large-screens/gallery/logos/Disney2x.png 2x" /> </div> <div class="devsite-landing-row-item-body"> <div class="devsite-landing-row-item-description-content"> <p> “We wanted the app to be available on every screen so that our users can enjoy the content regardless of their device. From the beginning we intended to support every screen: from phones to Chromebooks to TV, and everything in between.” </p> <p class="android-customer-quote-attribution-name"> Erik Wallentinsen </p> <p class="android-customer-quote-attribution-title"> Sr. Director, Software Engineering at Disney Streaming </p> </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-50 devsite-landing-row-no-image-background android-customer-story" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media"> <div> <iframe class="devsite-embedded-youtube-video" data-video-id="9_vbo6BZ0VU"></iframe> </div> </div> <div class="devsite-landing-row-item-description" icon-position="top"> <div class="devsite-landing-row-item-icon-container"> <img alt="" class="devsite-landing-row-item-icon" src="/static/images/large-screens/gallery/logos/spotify.png" srcset="https://developer.android.com/static/images/large-screens/gallery/logos/spotify.png 1x,https://developer.android.com/static/images/large-screens/gallery/logos/Spotify2x.png 2x" /> </div> <div class="devsite-landing-row-item-body"> <h3 id="android-developer-story:-spotify-across-screens" data-text=" Android Developer Story: Spotify across screens " tabindex="-1"> Android Developer Story: Spotify across screens </h3> <div class="devsite-landing-row-item-description-content"> Spotify’s mission is to connect millions of creators to billions of fans. Learn more about how supporting the full range of Android devices and form factors, including tablets, foldables, ChromeOS, Wear OS, Android TV, and Android for Cars—as well as integrating the voice capabilities of Google Assistant—is helping Spotify achieve its mission. </div> </div> </div> </div> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-html"> <hr> </div> </div> </section> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-header-centered devsite-landing-row-100 devsite-landing-row-large-headings android-callout-centered android-callout-xlarge-heading" header-position="top" > <div class="devsite-landing-row-inner"> <header class="devsite-landing-row-header" > <div class="devsite-landing-row-header-text"> <h2 id="build-better-with-span-classandroid-highlightandroidspan" data-text="Build better with Android" tabindex="0"> Build better with <span class="android-highlight">Android</span> </h2> </div> </header> </div> </section> <section class="devsite-landing-row devsite-landing-row-2-up devsite-landing-row-no-image-background android-illustrated-nav" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item android-illustrated-nav-productivity fully-clickable" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/nav/productivity.png" srcset="https://developer.android.com/static/images/large-screens/gallery/nav/productivity_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/nav/productivity_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" icon-position="top" > <div class="devsite-landing-row-item-icon-container" size="medium" > <picture> <img class="devsite-landing-row-item-icon" alt="" src="https://developer.android.com/static/images/large-screens/gallery/icons/productivity.svg" srcset="https://developer.android.com/static/images/large-screens/gallery/icons/productivity.svg" sizes="64px" loading="lazy" > </picture> </div> <div class="devsite-landing-row-item-body"> <h3 id="productivity" data-text="Productivity" class="hide-from-toc no-link" tabindex="0"> Productivity </h3> <div class="devsite-landing-row-item-description-content"> Increase user productivity with multitasking and drag and drop on expansive large screens. Show more tools, controls, history, comments, more of everything users need to be productive. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://developer.android.com/large-screens/gallery/productivity" class="button button-white " >Learn more</a> </div> </div> </div> </div> <div class="devsite-landing-row-item android-illustrated-nav-shopping fully-clickable" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <picture> <img alt="" src="https://developer.android.com/static/images/large-screens/gallery/nav/shopping.png" srcset="https://developer.android.com/static/images/large-screens/gallery/nav/shopping_36.png 36w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_48.png 48w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_72.png 72w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_96.png 96w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_480.png 480w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_720.png 720w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_856.png 856w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_960.png 960w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_1440.png 1440w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_1920.png 1920w,https://developer.android.com/static/images/large-screens/gallery/nav/shopping_2880.png 2880w" sizes="(max-width: 600px) 100vw, (max-width: 840px) 50vw, 708px" loading="lazy" > </picture> </figure> </div> <div class="devsite-landing-row-item-description" icon-position="top" > <div class="devsite-landing-row-item-icon-container" size="medium" > <picture> <img class="devsite-landing-row-item-icon" alt="" src="https://developer.android.com/static/images/large-screens/gallery/icons/shopping.svg" srcset="https://developer.android.com/static/images/large-screens/gallery/icons/shopping.svg" sizes="64px" loading="lazy" > </picture> </div> <div class="devsite-landing-row-item-body"> <h3 id="shopping" data-text="Shopping" class="hide-from-toc no-link" tabindex="0"> Shopping </h3> <div class="devsite-landing-row-item-description-content"> Present users with a bigger showroom for window shopping, side-by-side comparisons, search and discovery, and sharing bargains with friends. </div> <div class="devsite-landing-row-item-buttons"> <a href="https://developer.android.com/large-screens/gallery/shopping" class="button button-white " >Learn more</a> </div> </div> </div> </div> </div> </div> </section> <devsite-hats-survey class="nocontent" hats-id="VxqvKSur40kxBYCLVTd0SSGykbno" listnr-id="5207477"></devsite-hats-survey> </div> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-notification link="https://google.qualtrics.com/jfe/form/SV_cRR9tonbkUQYb5Q?link=dac" link-text="Take survey" message="Please help us improve the Android Developer experience by taking a short survey." > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],[],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> <nav class="devsite-footer-promos nocontent" aria-label="Promotions"> <ul class="devsite-footer-promos-list"> <li class="devsite-footer-promo"> <a href="//x.com/AndroidDev" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer X Promo" > <picture> <source class="devsite-dark-theme" srcset="https://developer.android.com/_static/android/images/logo-x_dt.svg" media="(prefers-color-scheme: dark)" loading="lazy" alt="X"> <img class="devsite-footer-promo-icon" src="/_static/android/images/logo-x.svg" loading="lazy" alt="X"> </picture> <span class="devsite-footer-promo-label"> X </span> </a> <div class="devsite-footer-promo-description">Follow @AndroidDev on X</div> </li> <li class="devsite-footer-promo"> <a href="//www.youtube.com/user/androiddevelopers" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer YouTube Promo" > <picture> <source class="devsite-dark-theme" srcset="https://developer.android.com/_static/android/images/logo-youtube_dt.svg" media="(prefers-color-scheme: dark)" loading="lazy" alt="YouTube"> <img class="devsite-footer-promo-icon" src="//www.gstatic.com/images/icons/material/product/2x/youtube_48dp.png" loading="lazy" alt="YouTube"> </picture> <span class="devsite-footer-promo-label"> YouTube </span> </a> <div class="devsite-footer-promo-description">Check out Android Developers on YouTube</div> </li> <li class="devsite-footer-promo"> <a href="//www.linkedin.com/showcase/androiddev" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer LinkedIn Promo" > <picture> <source class="devsite-dark-theme" srcset="https://developer.android.com/_static/android/images/logo-linkedin_dt.svg" media="(prefers-color-scheme: dark)" loading="lazy" alt="LinkedIn"> <img class="devsite-footer-promo-icon" src="/_static/android/images/logo-linkedin.svg" loading="lazy" alt="LinkedIn"> </picture> <span class="devsite-footer-promo-label"> LinkedIn </span> </a> <div class="devsite-footer-promo-description">Connect with the Android Developers community on LinkedIn</div> </li> </ul> </nav> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">More Android</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="//www.android.com" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Android </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//www.android.com/enterprise/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Android for Enterprise </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//www.android.com/security-center/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Security </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//source.android.com" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Source </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/news" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 5)" > News </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//android-developers.googleblog.com/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 6)" > Blog </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/podcasts" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 7)" > Podcasts </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Discover</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/games" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Gaming </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/ml" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Machine Learning </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/health-and-fitness" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Health & Fitness </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/media" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Camera & Media </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/privacy" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 5)" > Privacy </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/training/connectivity/5g" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 6)" > 5G </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Android Devices</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/large-screens" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Large screens </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/wear" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Wear OS </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/chrome-os" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > ChromeOS devices </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/cars" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Android for cars </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/tv" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 5)" > Android TV </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Releases</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/15" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Android 15 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/14" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Android 14 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/13" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Android 13 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/12" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Android 12 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/11" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 5)" > Android 11 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/10" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 6)" > Android 10 </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/about/versions/pie" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 7)" > Pie </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Documentation and Downloads</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/studio/intro" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Android Studio guide </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/guide" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Developers guides </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/reference" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > API reference </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/studio" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Download Studio </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/ndk" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 5)" > Android NDK </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Support</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="//issuetracker.google.com/issues/new?component=190923&template=841312" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Report platform bug </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//issuetracker.google.com/issues/new?component=192697" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Report documentation bug </a> </li> <li class="devsite-footer-linkbox-item"> <a href="//support.google.com/googleplay/android-developer" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Google Play support </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://g.co/userresearch/androiddeveloperfooter" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Join research studies </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-sites" aria-label="Other Google Developers websites"> <a href="https://developers.google.com/" class="devsite-footer-sites-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Developers Link"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup-google-for-developers-dark-theme.svg" media="(prefers-color-scheme: none)" class="devsite-dark-theme" loading="lazy" alt="Google Developers"> <img class="devsite-footer-sites-logo" src="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup-google-for-developers.svg" loading="lazy" alt="Google Developers"> </picture> </a> <ul class="devsite-footer-sites-list"> <li class="devsite-footer-sites-item"> <a href="//developer.android.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Android Link" > Android </a> </li> <li class="devsite-footer-sites-item"> <a href="//developer.chrome.com/home" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Chrome Link" > Chrome </a> </li> <li class="devsite-footer-sites-item"> <a href="//firebase.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Firebase Link" > Firebase </a> </li> <li class="devsite-footer-sites-item"> <a href="//cloud.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Cloud Platform Link" > Google Cloud Platform </a> </li> <li class="devsite-footer-sites-item"> <a href="//developers.google.com/products/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer All products Link" > All products </a> </li> </ul> </nav> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="/license" data-category="Site-Wide Custom Events" data-label="Footer License link" > License </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="/distribute/marketing-tools/brand-guidelines" data-category="Site-Wide Custom Events" data-label="Footer Brand guidelines link" > Brand guidelines </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> <li class="devsite-footer-utility-item devsite-footer-utility-button"> <span class="devsite-footer-utility-description">Get news and tips by email</span> <a class="devsite-footer-utility-link gc-analytics-event" href="/updates" data-category="Site-Wide Custom Events" data-label="Footer Subscribe link" > Subscribe </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [{"id": "G-QFRN08RN6E", "purpose": 0}], "ga4p": [{"id": "G-QFRN08RN6E", "purpose": 0}], "gtm": [{"id": "GTM-KMSWPCJ", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Gallery", "signedIn": "False", "tenant": "android", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <android-fully-clickable target=" .android-case-study .devsite-landing-row-item, .android-grouped-resources .devsite-landing-row-item, .android-grouped-resources-contained--primary .devsite-landing-row-item, .android-grouped-resources-contained--secondary .devsite-landing-row-item, .android-grouped-resources-contained--tertiary .devsite-landing-row-item, .android-grouped-resources-uncontained--primary .devsite-landing-row-item, .android-grouped-resources-uncontained--secondary .devsite-landing-row-item, .android-grouped-resources-uncontained--tertiary .devsite-landing-row-item, .android-guide-cards .devsite-landing-row-item, .android-illustrated-resources-index .devsite-landing-row-item, .android-illustrated-resources-primary .devsite-landing-row-item, .android-illustrated-resources-secondary .devsite-landing-row-item, .android-illustrated-resources-secondary-small .devsite-landing-row-item, .android-illustrated-resources-tertiary .devsite-landing-row-item, .android-illustrated-resources-tertiary-small .devsite-landing-row-item, .android-promo .devsite-landing-row-item, .android-quick-link, .android-samples .devsite-card-wrapper, .fully-clickable" watch=".android-samples, devsite-content"></android-fully-clickable> <script nonce="tH+42abHh4PrKNDGwtvySLy+8L4QBU"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/js/app_loader.js', '[3,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android","https://android-dot-devsite-v2-prod.appspot.com",1,null,["/_pwa/android/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/favicon.svg","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/android/images/lockup.svg","https://fonts.googleapis.com/css?family=Google+Sans:400,500,600,700|Google+Sans+Text:400,400italic,500,500italic,600,600italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyAP-jjEJBzmIyKR4F-3XITp8yM9T1gEEI8","AIzaSyB6xiKGDR5O3Ak2okS4rLkauxGUG7XP0hg","developer.android.com","AIzaSyAQk0fBONSGUqCNznf6Krs82Ap1-NV6J4o","AIzaSyCCxcqdrZ_7QMeLCRY20bh_SXdAYqy70KY",null,null,null,["Search__enable_suggestions_from_borg","DevPro__enable_cloud_innovators_plus","Search__enable_ai_search_summaries","MiscFeatureFlags__enable_explain_this_code","Profiles__enable_dashboard_curated_recommendations","Experiments__reqs_query_experiments","TpcFeatures__enable_mirror_tenant_redirects","Cloud__enable_cloud_facet_chat","Profiles__enable_join_program_group_endpoint","EngEduTelemetry__enable_engedu_telemetry","CloudShell__cloud_shell_button","Concierge__enable_pushui","Cloud__enable_cloudx_ping","Significatio__enable_by_tenant","Profiles__require_profile_eligibility_for_signin","Cloud__enable_cloud_shell","MiscFeatureFlags__developers_footer_dark_image","Cloud__enable_legacy_calculator_redirect","Search__enable_page_map","CloudShell__cloud_code_overflow_menu","TpcFeatures__enable_unmirrored_page_left_nav","Profiles__enable_complete_playlist_endpoint","Profiles__enable_page_saving","MiscFeatureFlags__enable_firebase_utm","Profiles__enable_profile_collections","Cloud__enable_cloud_shell_fte_user_flow","DevPro__enable_developer_subscriptions","Cloud__enable_cloud_dlp_service","Profiles__enable_completecodelab_endpoint","MiscFeatureFlags__developers_footer_image","Profiles__enable_release_notes_notifications","MiscFeatureFlags__enable_project_variables","Cloud__enable_free_trial_server_call","Profiles__enable_public_developer_profiles","Search__enable_ai_eligibility_checks","Search__enable_dynamic_content_confidential_banner","Profiles__enable_awarding_url","MiscFeatureFlags__enable_dark_theme","Cloud__enable_cloudx_experiment_ids","Cloud__enable_llm_concierge_chat","BookNav__enable_tenant_cache_key","Profiles__enable_recognition_badges","MiscFeatureFlags__enable_variable_operator","Profiles__enable_stripe_subscription_management","MiscFeatureFlags__enable_view_transitions","Profiles__enable_developer_profiles_callout","Analytics__enable_clearcut_logging","MiscFeatureFlags__emergency_css","Profiles__enable_completequiz_endpoint"],null,null,"AIzaSyBLEMok-5suZ67qRPzx0qUtbnLmyT_kCVE","https://developerscontentserving-pa.googleapis.com","AIzaSyCM4QpTRSqP5qI4Dvjt4OAScIN8sOUlO-k","https://developerscontentsearch-pa.googleapis.com",2,4,null,"https://developerprofiles-pa.googleapis.com",[3,"android","Android Developers","developer.android.com",null,"android-dot-devsite-v2-prod.appspot.com",null,null,[null,1,null,null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],[1,null,null,[1,20],"/recommendations"],null,null,null,[1,null,1],[1,1,null,1,1]],null,[18,null,null,null,null,null,"/images/lockup.svg","/images/touchicon-180.png",null,null,null,null,null,null,null,null,null,null,null,null,null,2,null,null,null,"/images/lockup-dark-theme.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[6,1,14,15,20,22,23,28,29,37,43],null,[[null,null,1],[1,1]],[[null,null,null,null,null,null,null,[["G-QFRN08RN6E"],null,null,[["G-QFRN08RN6E",1]]],null,null,null,null,1],null,[[1,1],[2,2]]],null,4,null,null,null,null,null,null,null,null,null,null,null,null,null,"android.devsite.google"],null,"pk_live_5170syrHvgGVmSx9sBrnWtA5luvk9BwnVcvIi7HizpwauFG96WedXsuXh790rtij9AmGllqPtMLfhe2RSwD6Pn38V00uBCydV4m",1]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Media | Gallery | Android Developers