目录
说明文档 Quick Start with Qt+Cef https://tishion.github.io/QCefView
https://github.com/tishion/QCefView
Quick Start with Qt+Cef https://tishion.github.io/QCefView
This is the fresh new reforming version of QCefView, if you need to use the legacy one please checkout the legacy-archivebranch.
Build instruction:
Download and install CMake
Download and install Qt SDK from Qt Downloads
Download CEF binary distribution Chromium Embedded Framework (CEF) Automated Builds and extract it to dep directory, for example:
root ├─dep │ └─cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows64 ├─src └─testModify the config.cmake to set the required build configurations
Just use CMake to build the project, for example:
REM create the build folder mkdir build.win && cd build.win REM generate and build the project cmake .. && cmake --build .Note: When I start the reforming I use Qt 5.12.4 and CEF cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows64. You need to make sure the version you are choosing is compatible with the code in this repo.
为了减少错误的产生，笔者亦采用 Qt 5.12.4 and CEF cef_binary_76.1.13+cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows32，编译链选择msvc 2017 x86.文件目录按照上说明文档进行。
按照官方给的说明进行编译即可：
#REM create the build folder
mkdir build.win && cd build.win
#REM generate and build the project
cmake .. && cmake --build .按照上面编译会有几处错误产生，需要做如下的修改。
1、D:\QCefView-master\config.cmake 文件需要按照自己的配置做对应的修改，譬如笔者的：
#
# Build environment configuration file for QCefView
##
# The Qt SDK path
#
set(QT_SDK_DIR
# Change this value to the Qt SDK path of your build environment ######在此处修改自己的路径
"C:\\Qt\\Qt5.12.0\\5.12.0\\msvc2017\\"
)#
# The root dir of the CEF SDK
#
set(CEF_SDK_DIR
# Change this value to the CEF binary distribution path of your build environment
"${CMAKE_CURRENT_SOURCE_DIR}/dep/cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows32"
)#################################################################################
#
# For CI system
#
if (DEFINED ENV{APPVEYOR})
set(QT_SDK_DIR
# Change this value to the Qt SDK path of your build environment ######在此处修改自己的路径
"C:\\Qt\\Qt5.12.0\\5.12.0\\msvc2017\\"
)
endif()
2、 D:\QCefView-master\CMakeLists.txt 文件中对应修改，屏蔽两处，第69和第70行处：
#cmake_policy(SET CMP0074 NEW)
#cmake_policy(SET CMP0077 NEW)
#
# The main config file for QCefView
# NOTE:
# Usually there is no need to change this file.
# Change the config.cmake instead.
#
cmake_minimum_required(VERSION 3.4.1)
project(QCefView)
# Determine the platform.
if("${CMAKE_SYSTEM_NAME}" STREQUAL "Darwin")
set(OS_MACOSX 1)
set(OS_POSIX 1)
elseif("${CMAKE_SYSTEM_NAME}" STREQUAL "Linux")
set(OS_LINUX 1)
set(OS_POSIX 1)
elseif("${CMAKE_SYSTEM_NAME}" STREQUAL "Windows")
set(OS_WINDOWS 1)
endif()
# Determine the project architecture.
if(NOT DEFINED PROJECT_ARCH)
if(CMAKE_SIZEOF_VOID_P MATCHES 8)
set(PROJECT_ARCH "x86_64")
else()
set(PROJECT_ARCH "x86")
endif()
if(OS_MACOSX)
# PROJECT_ARCH should be specified on Mac OS X.
message(WARNING "No PROJECT_ARCH value specified, using ${PROJECT_ARCH}")
endif()
endif()
# Set common configurations
###############################################################
# Use solution folder
set_property(GLOBAL PROPERTY USE_FOLDERS ON)
set(CMAKE_CXX_STANDARD 11)
set(CXX_STANDARD_REQUIRED)
set(CMAKE_CONFIGURATION_TYPES Debug Release)
set(QCEF_VIEW_SDK_OUT ${CMAKE_SOURCE_DIR}/out/${PROJECT_NAME})
set(QCEF_VIEW_SDK_BIN_OUT ${CMAKE_SOURCE_DIR}/out/${PROJECT_NAME}/bin)
set(QCEF_VIEW_SDK_LIB_OUT ${CMAKE_SOURCE_DIR}/out/${PROJECT_NAME}/lib)
set(QCEF_VIEW_SDK_INC_OUT ${CMAKE_SOURCE_DIR}/out/${PROJECT_NAME}/include)
set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${QCEF_VIEW_SDK_BIN_OUT})
###############################################################
# Include the local config files
###############################################################
include(config.cmake)
###############################################################
# Append the QT dir to CMAKE_PREFIX_PATH
###############################################################
set(CMAKE_PREFIX_PATH ${CMAKE_PREFIX_PATH} ${QT_SDK_DIR})
###############################################################
# Set CEF root dir and append it to CMAKE_MODULE_PATH
###############################################################
set(CEF_ROOT "${CEF_SDK_DIR}")
set(CMAKE_MODULE_PATH ${CMAKE_MODULE_PATH} "${CEF_ROOT}/cmake")
###############################################################
# Config the CEF
###############################################################
#cmake_policy(SET CMP0074 NEW)
#cmake_policy(SET CMP0077 NEW)
# Set the runtime library type
set(CEF_RUNTIME_LIBRARY_FLAG "/MD" CACHE STRING "Use dynamic runtime")
# Disable the SANDBOX
set(USE_SANDBOX OFF CACHE BOOL "Disable the Sandbox")
# Disable the ATL
set(USE_ATL OFF CACHE STRING "Disable the ATL")
# Find the CEF package
find_package(CEF REQUIRED)
# Store the libcef.lib path and cef dll wrapper target name
# NOTE: we set this just for simplify the following referring.
set(CEF_LIB_FILE "${CEF_BINARY_DIR}/libcef.lib")
set(CEF_DLL_WRAPPER "libcef_dll_wrapper")
# Add build target
add_subdirectory(${CEF_LIBCEF_DLL_WRAPPER_PATH})
PRINT_CEF_CONFIG()
###############################################################
# Add all targets
###############################################################
add_subdirectory(src/QCefProto)
include_directories(
src/QCefProto
${CEF_ROOT}
)
set(QCEF_WING_EXE "QCefWing")
add_subdirectory(src/QCefWing)
set(QCEF_VIEW_DLL "QCefView")
add_subdirectory(src/QCefView)
###############################################################
# Add demo
###############################################################
add_subdirectory(test/QCefViewTest)
###############################################################
3、D:\QCefView-master\src\QCefWing\CMakeLists.txt ，屏蔽资源文件配置以下部分，否则会提示找不到资源文件或路径错误：
4、D:\QCefView-master\src\QCefView\CMakeLists.txt 增加以下配置，否则会提示以下错误：
CMake Error at GUISupport/Qt/CMakeLists.txt:72 (find_package):
By not providing "FindQt5.cmake" in CMAKE_MODULE_PATH this project has
asked CMake to find a package configuration file provided by "Qt5", but
CMake did not find one.Could not find a package configuration file provided by "Qt5" with any of
the following names:Qt5Config.cmake
qt5-config.cmakeAdd the installation prefix of "Qt5" to CMAKE_PREFIX_PATH or set "Qt5_DIR"
to a directory containing one of the above files. If "Qt5" provides a
separate development package or SDK, be sure it has been installed.
解决方法，增加以下配置：
set(CMAKE_PREFIX_PATH "C:\\Qt\\Qt5.12.0\\5.12.0\\msvc2017\\")
set(Qt5_DIR "C:\\Qt\\Qt5.12.0\\5.12.0\\msvc2017\\lib\\cmake\\Qt5\\")
FIND_PACKAGE(Qt5Widgets)
1、经过上面的CMAKE后，如果运行正确会打印以下信息：
D:\QCefView-master\build.win>cmake .. && cmake --bulid .
-- *** CEF CONFIGURATION SETTINGS ***
-- Generator: Visual Studio 15 2017
-- Platform: Windows
-- Project architecture: x86
-- Binary distribution root: D:/QCefView-master/dep/cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows32
-- Visual Studio ATL support: OFF
-- CEF sandbox: OFF
-- Standard libraries: comctl32.lib;rpcrt4.lib;shlwapi.lib;ws2_32.lib
-- Compile defines: __STDC_CONSTANT_MACROS;__STDC_FORMAT_MACROS;WIN32;_WIN32;_WINDOWS;UNICODE;_UNICODE;WINVER=0x0601;_WIN32_WINNT=0x601;NOMINMAX;WIN32_LEAN_AND_MEAN;_HAS_EXCEPTIONS=0
-- Compile defines (Debug):
-- Compile defines (Release): NDEBUG;_NDEBUG
-- C compile flags: /MP;/Gy;/GR-;/W4;/WX;/wd4100;/wd4127;/wd4244;/wd4481;/wd4512;/wd4701;/wd4702;/wd4996;/Zi
-- C compile flags (Debug): /MDd;/RTC1;/Od
-- C compile flags (Release): /MD;/O2;/Ob2;/GF
-- C++ compile flags: /MP;/Gy;/GR-;/W4;/WX;/wd4100;/wd4127;/wd4244;/wd4481;/wd4512;/wd4701;/wd4702;/wd4996;/Zi
-- C++ compile flags (Debug): /MDd;/RTC1;/Od
-- C++ compile flags (Release): /MD;/O2;/Ob2;/GF
-- Exe link flags: /MANIFEST:NO;/LARGEADDRESSAWARE
-- Exe link flags (Debug): /DEBUG
-- Exe link flags (Release):
-- Shared link flags:
-- Shared link flags (Debug): /DEBUG
-- Shared link flags (Release):
-- CEF Binary files: chrome_elf.dll;d3dcompiler_47.dll;libcef.dll;libEGL.dll;libGLESv2.dll;natives_blob.bin;snapshot_blob.bin;v8_context_snapshot.bin;swiftshader
-- CEF Resource files: cef.pak;cef_100_percent.pak;cef_200_percent.pak;cef_extensions.pak;devtools_resources.pak;icudtl.dat;locales
-- Configuring done
-- Generating done
-- Build files have been written to: D:/QCefView-master/build.win
-- *** CEF CONFIGURATION SETTINGS ***
-- Generator: Visual Studio 15 2017
-- Platform: Windows
-- Project architecture: x86
-- Binary distribution root: D:/QCefView-master/dep/cef_binary_76.1.13+gf19c584+chromium-76.0.3809.132_windows32
-- Visual Studio ATL support: OFF
-- CEF sandbox: OFF
-- Standard libraries: comctl32.lib;rpcrt4.lib;shlwapi.lib;ws2_32.lib
-- Compile defines: __STDC_CONSTANT_MACROS;__STDC_FORMAT_MACROS;WIN32;_WIN32;_WINDOWS;UNICODE;_UNICODE;WINVER=0x0601;_WIN32_WINNT=0x601;NOMINMAX;WIN32_LEAN_AND_MEAN;_HAS_EXCEPTIONS=0
-- Compile defines (Debug):
-- Compile defines (Release): NDEBUG;_NDEBUG
-- C compile flags: /MP;/Gy;/GR-;/W4;/WX;/wd4100;/wd4127;/wd4244;/wd4481;/wd4512;/wd4701;/wd4702;/wd4996;/Zi
-- C compile flags (Debug): /MDd;/RTC1;/Od
-- C compile flags (Release): /MD;/O2;/Ob2;/GF
-- C++ compile flags: /MP;/Gy;/GR-;/W4;/WX;/wd4100;/wd4127;/wd4244;/wd4481;/wd4512;/wd4701;/wd4702;/wd4996;/Zi
-- C++ compile flags (Debug): /MDd;/RTC1;/Od
-- C++ compile flags (Release): /MD;/O2;/Ob2;/GF
-- Exe link flags: /MANIFEST:NO;/LARGEADDRESSAWARE
-- Exe link flags (Debug): /DEBUG
-- Exe link flags (Release):
-- Shared link flags:
-- Shared link flags (Debug): /DEBUG
-- Shared link flags (Release):
-- CEF Binary files: chrome_elf.dll;d3dcompiler_47.dll;libcef.dll;libEGL.dll;libGLESv2.dll;natives_blob.bin;snapshot_blob.bin;v8_context_snapshot.bin;swiftshader
-- CEF Resource files: cef.pak;cef_100_percent.pak;cef_200_percent.pak;cef_extensions.pak;devtools_resources.pak;icudtl.dat;locales
-- Configuring done
-- Generating done
-- Build files have been written to: D:/QCefView-master/build.win2、通过生成的sln项目，我们在visual studio中打开项目，并进行库文件的编译
项目结构：
依次设置 libcef_dll_wrapper 、QCefProto、QCefView、QCefWing为启动项目，生成目标项目，可得到对应的目标文件。
正常运行，生成如下桌面程序：
自此，QCefView使用第一步，也就是第一篇到此完成。接下来，将和大家分享如何在自己的Qt项目中使用QCefView。