基于Qt的Live2D模型显示以及控制

news2024/11/20 10:21:13

基于Qt的Live2D模型显示以及控制

基本说明

  1. Live2D官方提供有控制Live2D模型的SDK,而且还提供了一个基于OpenGL的C++项目Example,我们可以基于该项目改成Qt的项目,做一个桌面端的Live2D桌宠程序。

官方例子
  1. 经过改造效果如下图所示。

在这里插入图片描述

官方项目配置

  1. 下载官方提供的SDK例程,,选择Cubism SDK for Native。

    官方网站

在这里插入图片描述

  1. 下载解压后应该是下面的样子。

    在这里插入图片描述

    • 其中Core文件夹放的是核心库Live2DCubismCore的动态链接库,提供有各个平台,我们只需要用windows的链接库就可以了。

    • Framework提供基本的框架用于模型的读取和配置,我们可以使用源码也可以用它编译成的链接库。

    • Samples文件夹存放就是Example,里面有对应的脚本,可以生成VS项目。

  2. 生成VS项目

    • 进入Samples/OpenGL/Demo/proj.win.cmake/scripts目录下,根据你们安装的vs版本,选择对应的脚本进行项目生成。

      在这里插入图片描述

    • 在生成项目之前还需要配置一下第三方模块,不然无法生成。因为用到Opengl.所以需要glew和glfw模块。虽然官方有提供脚本一键配置,不过文件下载不了,我们需要手动下载配置。去github下载glfw和glew源码。

      • glew · GitHub

      • glfw · GitHub

      然后来到Samples/OpenGL/thirdParty目录下,解压刚才下载的两个文件,得到两个文件夹,文件夹名字记得修改为glew和glfw。配置完成如下所示。

      在这里插入图片描述

    • 配置完第三方模块后,使用项目脚本生成vs项目,打开脚本后,有一些选项可以配置,根据提示和自己需求配置即可。

      在这里插入图片描述

    • 如果之前的步骤没有错会在Samples/OpenGL/Demo/proj.win.cmake/目录生成build文件夹.我们打开里面的Demo.sln文件,即可在vs中运行项目。

      在这里插入图片描述

      点击运行项目,即可运行官方示例。

      在这里插入图片描述

      在vs中我们看到除了Demo项目,还有glew,glfw,framework项目,它们是用来生成链接库的,我们把他们设为启动项目然后生成一遍,得到对应链接库,之后我们要用的。glew会生成glew32.lib,libglew32.lib。glfw会生成glfw3.lib。framework会生成Framework.lib。

    • 至此我们就完成了第一步,跑起来官方的例程,之后想怎么改就怎么改。

