如何在 Android 平板电脑上实现主从视图 Qt/QML？

Posted 2023-02-16

【中文标题】如何在 Android 平板电脑上实现主从视图 Qt/QML？

【英文标题】：How to implement a master-details view Qt/QML on an Android tablet?

【发布时间】：2017-02-28 22:30:42

【问题描述】：

我正在将 ios 应用程序移植到针对 android 平板电脑的 Qt/QML。

我想让应用程序的行为类似于基于UISplitViewController 的原始 iOS 版本。

换句话说，我需要在横向模式下使用平板电脑构建一个主从视图。

为了实现这一点，我正在考虑使用由ListModel 支持的ListView 作为主视图，这样每当在ListView 中选择项目时，就会动态显示详细信息视图。

目前，我什至连基础知识都在努力。如果我的问题看起来过于宽泛，请提前原谅我，但这里有几个我马上面临的绊脚石：

我在 QML 中看到的大多数示例似乎都“硬编码”了设备的屏幕尺寸。例如，Qt Creator 中典型的骨架项目将包含以下代码：

ApplicationWindow 
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

        Page1 
        

 

如上图所示，窗口的宽度和高度属性是硬编码的。在实践中，我需要根据物理设备的屏幕大小动态设置这些值。我怎样才能做到这一点？

我还需要调整应用程序屏幕的大小，以便为屏幕顶部的状态栏区域（显示电池电量的区域）留出一些空间。

任何代码 sn-ps 以及说明如何实现这一点的在线文档的指针都将非常感激！

编辑：这是一个更新的 main.qml，它使用设备的屏幕大小设置应用程序窗口的大小：

ApplicationWindow 
    id: appWindow
    visible: true
    width: Screen.width
    height: Screen.height
    title: qsTr("Hello World")

        Page1 
        

应用程序窗口的宽度、高度和位置可以进一步调整为不与设备的状态栏区域重叠。

但是我仍然坚持布局方向，默认为纵向。如何将布局的方向更改为横向？

【问题讨论】：

显式删除窗口的设置大小，改为尝试设置：doc.qt.io/qt-5/qml-qtquick-window-window.html#visibility-prop

另外，您是否尝试过此处显示的示例：doc.qt.io/qt-5/qml-qtquick-controls-applicationwindow.html

【参考方案1】：

这是我使用的：

  // in the main window
  property bool desktop: 
    switch (Qt.platform.os) 
    case "android":
    case "ios":
    case "winphone":
    case "winrt":
      return false
    default: return true
    
  
  visibility: desktop ? Window.AutomaticVisibility : Window.Maximized

至于强制横向，在manifest -> application -> activity properties部分的项目文件夹/android（不是build目录中的那个）的AndroidManifest.xml文件中添加以下内容：

android:screenOrientation="landscape"

【讨论】：

我检查了我的项目，没有AndroidManifest.xml。构建文件夹中确实有一个 AndroidManifest.xml，但在每次构建时都会覆盖该文件。我正在使用 Qt Creator 4.2.1

显然您还没有生成清单存根，因此每次它都会创建默认存根。您需要转到项目 - android 工具包的构建设置 - 在构建步骤 - 构建 Android APK 部分有一个名为 Create Template 的按钮。单击它，您的项目文件夹中将有一个清单进行更改。