android 平板 桌面应用,平板电脑和桌面应用的布局

平板电脑和桌面应用的布局Layout for Tablet and Desktop apps

02/01/2016

本文内容

Xamarin.Forms 支持在受支持的平台上使用的所有设备类型，因此除了手机外，应用程序还可以在以下设备上运行：Xamarin.Forms supports all device types available on the supported platforms, so in addition to phones, apps can also run on:

IpadiPads,

Android 平板电脑、Android tablets,

运行 Windows 10) (windows 平板电脑和台式计算机。Windows tablets and desktop computers (running Windows 10).

本页简要讨论：This page briefly discusses:

支持的 设备类型和the supported device types, and

如何 优化 平板电脑与手机的布局。how to optimize layouts for tablets versus phones.

设备类型Device Types

更大的屏幕设备可用于支持的所有平台 Xamarin.Forms 。Larger screen devices are available for all of the platforms supported by Xamarin.Forms.

Ipad (iOS)iPads (iOS)

该 Xamarin.Forms 模板通过将 Info.plist > 设备 设置配置为 通用 (自动包含 iPad 支持。这意味着) 支持 iPhone 和 iPad。The Xamarin.Forms template automatically includes iPad support by configuring the Info.plist > Devices setting to Universal (which means both iPhone and iPad are supported).

若要提供令人愉快的启动体验，并确保所有设备上都使用了全屏幕分辨率，应确保在 (使用情节提要) 提供 iPad 特定的启动屏幕 。To provide a pleasant startup experience, and ensure the full screen resolution is used on all devices, you should make sure an iPad-specific launch screen (using a storyboard) is provided. 这可确保在 iPad 迷你、iPad 和 iPad Pro 设备上正确呈现应用。This ensures the app is rendered correctly on iPad mini, iPad, and iPad Pro devices.

在 iOS 9 之前，所有应用程序都在设备上占用整个屏幕，但有些 Ipad 现在可以执行 拆分屏幕多任务。Prior to iOS 9 all apps took up the full screen on the device, but some iPads can now perform split screen multitasking.

这意味着，你的应用程序可能会在屏幕的一侧(50% 的宽度)或整个屏幕上只占用一个超薄柱形。This means your app could take up just a slim column on the side of the screen, 50% of the width of the screen, or the entire screen.

拆分屏幕功能意味着您应该将您的应用程序设计为在最大宽度为320像素的情况下正常工作，或者尽可能多1366像素。Split-screen functionality means you should design your app to work well with as little as 320 pixels wide, or as much as 1366 pixels wide.

Android 平板电脑Android Tablets

Android 生态系统提供多种受支持的屏幕大小(从小手机到大平板电脑)。The Android ecosystem has a myriad of supported screen sizes, from small phones up to large tablets. Xamarin.Forms 可以支持所有屏幕大小，但与其他平台一样，你可能需要调整更大设备的用户界面。Xamarin.Forms can support all screen sizes, but as with the other platforms you might want to adjust your user interface for larger devices.

支持许多不同的屏幕分辨率时，可以提供不同大小的本机映像资源来优化用户体验。When supporting many different screen resolutions, you can provide your native image resources in different sizes to optimize the user experience.

查看 android 资源 文档 (并且特别 为不同的屏幕大小创建资源) 详细了解如何在 Android 应用程序项目中构造文件夹和文件名，以便在应用中包含优化的映像资源。Review the Android resources documentation (and in particular creating resources for varying screen sizes) for more information on how to structure the folders and filenames in your Android app project to include optimized image resources in your app.

Windows 平板电脑和桌面Windows Tablets and Desktops

若要支持运行 Windows 的平板电脑和台式计算机，你将需要使用 WINDOWS UWP 支持，该支持生成在 windows 10 上运行的通用应用。To support tablets and desktop computers running Windows, you'll need to use Windows UWP support, which builds universal apps that run on Windows 10.

除了运行全屏外，还可以将 Windows 平板电脑和桌面上运行的应用调整为任意尺寸。Apps running on Windows tablets and desktops can be resized to arbitrary dimensions in addition to running full-screen.

为平板电脑和桌面优化Optimize for Tablet and Desktop

你可以根据 Xamarin.Forms 手机或平板电脑/桌面设备是否正在使用来调整你的用户界面。You can adjust your Xamarin.Forms user interface depending on whether a phone or tablet/desktop device is being used. 这意味着你可以优化大屏幕设备(如平板电脑和台式计算机)的用户体验。This means you can optimize the user-experience for large-screen devices such as tablets and desktop computers.

Device。Device.Idiom

可以使用 Device 类更改应用或用户界面的行为。You can use the Device class to change the behavior of your app or user interface. 使用 Device.Idiom 枚举可以Using the Device.Idiom enumeration you can

if (Device.Idiom == TargetIdiom.Phone)

{

HeroImage.Source = ImageSource.FromFile("hero.jpg");

} else {

HeroImage.Source = ImageSource.FromFile("herotablet.jpg");

}

此方法可以进行扩展，以对单个页面布局进行重大更改，甚至在较大屏幕上呈现完全不同的页面。This approach can be expanded to make significant changes to individual page layouts, or even to render entirely different pages on larger screens.

利用 FlyoutPageLeverage FlyoutPage

适用 FlyoutPage 于更大的屏幕，特别是在 iPad 上，它使用 UISplitViewController 提供本机 iOS 体验。The FlyoutPage is ideal for larger screens, especially on the iPad where it uses the UISplitViewController to provide a native iOS experience.

查看 此 Xamarin 博客文章 ，了解如何改编你的用户界面，以便手机使用一种布局，较大的屏幕可以将其他 (与) 配合使用 FlyoutPage 。Review this Xamarin blog post to see how you can adapt your user interface so that phones use one layout and larger screens can use another (with the FlyoutPage).

相关链接Related Links