首页 > 其他分享 >Qt Design Studio入门3D项目设计

Qt Design Studio入门3D项目设计

时间:2024-12-02 12:03:46浏览次数:9  
标签:界面 Qt Design UI 组件 设计 3D Studio

一、Qt Design Studio 3D 设计的优势

Qt Design Studio 是一个专注于创建高性能用户界面(UI)的设计工具,它在设计3D界面方面具有一下显著优势:

1、一体化工作流

**1)设计与开发无缝集成:**设计师和开发者可以在同一环境中协作,无需反复转换文件格式或工具。
**2)支持Qt Quick 和 3D:**直接集成了 2D 和 3D 界面的设计工具,支持 QML 和 3D 技术的混合使用。

2、实时预览和高效迭代

**1)实时预览:**设计师可以实时查看 3D 界面效果,无需编译或使用额外的渲染工具。
**2)快速迭代:**修改可以即时反映到 UI 设计中,方便调整。

3、3D 渲染性能优化

**1)Qt 3D 引擎支持:**支持基于Qt 3D 的高性能渲染,能够直接在多平台上运行。
**2)硬件加速:**借助 GPU 加速和优化的 3D 渲染技术,确保最终界面的流畅运行。

4、强大的资源管理

**1)支持多种格式:**可以直接导入流行的 3D 文件格式(如 FBX、OBJ 等),简化了资源管理。
**2)统一资源管理器:**设计师可以方便地管理模型、材质、纹理和其他资源。

5、交互式设计能力

**1)动态效果支持:**支持 3D 动画和交互设计,用户可以创建复杂的动态场景。
**2)逻辑绑定:**设计中的动态交互可以直接绑定到 QML 脚本逻辑。

6、多平台支持

**1)跨平台开发:**创建的 3D 界面可以直接部署到多个平台(如 Windows、Linux、macOS、IOS 和 Android)。
**2)一致的用户体验:**确保在不同平台上呈现一致的 3D 效果。

7、插件与扩展性

**1)第三方工具集成:**可以与 Blender、Maya 等3D工具集成,支持通过插件增强功能。
**2)开放性:**支持自定义的模块和插件,扩展设计能力。

8、用户体验优化

**1)流畅的交互体验:**Qt 的高性能架构确保 3D 界面在各种设备上运行流畅。
**2)丰富的控件支持:**提供了大量可直接使用的 UI 组件和控件,大大简化了设计复杂界面的过程。(初学者可查阅官方文档Qt Design Studio 官方文档或个人主页Qt Design Studio 常用组件进行了解学习)

二、入门学习一个 3D 项目

1、创建 3D 项目

创建一个简单的 3D 项目
进入Qt Design Studio 后选择创建项目,在创建界面自定义窗口尺寸、项目名称、存放路径以及默认格式,如上图所示,创建一个 1600 × 900 尺寸的 3D 项目,命名为Test(延续 Qt 的格式,项目名称与类名称首字母需大写),选择官方提供的 default 格式,点击 create 即可创建成功。

2、Qt Design Studio 主界面常用功能介绍

在这里插入图片描述
如上图,菜单栏 view → views 可通过勾选指定模块在主界面显示,新建项目默认开启如图所示的模块。下面将分别介绍不同常用模块及其功能。

2.1 Navigator

在这里插入图片描述
1)功能:

  • 显示项目中的 UI 组件层次结构,类似于场景树或层级视图。
  • 设计师可以在 Navigator 中查看、选择、组织和管理 UI 元素。

2)特点:

  • 以树状结构列出所有元素,方便查看父子关系。
  • 支持拖放操作,用于调整组件的层次结构。
  • 提供搜索功能,快速定位特定元素。

3)典型用途:

  • 调整组件的布局。
  • 删除、隐藏和锁定特定 UI 元素。

2.2 Projects

在这里插入图片描述
1)功能:

  • 管理整个项目的文件和文件夹结构。
  • 显示与项目相关的所有资源(QML 文件、3D 模型、图像、脚本等)。

2)特点:

  • 文件系统视图,按物理文件夹结构显示内容。
  • 支持对文件进行操作(重命名、移动、删除)。

3)典型用途:

  • 导航到特定资源文件。
  • 快速查看项目结构是否完整。
  • 添加新资源到项目中。

2.3 Components

在这里插入图片描述
1)功能:

  • 列出所有可用的 UI 组件(控件、布局、3D 元素等)。
  • 包括预定义的 Qt Quick 组件和用户自定义组件。

