css - 使用 ion-list 使用 ionicframwork 的主详细信息 View

Question

我正在开发一个 ionic 应用程序，我需要使用主细节 View ，所以在小屏幕上我显示列表，然后当我点击元素时转到详细信息(完成)，对于大屏幕，列表转到与详细信息屏幕并排(检查图像):

小型设备

更大的设备

如果有人能帮我出主意或者他知道怎么做，我将不胜感激。

Answer 1

我不知道有什么方法可以检查设备的实际大小。但是，我确实知道如何检查屏幕的大小，您可以使用 $window.innerWidth 和 $window.innerHeight 来做到这一点。

如果你能找到一种方法来获取屏幕的像素密度，你就可以计算出屏幕的大小，然后根据你的计算让它切换 View 。您可以通过对内容使用 ng-if 来执行此操作。

您的应用在所有手机上看起来都一样的原因是运行 ionic 应用的 webview 组件处理所有屏幕尺寸。