准备移植Qt的文件

  1. 需要的链接库

    • 我们以Release,x64为环境,之前的链接库也按照这个模式生成。

    • 首先需要我们自己生成的链接库glew32.lib,libglew32.lib,glfw3.lib,Framework.lib。还有官方提供的Core链接库Live2DCubismCore_MD.lib/Live2DCubismCore_MT.lib。根据我们之前配置项目时的设置,选择MD或者MT即可。链接库在下载的SDK目录Core/lib/windows下,我们根据自己使用的vs版本选择对应的库,v143是Vs2022,v142是Vs2019,v141是Vs2017。

      在这里插入图片描述

    • 最后还需要主动链接一些系统库,这些需要的库我们可以在VS中查看Demo项目在属性页中的链接器看到。

      #pragma comment(lib, “kernel32.lib”)
      #pragma comment(lib, “user32.lib”)
      #pragma comment(lib, “gdi32.lib”)
      #pragma comment(lib, “OpenGL32.lib”)
      #pragma comment(lib, “glu32.lib”)

      在这里插入图片描述

  2. 需要的源代码

    • 我们需要在官方给出的控制代码中一些修改一些文件,改成适合Qt程序的。所需源码如下所示。

      在这里插入图片描述

    • 还有上面的链接库glfw,glew,Framework,Live2DCubismCore_MD.lib/Live2DCubismCore_MT.lib对应的头文件(*.h/*.hpp),以及stb_image.h文件。这些文件都可以在下载的SDK中找到。

移植Qt

Qt中有封装的OpenGL类(QOpenGLWidget),我们要做的就是把模型渲染在我们自己的OpenGL窗口上。
  1. 准备以上文件后我们用Qt Creator新建一个带界面UI文件的Qt程序,编译器使用MSVC对应的版本,名字叫Live2DDemo,然后把以上链接库,源文件,头文件添加到项目中。

  2. 添加完成后Qt工程如下所示

    在这里插入图片描述

    我们需要在mainwindow.h中手动链接一下这些库。

    #pragma comment(lib, “kernel32.lib”)
    #pragma comment(lib, “user32.lib”)
    #pragma comment(lib, “gdi32.lib”)
    #pragma comment(lib, “OpenGL32.lib”)
    #pragma comment(lib, “glu32.lib”)

    pro文件配置中加一个预定义宏,表示在WINDOWS平台

    DEFINES += CSM_TARGET_WIN_GL

    Framework的头文件直接把SDK中的Framework/src/目录下的所有文件直接复制过来就行,不用删除其中的cpp文件。GL和GLFW的文件夹名字不能改,因为它们源码就是以“GL/*.h"的方式包含的。如果更改了,需要去源码那里改一下头文件的包含。

    在这里插入图片描述

    项目的工程目录,inc目录存放头文件,libs存放链接库,live2d存放需要修改的代码。

    在这里插入图片描述

    配置根据各自的情况配置就行,其实就是配置一些头文件和链接库。

  3. 如果上面的配置都没有错,编译应该是可以通过的。如果有报错,根据报错提示修改即可。报错一般就是以下情况。

    • 头文件找不到。在工程文件Pro中加上缺少的即可,注意一下目录层级。

    • 链接库找不到。看看是不是x64,release,MSVC的编译环境,链接库是不是x64,release环境下生成的,链接库路径有没有写对。

修改源码

上面的配置都没有问题后,我们就可以开始修改,把Live2D模型渲染到Qt的QOpenGLWidget窗口上。

  1. 新建一个类MyOpenGL然后继承QOpenGLWidget,然后重写下面几个protected函数。

    void initializeGL()

    void resizeGL(int w, int h)

    void paintGL()

    下面几个头文件要放在cpp文件包含。

在这里插入图片描述

然后在mainwindow.ui界面拖拽一个QOpenGLWiget控件,提升为我们自定义的类MyOpenGL。如果一切都没有错,运行后就是下面的样子。

在这里插入图片描述

  1. 修改LAppDelegate类。

    • 在LAppDelegate.hpp中包含myopengl.h头文件,然后在public下新增两个函数声明。
      在这里插入图片描述

    • 注释原来的GLFWwindow*_window,改成MyOpenGL*_window。然后修改GetWindow函数。

      在这里插入图片描述
      在这里插入图片描述

    • Initialize()函数修改如下
      在这里插入图片描述

    • LAppDelegate.cpp

      • 在Initialize函数中做如下修改。

    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

    • Release函数修改如下

    在这里插入图片描述

    • void LAppDelegate::Run() 函数的所有内容注释掉,我们要把功能拆分到新增的resize()和update()函数中。两个函数如下

    在这里插入图片描述

    在这里插入图片描述

  2. 修改width和height的获取方式

    原来的代码中获取渲染窗口的宽和高是通过glfwGetWindowSize() 函数,但我们修改为了自己的OpenGL窗口,因此所有用到这个函数的地方都要修改。我们可以先编译一下看看哪里报错,然后跳到对应地方修改就可以了。需要修改的地方比较多就不一一截出来了,修改都是类似的。

    在这里插入图片描述

    在这里插入图片描述

  3. 修改我们自己的MyOPenGL类

    在这里插入图片描述

  4. 添加Resource

    • 下载的SDK中有官方提供的一些live2D模型,我们把整个Resources文件夹放到exe程序的上一级目录。因为在Qt Creator中运行程序,运行目录默认是exe程序的上一级目录。

    • 如果上面的步骤都没有错,运行出来的效果如下。如果程序闪退就是Resources文件夹放的位置不对,导致找不到文件而闪退。

      在这里插入图片描述

  5. 加上鼠标事件和定时更新功能

    鼠标事件用于和模型进行互动,可以触发一些特定动作

    在这里插入图片描述

    在这里插入图片描述

    到这里就基本和官方的效果差不多了,至于更多自定义修改,比如去掉背景和一些部件,模型的自定义显示,模型的切换等等,把那些控制代码看看,根据的需求修改即可。

一些问题

  1. Windows上Qt Creator的一些问题。

    • 打开速度慢,文件跳转慢,有时还会卡顿闪退。

    • 有些配置文件修改了,但是Qt没有加载,而是用之前的缓存,导致程序修改了,但编译时还是用没有修改之前的文件。

    • ui界面修改了,但是编译的ui文件还是用之前的,导致修改了界面,程序运行后界面还是和之前一样。


    以上问题我在移植的时候都遇到过,还以为是配置错了,浪费了不少时间排查才知道Qt Creator没有读取我的最新修改,而是用之前缓存的。我重新Rebuild都没用,需要自己去删掉之前文件才行。如果不是很熟悉Qt和Qt Creator,建议使用VS+Qt插件来进行配置。

  2. 如果上面的配置比较复杂或者遇到错误,我这有一个在MSVC2019,x64,Release配置好的Qt工程和编译好的程序,其实就是上面的举例的项目。

    百度云链接

    提取码: o3vi

    失效了可以联系我。


DesktopLive2D

基于上面的修改,我开发了一个Live2D模型桌面程序,可以把live2D模型放在桌面上,进行互动,支持自定义加载模型,帧率设置,快速切换模型,鼠标互动。后续准备加上ChatGPT和TTS。

在这里插入图片描述
在这里插入图片描述

感兴趣可以去GitHub Star一下。

GitHub: DesktopLive2D


有任何问题可以联系我wx(base64) :aGVjaHVzaGluaQ==

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1297944.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

视觉检测系统在半导体行业的应用

一、半导体产业链概述 半导体产业链是现代电子工业的核心组成部分,涵盖了从原材料到最终产品的整个生产过程。这个产业链主要分为以下几个环节: 1.原材料供应:半导体行业的基石是半导体材料,如硅片、化合物半导体等。这些材料需要…

CentOS7安装Docker,DockerCompose

安装docker 1、卸载docker 查看是否有旧版本docker docker info首先检测我们虚拟机是否已经安装过Docker,如果安装则需卸载。代码中“\”符号为换行符,相当于一行内容分为多行,这是检测docker的各种组件 yum remove docker \docker-clien…

高项备考葵花宝典-项目进度管理输入、输出、工具和技术(上,很详细考试必过)

项目进度管理的目标是使项目按时完成。有效的进度管理是项目管理成功的关键之一,进度问题在项目生命周期内引起的冲突最多。 小型项目中,定义活动、排列活动顺序、估算活动持续时间及制定进度模型形成进度计划等过程的联系非常密切,可以视为一…

高项备考葵花宝典-项目进度管理输入、输出、工具和技术(中,很详细考试必过)

项目进度管理的目标是使项目按时完成。有效的进度管理是项目管理成功的关键之一,进度问题在项目生命周期内引起的冲突最多。 小型项目中,定义活动、排列活动顺序、估算活动持续时间及制定进度模型形成进度计划等过程的联系非常密切,可以视为一…

LeetCode算法题解(单调栈)|LeetCode84. 柱状图中最大的矩形

一、LeetCode84. 柱状图中最大的矩形 题目链接:84. 柱状图中最大的矩形 题目描述: 给定 n 个非负整数,用来表示柱状图中各个柱子的高度。每个柱子彼此相邻,且宽度为 1 。 求在该柱状图中,能够勾勒出来的矩形的最大…

更改Android Studio的.android和.gradle文件夹默认位置

一、首先关闭Android Studio, 二、目标位置新建文件夹 这一步,为了省去麻烦,我并没有直接在我的目标位置新建文件夹,而是把C盘下的.android和.gradle文件夹整个复制过来,和SDK都在同一目录下,感觉这样可以…

Sql Server 2017主从配置之:AlwaysOn高可用

AlwaysOn高可用功能,真正实现了数据库的灾备切换、高可用。 AlwaysOn通过Windows Server故障转移群集,部署高可用数据库组。 在故障转移群集基础上完成部署读写分离,只读负载平衡最多3个写入节点实现故障转移最多3个数据实时同步节点 环境…

网络入门---网络编程初步认识和实践(使用udp协议)

目录标题 前言准备工作udpserver.hpp成员变量构造函数初始化函数(socket,bind)start函数(recvfrom) udpServer.ccudpClient.hpp构造函数初始化函数run函数(sendto) udpClient.cc测试 前言 在上一篇文章中我们初步的认识了端口号的作用,ip地址和MAC地址在网络通信时…

Centos7、Mysql8.0 load_file函数返回为空的终极解决方法--暨selinux的深入理解

零、问题背景 最近想换房,为了方便自己对比感兴趣的房子,因此决定将目标房源的基本信息放在表里,特别是要一目了然的看到众多房子的各种图纸和照片,因此决定要在Mysql8.0.34数据库中以二进制形式保存图片(抛开合理性和…

VSCode 报错 gopls was not able to find modules in your workspace.

由于在VSCode中打开一个项目时出现如下提示: 于是检索其解决办法 根据提示我们可以看到这是由于gopls所出的问题,在工作空间找不到相关module,这是VSCode中go插件所依赖附带的,该语言服务器提供诸如自动完成,转到定义,…

《python每天一小段》--12 数据可视化《1》

欢迎阅读《Python每天一小段》系列!在本篇中,将使用Python Matplotlib实现数据可视化的简单图形。 一、概念 Matplotlib是一个流行的Python数据可视化库,它提供了丰富的绘图功能,可以创建各种类型的图表,包括折线图、…

echarts绘制一个环形图

其他echarts&#xff1a; echarts绘制一个柱状图&#xff0c;柱状折线图 echarts绘制一个饼图 echarts绘制一个环形图2 效果图&#xff1a; 代码&#xff1a; <template><div class"wrapper"><!-- 环形图 --><div ref"doughnutChart…

[面试题~k8s] 云原生必问基础篇

文章目录 概念篇1. k8s 是什么2. Container3. Pod4. Node5. Namespace6. Service7. Label8. Replica Set&#xff08;副本集)9. Deployment10. Volume11. Namespace12. PV 和 PVC 基础篇1. 删除 pod 流程2. k8s 有哪些组件master nodeworker node 3. k8s 和 docker 的关系4. 简…

mysql原理--InnoDB数据页结构

1.不同类型的页 页是 InnoDB 管理存储空间的基本单位&#xff0c;一个页的大小一般是 16KB 。InnoDB 为了不同的目的而设计了许多种不同类型的页。下面讨论存放我们表中记录的那种类型的页&#xff0c;官方称这种存放记录的页为索引&#xff08; INDEX &#xff09;页&#xff…

【开源】基于Vue+SpringBoot的河南软件客服系统

文末获取源码&#xff0c;项目编号&#xff1a; S 067 。 \color{red}{文末获取源码&#xff0c;项目编号&#xff1a;S067。} 文末获取源码&#xff0c;项目编号&#xff1a;S067。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 系统管理人员2.2 业务操作人员 三、…

【STM32】TIM定时器编码器

1 编码器接口简介 Encoder Interface 编码器接口 编码器接口可接收增量&#xff08;正交&#xff09;编码器的信号&#xff0c;根据编码器旋转产生的正交信号脉冲&#xff0c;自动控制CNT自增或自减&#xff0c;从而指示编码器的位置、旋转方向和旋转速度 接收正交信号&#…

视频剪辑技巧:批量合并视频,几个步骤轻松完成

在视频剪辑过程中&#xff0c;批量合并视频是一个常见的需求。通过合并多个视频文件&#xff0c;可以减少剪辑时间和提高工作效率。在开始合并视频之前&#xff0c;首先要明确需求和目的。例如&#xff0c;是想要将多个短视频片段随机合并成一个新的视频&#xff0c;还是想要将…

5分钟了解自动化测试,自动化优势、劣势、工具和框架选择全剖析

本文共有3963字&#xff0c;快速阅读需要大约5分钟&#xff0c;赏味期限持久。 随着软件测试技术的发展&#xff0c;人们已经从最初的纯粹的手工测试转变为手工与自动化测试技术相结合的测试方法。近年来&#xff0c;自动化测试越来越受到人们的重视&#xff0c;对于自动化测试…

mysql面试题——MVCC

一&#xff1a;什么是MVCC&#xff1f; 多版本并发控制&#xff0c;更好的方式去处理读-写冲突&#xff0c;就是为了查询一些正在被另一个事务更新的行&#xff0c;并且可以看到它们被更新之前的值&#xff0c;这样在做查询的时候就不用等待另一个事务释放锁。 二&#xff1a…

【投稿优惠|检索稳定】2024年信息系统、工程与数字化经济国际会议(ICISEDE 2024)

2024年信息系统、工程与数字化经济国际会议(ICISEDE 2024) 2024 International Conference on Information Systems and Engineering and the Digital Economy(ICISEDE 2024) [会议简介] 2024 年信息系统、工程与数字化经济国际会议(ICISEDE 2024)将于 2024 年 1 月 20 日在厦门…