2)特点:

  • 组件按类别组织(如基本控件、容器、3D 物体)。
  • 支持直接拖放组件到设计画布。

3)典型用途:

  • 向界面中添加新的 UI 元素(按钮、滑块、标签等)。
  • 快速浏览和选择所需组件。

2.4 Assets

在这里插入图片描述
1)功能:

  • 管理和预览所有项目资源,包括图片、纹理、3D 模型、字体等。

2)特点:

  • 提供资源的缩略图预览。
  • 支持拖放资源到界面设计中。
  • 可对资源进行简单管理(如重命名、删除)。

3)典型用途:

  • 添加图像作为背景或纹理。
  • 导入各种自定义组件或 3D 模型。
  • 替换资源以更新设计。

2.5 3D

在这里插入图片描述
1)功能:

  • 提供 3D 场景的设计和管理工具。
  • 支持导入和编辑 3D 模型、调整光照、相机视角等。

2)特点:

  • 提供 3D 视图,实时查看模型和动画效果。
  • 支持调整 3D 对象的位置、旋转和缩放。

笔者找了很久的快捷键,此处特别指出:
滚轮 → 界面缩放
Alt + 鼠标左键 → 旋转视角
Alt + 长按鼠标滚轮 → 平移视角

  • 提供材质和纹理编辑功能。

3)典型用途:

  • 添加和配置 3D 场景中的物体。
  • 调整相机视角以优化显示。
  • 为 UI 添加动态的 3D 效果。

2.6 2D

在这里插入图片描述
1)功能:

  • 用于设计和调整 2D 界面元素。
  • 提供画布视图,支持直接拖放、排列和调整元素。

2)特点:

  • 提供网格和对齐工具,方便布局设计。
  • 支持在 2D 和 3D 场景之间切换。

3)典型用途:

  • 排列按钮、标签等控件。
  • 设计多屏幕的 UI 布局。
  • 快速预览 UI 在不同分辨率下的效果。

2.7 Code

在这里插入图片描述
1)功能:

  • 提供内置代码编辑器,用于编辑 QML 和 JavaScript 脚本。

2)特点:

  • 提供语法高亮、代码补全和错误提示功能。
  • 支持快速跳转到代码中的特定位置。

事实上 Qt Design Studio 代码管理器还比较辣鸡,代码存在问题时虽然会高亮,但是点击报错无法直接跳转,只能通过滑条自行寻找。

  • 与 UI 设计实时同步,方便同时修改和查看效果。

3)典型用途:

  • 添加逻辑代码(如按钮点击的具体行为)。
  • 定义动态属性绑定。
  • 调整动画或状态切换的实现。

2.8 Output

在这里插入图片描述
1)功能:

  • 显示项目的运行、编译或调试的日志输出。

2)特点:

  • 实时输出设计预览或项目构建的详细信息。
  • 包括错误、警告和运行状态。

3)典型用途:

  • 检查项目的编译或运行状态。
  • 调试 UI 逻辑问题。
  • 确认设计是否正确加载资源或配置。

2.9 Properties

在这里插入图片描述
1)功能:

  • 显示和编辑选定 UI 元素的属性(如大小、位置、颜色等)。

2)特点:

  • 动态显示当前选择元素的所有可配置属性。
  • 属性分组显示(如外观、行为、绑定等)。
  • 支持直接绑定数据或使用表达式。

3)典型用途:

  • 调整按钮的位置和大小。
  • 设置字体样式和颜色。
  • 绑定属性以实现动态更新。

笔者建议初学者在 Properties 中查看属性属性,然后查找官方文档学习对应属性的功能,最后使用 Code 进行属性设置,这样使用起来更顺手。

2.10 Connections

在这里插入图片描述
1)功能:

  • 管理 UI 元素之间的交互逻辑和信号/槽连接。

2)特点:

  • 提供可视化的交互设计界面,支持拖放操作。
  • 列出所有信号和槽,方便查看已定义的连接。

有 Qt 开发基础的可以直接使用 Code 进行槽函数的设计和实现,没有的也建议先去学一学Qt的信号与槽,此处设计十分反人类了。

3)典型用途:

  • 设计按钮的点击事件行为。
  • 连接滑块的值变化到显示标签。
  • 创建动态交互功能。

3、运行 3D 项目

