Ionic 2 大屏幕分辨率应用程序

Question

我想制作一个 web 应用程序，管理员喜欢 ionic 应用程序，适用于高分辨率的显示器屏幕，但 ionic 主要是为移动应用程序设计的，我该如何布局我的应用程序以便将来我可以删除一些列并使其也适合移动应用分辨率。

有没有一种方法可以检查分辨率大小并据此决定显示或隐藏某些内容。

麦克

Answer 1

您可以使用平台信息决定布局的显示方式：

Platform Name  Description
android        on a device running Android.
cordova        on a device running Cordova.
core           on a desktop device.
ios            on a device running iOS.
ipad           on an iPad device.
iphone         on an iPhone device.
mobile         on a mobile device.
mobileweb      in a browser on a mobile device.
phablet        on a phablet device.
tablet         on a tablet device.
windows        on a device running Windows.

如果应用程序显示在台式机（核心）或平板电脑（ipad 或平板电脑）等中，您可以使用底层平台信息调整布局：

this.isDesktop = this.platform.is('core');
this.isTabletOrIpad = this.platform.is('tablet') || this.platform.is('ipad');

然后通过动态使用 *ngIf、showWhen, setting Grid Column Percentage Attributes 或您在视图中需要的任何内容来设计适当的布局。

请注意，使用平台信息不仅在视图中很重要，在组件代码中也很重要。这样，您可以避免初始化或执行稍后不会在视图中显示的代码（例如，如果您不打算加载只应在桌面上显示的地图，则加载地图没有意义在视图中显示它，因为该应用程序正在移动设备中使用）。

Ionic 2 大屏幕分辨率应用程序

Ionic 2 large screen resolution apps

css

layout

ionic2

angular