在这里插入图片描述
在这里插入图片描述
  点击左上角的运行按钮,可以看到运行接入如上图所示,则说明入门成功啦!
  后续我将会就我当前做的一个项目进行分享,包括但不限于模型挑选、代码编写、遇到的问题及其解决方法,欢迎关注我共同学习进步。

标签:界面,Qt,Design,UI,组件,设计,3D,Studio
From: https://blog.csdn.net/weixin_51327585/article/details/144181531

相关文章

  • Qt/C++实现帧同步播放器/硬解码GPU绘制/超低资源占用/支持8K16K/支持win/linux/mac/嵌
    一、前言首先泼一盆冷水,在不同的电脑上实现完完全全的帧同步理论上是不可能的,市面上所有号称帧同步的播放器,同一台电脑不同拼接视频可以通过合并成一张图片来绘制实现完完全全的帧同步,不同电脑,受限于网络的延迟,命令交互的时间占用,不同硬件之间的主频偏差等,肯定会有些许的误差,只要......
  • Android Studio开发uniapp原生插件之环境搭建
    一、下载sdk并解压到指定目录https://nativesupport.dcloud.net.cn/AppDocs/download/android.html二、使用AndroidStudio导入项目三、在开发者后台创建app1、创建key,参考https://ask.dcloud.net.cn/article/357772、查看key信息keytool-list-v-keystore{your_app}.key......
  • 基于Bootstrap的Material Design风格表单插件
    JqueryMaterialFormPlugin是一款基于Bootstrap的MaterialDesign风格的JQUERY表单插件。该表单通过自定义样式和jQuery来将Bootstrap的表单修改为扁平风格的表单,并带有浮动标签特效。在线演示  下载  使用方法使用该MaterialDesign风格表单需要在页面中引入jquery,bo......
  • PhysicalProduct Advanced class design
    Task1:Inthisassignment,youwillwritethecodethatmanagestheproductcategoriesonanywebsite,suchasAlibaba(Useanotherwebsite).Togetstarted:CreateanewJavaprojectcalledProject1inIntelliJ.Inthesrcdirectory,createanewclass......
  • [Design Pattern] Encapsulate a network request lib - 4. API Template
    Whencompany'sAPIbecomehugeandalwayschanging,if request-busismaintainedbydevelopersmanually,it'snotonlytimeconsumingbutalsoerrorprone.Wecanintroducesomestandardautomationprocesstoresolvetheproblem. Examples:{......
  • [Design Pattern] Encapsulate a network request lib - 1. DIP: Dependence Inversio
    ThreelayersdesignLowlevelimplementationLayer:usinglowlevelimplementationtocompletebasicoperation.Forthenetworkrequest,wecanusethelibsuchasaxios,whichinternallyusing xhr,orwecanalsouse fetchdirectlyfromnode.jsreque......
  • 带过滤功能的Material Design风格手风琴列表特效
    这是一款带搜索过滤功能的MaterialDesign风格垂直手风琴列表特效。该手风琴特效采用扁平设计风格,点击列表项时带有点击波效果,并且可以通过顶部的搜索框来搜索过滤需要的列表项。在线演示  下载  使用方法使用该手风琴特效需要在页面中引入jquery-accordion-menu.css文......
  • 【Altium Designer 25.0.2下载与安装教程】
    1、安装包「AltiumDesignerv25.0.2.28.rar」链接:https://pan.quark.cn/s/babcbc39d4b1提取码:EPis2、安装教程(建议关闭杀毒软件和系统防护)1)       下载并解压下载的安装包,右击Installer.exe安装,弹窗安装对话框  2)       点击Next   3)   ......
  • QT核心模块源码解析:组件与样式
    QT核心模块源码解析:组件与样式使用AI技术辅助生成QT界面美化视频课程QT性能优化视频课程QT原理与源码分析视频课程QTQMLC++扩展开发视频课程免费QT视频课程您可以看免费1000+个QT技术视频免费QT视频课程QT统计图和QT数据可视化视频免费看免费QT视频课程QT性能......
  • Qt Design Studio常用组件及其属性
    入坑QtDesignStudio        笔者此前一直使用的是Qtcreator与其内置的Qtdesigner进行客户端界面设计和开发,采用的是qwidget+c++的设计方法,由于项目需要进行3D设计,转而学习使用QtDesignStudio,发现qml代码简单,布局直观,对新手更为友好,开发上手快速。因此,后续也会在......