joken1310 - 博客园

Qt 是一个使用 C++ 编写的跨平台开发框架

摘要： Qt 是一个使用 C++ 编写的跨平台开发框架。它主要用于开发跨平台的桌面应用程序、嵌入式系统应用、移动应用以及多媒体和网络应用。Qt 提供了一套丰富的类库和工具，使开发者能够利用 C++ 语言高效地构建功能丰富、性能优越且能够在多个操作系统和硬件平台上运行的应用程序。 1. Qt 的核心特性 1 阅读全文

posted @ 2025-04-14 21:10 joken1310 阅读(406) 评论(0) 推荐(0)

QWebChannel 实现window软件和web网页的通信

摘要： QWebChannel 是 Qt 提供的一种机制，用于在 Qt 应用程序和 Web 页面（JavaScript）之间进行双向通信。它基于 Qt WebEngine 或 Qt WebKit，允许将 Qt 对象暴露给 JavaScript，并允许 JavaScript 调用这些对象的方法或访问其属性，同阅读全文

posted @ 2025-04-14 20:57 joken1310 阅读(399) 评论(0) 推荐(0)

react native `AsyncStorage` 键值对存储系统使用

摘要： AsyncStorage 是 React Native 提供的一个简单的、异步的键值对存储系统，用于在设备上持久化存储数据。它类似于浏览器中的 localStorage，但它是异步的，并且适用于移动应用环境。以下是 AsyncStorage 的基本使用方法，包括安装、常用操作示例以及一些注意事项。阅读全文

posted @ 2025-04-01 21:12 joken1310 阅读(226) 评论(0) 推荐(0)

react native 如何实现页面路由

摘要：页面tab路由、普通路由跳转在 React Native 中，实现 Tab 路由和普通页面跳转通常需要使用导航库。最常用的导航库是 @react-navigation/native，它提供了多种导航方式，包括 Tab 导航和 Stack 导航。下面是如何使用 @react-navigation/ 阅读全文

posted @ 2025-04-01 21:09 joken1310 阅读(174) 评论(0) 推荐(0)

Realm 跨平台nosql 数据库使用，react native

摘要： Realm 是一个跨平台的移动数据库，专为现代移动应用设计，提供了比传统 SQLite 更高的性能和更简单的 API。Realm 支持 React Native、iOS 和 Android 平台，允许开发者以面向对象的方式操作数据库，而无需编写复杂的 SQL 查询。以下是如何在 React Nat 阅读全文

posted @ 2025-04-01 21:06 joken1310 阅读(203) 评论(0) 推荐(0)

SQLite 如何使用

摘要： SQLite 基本使用 SQLite 是一个轻量级的嵌入式数据库，广泛用于移动应用、桌面应用和小型服务器应用中。以下是如何使用 SQLite 的基本步骤： 1. 安装 SQLite 在大多数操作系统中，SQLite 已经预装。如果没有，可以通过以下方式安装： Windows: 下载 SQLite 预阅读全文

posted @ 2025-04-01 21:02 joken1310 阅读(463) 评论(0) 推荐(0)

react 原子样式写法

摘要： React 中使用原子样式写法原子样式(Atomic CSS)是一种将样式分解为最小可复用单元的CSS编写方法。在React中，你可以通过以下几种方式实现原子样式： 1. 使用Tailwind CSS Tailwind是目前最流行的原子CSS框架之一： import React from 'rea 阅读全文

posted @ 2025-03-27 21:52 joken1310 阅读(55) 评论(0) 推荐(0)

js Reflect 内置对象，用于设置对象属性

摘要： Reflect 是 JavaScript 中的一个内置对象，它提供了一组静态方法，用于执行与对象操作相关的底层功能（如属性访问、函数调用、构造函数调用等）。这些方法与 Object 或 Proxy 的方法类似，但设计更一致且适合与 Proxy 配合使用。以下是 Reflect 的核心用法和常见场景：阅读全文

posted @ 2025-03-27 21:37 joken1310 阅读(65) 评论(0) 推荐(0)

js proxy 使用，拦截对象访问，劫持器

摘要： proxy 有哪些拦截器 JavaScript Proxy 拦截器大全 Proxy 提供了13种拦截器（traps），可以拦截目标对象的几乎所有基本操作。以下是完整的拦截器列表及其用途： 1. 基本操作拦截器 get(target, property, receiver) 拦截属性读取：proxy. 阅读全文

posted @ 2025-03-27 21:32 joken1310 阅读(339) 评论(0) 推荐(0)

react native 如何在安卓虚拟机中调试

摘要：在 Android 模拟器（AVD）中调试 React Native 应用，你可以按照以下步骤操作： 1. 启动 React Native 开发环境确保你已经正确安装了 React Native 开发环境，包括： Node.js React Native CLI（或 npx） Android St 阅读全文

posted @ 2025-03-25 21:59 joken1310 阅读(490) 评论(0) 推荐(0)

ahooks 常用的方法

摘要：常用hooks ahooks 是一个由阿里巴巴团队开发的 React Hooks 库，提供了许多实用的 Hooks 来简化 React 开发。以下是 ahooks 中一些常用的用法和 Hooks： 1. useRequest - 管理异步请求 useRequest 是 ahooks 中最常用的 Ho 阅读全文

posted @ 2025-03-25 21:31 joken1310 阅读(805) 评论(0) 推荐(0)

react native hooks写法

摘要：在 React Native 中，React Hooks 是一种让函数组件可以使用状态和其他 React 特性的方法。以下是 React Native 中使用 Hooks 的最新写法和示例： 1. 使用 useState Hook useState 用于在函数组件中添加状态： import Reac 阅读全文

posted @ 2025-03-25 21:19 joken1310 阅读(77) 评论(0) 推荐(0)

document.activeElement 获取焦点元素

摘要：焦点元素获取 document.activeElement 是一个只读属性，用于返回当前文档中获得焦点的元素（即活动元素）。它可以帮助开发者获取用户当前正在交互的元素，例如输入框、按钮或其他可聚焦的 HTML 元素。主要作用获取当前聚焦的元素：通过 document.activeElement 阅读全文

posted @ 2025-03-24 21:52 joken1310 阅读(248) 评论(0) 推荐(0)

dojo 获取当前view信息方式

摘要：在 Dojo 中，获取当前 View 的信息通常涉及以下几个方面： View 的定义方式：是否使用 dijit/layout/ContentPane、dijit/layout/BorderContainer 或其他布局组件。 View 的管理方式：是否使用 dojo/router 或自定义的路由管理阅读全文

posted @ 2025-03-24 21:49 joken1310 阅读(12) 评论(0) 推荐(0)

dojo 如何监听tab栏切换

摘要：在 Dojo 中，监听 Tab 栏的切换事件可以通过 dijit/layout/TabContainer 和 dijit/layout/ContentPane 组件实现。TabContainer 提供了 selectChild 事件，可以用于监听 Tab 切换。以下是实现监听 Tab 栏切换的详细阅读全文

posted @ 2025-03-24 21:44 joken1310 阅读(20) 评论(0) 推荐(0)

dojo-build 打包dojo js ，如何使用

摘要： dojo-build 是 Dojo 的构建工具，用于将多个模块打包为一个或多个文件，从而优化加载性能，减少 HTTP 请求。以下是使用 dojo-build 的详细步骤： 1. 安装 Dojo 首先，确保你已经安装了 Dojo。可以通过以下方式获取 Dojo：从 Dojo 官网下载 Dojo 的阅读全文

posted @ 2025-03-24 21:37 joken1310 阅读(30) 评论(0) 推荐(0)

dojo js 项目结构，如何写组件

摘要：项目结构以下是对上面 Dojo 单页应用（SPA）项目的总结，包括项目结构、路由管理、组件写法等关键点。 1. 项目结构一个典型的 Dojo 单页应用项目结构如下： /my-spa ├── index.html // 主 HTML 文件 ├── app.js // 应用入口文件，处理路由和初始化阅读全文

posted @ 2025-03-24 20:52 joken1310 阅读(68) 评论(0) 推荐(0)

threejs 光照类型

摘要： Three.js 提供了多种类型的光源，每种光源模拟现实世界中的不同光照效果。以下是 Three.js 中常用的几种光源类型及其特点： 1. 环境光（AmbientLight）描述：环境光是一种全局光源，它均匀地照亮场景中的所有对象，但不会产生阴影。使用场景：用于为场景提供基础亮度，避免物体看起阅读全文

posted @ 2025-03-06 22:36 joken1310 阅读(93) 评论(0) 推荐(0)

threejs LightProbe类增加材质光照效果

摘要： LightProbe 作用，增加材质光照明亮度细节 LightProbe 是 Three.js 中用于捕捉和模拟场景中的间接光照（Indirect Lighting）的一个重要工具。它通过在场景中放置多个探针来采集环境光信息，并将这些信息应用到场景中的物体上，从而增强渲染的真实感。以下是 Light 阅读全文

posted @ 2025-03-06 22:20 joken1310 阅读(160) 评论(0) 推荐(0)

threejs OrbitControls 控件控制相机旋转、缩放和平移视图

摘要： OrbitControls 是 Three.js 中非常常用的控件库，它允许用户通过鼠标和触摸屏与3D场景进行交互，包括旋转、缩放和平移视图。要使用 OrbitControls，你需要引入相应的模块，并将其附加到你的相机和渲染器上。以下是详细的步骤和示例代码。步骤引入 OrbitControls 阅读全文

posted @ 2025-03-06 21:56 joken1310 阅读(1057) 评论(0) 推荐(0)

threejs 纹理的偏移量、缩小放大控制

摘要：在 Three.js 中，你可以通过调整材质的 map 属性和使用 repeat、offset 等属性来控制纹理的放大缩小以及位置。以下是详细说明如何实现这些功能。 1. 设置纹理的基本属性 Three.js 提供了多种方式来控制纹理的显示效果，包括缩放、平移（偏移）等。以下是一些常用的属性： .r 阅读全文

posted @ 2025-03-05 21:05 joken1310 阅读(319) 评论(0) 推荐(0)

threejs 几何体（Geometry）、材质（Material）和网格（Mesh）之间的关系

摘要：在 Three.js 中，立方体（或任何三维几何体）由多个组件构成，主要包括几何体（Geometry）、材质（Material）和网格（Mesh）。这些组件之间的关系是构建和渲染三维对象的基础。下面详细介绍它们之间的关系以及如何在 Three.js 中使用它们。 1. 几何体 (Geometry) 阅读全文

posted @ 2025-03-05 20:56 joken1310 阅读(204) 评论(0) 推荐(0)

threejs uv坐标的作用

摘要： UV坐标在三维图形学和纹理映射中起着至关重要的作用。它们是将二维纹理图像正确映射到三维模型表面的关键工具。以下是UV坐标的主要作用和重要性： 1. 纹理映射的基础 UV坐标定义了如何将二维纹理图像映射到三维几何体的表面上。每个顶点的UV坐标决定了纹理图像的哪些部分应该出现在该顶点对应的位置上。 U轴阅读全文

posted @ 2025-03-05 20:44 joken1310 阅读(120) 评论(0) 推荐(0)

threejs Vector3 类定义位置

摘要：在Three.js中，THREE.Vector3 是一个非常重要的类，用于表示三维空间中的点或向量。它提供了丰富的功能来操作三维坐标和向量，如平移、旋转、缩放、计算距离、法线等。掌握 Vector3 类的使用对于处理三维图形和动画非常重要。主要用途表示位置：用作物体的位置。表示方向：用作方向向阅读全文

posted @ 2025-03-05 20:22 joken1310 阅读(225) 评论(0) 推荐(0)

threejs 网格线GridHelper

摘要：在Three.js中，GridHelper 是一个非常有用的工具，用于在3D场景中可视化地显示一个网格平面。它可以帮助开发者更好地理解场景中的空间关系和对象的位置。GridHelper 通常用于调试和设计阶段，以提供一种直观的方式来查看坐标系和物体的相对位置。主要用途调试辅助：帮助开发者更直观地阅读全文

posted @ 2025-03-05 20:17 joken1310 阅读(270) 评论(0) 推荐(0)

threejs Group类，统一变换设置一组立方体

摘要：在Three.js中，Group 是一个非常有用的类，它允许你将多个对象组合在一起，并作为一个整体进行操作。这使得管理复杂场景变得更加简单和高效。通过使用 Group，你可以对一组对象执行统一的变换（如平移、旋转、缩放），而无需单独操作每个对象。主要用途组合管理：将多个对象组合在一起，便于管理和阅读全文

posted @ 2025-03-05 20:09 joken1310 阅读(93) 评论(0) 推荐(0)

threejs 官方案例天空盒代码分析

摘要：代码地址 https://github.com/mrdoob/three.js/blob/master/examples/webgl_effects_anaglyph.html 效果 https://threejs.org/examples/#webgl_effects_anaglyph 代码分析阅读全文

posted @ 2025-03-05 20:03 joken1310 阅读(250) 评论(0) 推荐(0)

threejs 如何用键盘上下左右控制几何体mesh移动

摘要：在 Three.js 中，可以通过监听键盘事件（上下左右键）来控制一个 Mesh 的移动。以下是一个完整的示例，展示如何实现通过方向盘（上下左右键）控制一个人的 Mesh 在场景中走动。结论通过监听键盘事件（keydown 和 keyup），记录按键状态，并结合时间差更新 Mesh 的位置，可以阅读全文

posted @ 2025-03-04 22:13 joken1310 阅读(172) 评论(0) 推荐(0)

threejs 动画播放结束如何监听

摘要：在 Three.js 中，动画的播放通常通过 THREE.AnimationMixer 和 THREE.AnimationAction 来管理。如果你想检测动画是否播放结束，可以通过监听 AnimationAction 的事件或检查其状态来实现。结论可以通过 AnimationAction 的阅读全文

posted @ 2025-03-04 22:09 joken1310 阅读(286) 评论(0) 推荐(0)

threejs GLTFExporter 导出场景为模型文件

摘要： THREE.GLTFExporter 是 Three.js 提供的一个工具类，用于将场景或模型导出为 GLTF 或 GLB 格式。GLTF（GL Transmission Format）是一种高效的 3D 文件格式，广泛用于 Web、游戏和增强现实等领域。以下是关于 GLTFExporter 的详细阅读全文

posted @ 2025-03-04 22:07 joken1310 阅读(337) 评论(0) 推荐(0)

threejs 官方效果创建 2000 个随机分布立方体代码解读

摘要：效果 https://threejs.org/examples/#webgl_interactive_cubes 代码地址 https://github.com/mrdoob/three.js/blob/master/examples/webgl_interactive_cubes.html 以下是阅读全文

posted @ 2025-03-04 21:48 joken1310 阅读(67) 评论(0) 推荐(0)

threejs 官方案例茶壶代码解读

摘要：案例案例代码地址： https://github.com/mrdoob/three.js/blob/master/examples/webgl_geometry_teapot.html#L133 案例效果地址： https://threejs.org/examples/#webgl_geometr 阅读全文

posted @ 2025-03-04 21:34 joken1310 阅读(124) 评论(0) 推荐(0)

lil-gui 使用，作为threejs控制面板

摘要：基本使用方式 lil-gui 是一个轻量级的 JavaScript GUI 库，专门用于创建简单的调试面板或参数调整界面。它非常适合在开发过程中用来快速测试和调整参数，尤其是在图形编程（如 three.js）中非常常见。 1. lil-gui 的功能 lil-gui 提供了一个简单的界面，允许用户通阅读全文

posted @ 2025-03-04 21:28 joken1310 阅读(551) 评论(0) 推荐(0)

ts 如何声明入参是函数的函数类型

摘要：在 TypeScript 中，声明入参函数的类型有多种方式，以下是总结和推荐的几种方法： 1. 内联定义函数类型直接在参数中定义函数的类型，指定其参数和返回值类型。 function execute(fn: (arg: number) => string): void { const result 阅读全文

posted @ 2025-03-03 22:04 joken1310 阅读(564) 评论(0) 推荐(0)

threejs traverse 遍历api

摘要：在 Three.js 中，traverse 是一个非常有用的方法，用于遍历场景或对象的层级结构（Hierarchy）。它允许你访问对象及其所有子对象（包括嵌套的子对象），从而对它们进行操作、检查或修改。结论 traverse 方法用于递归遍历对象及其所有后代节点（子对象、孙对象等），适用于需要批量阅读全文

posted @ 2025-03-03 21:38 joken1310 阅读(526) 评论(0) 推荐(1)

threejs 将3d模型动画收集为数组，按需调用

摘要：在 Three.js 中，如果一个 3D 模型文件包含多个动画（例如 GLTF 文件中的多个 AnimationClip），你可以将这些动画收集到一个数组中，并通过代码逐一调用或管理它们。以下是详细的说明和实现方法。结论可以将模型文件中的多个动画收集为一个数组，并在 Three.js 中通过 T 阅读全文

posted @ 2025-03-03 21:27 joken1310 阅读(140) 评论(0) 推荐(0)

threejs scene 坐标轴，空间坐标轴，右手坐标轴

摘要：在 Three.js 中，scene（场景）是一个三维空间的容器，用于存储和管理所有对象（如几何体、光源、相机等）。场景中的坐标轴定义了三维空间的方向和位置基准。以下是关于 scene 坐标轴的详细介绍。结论 Three.js 使用右手坐标系，默认情况下： X 轴：水平向右为正。 Y 轴：垂直向上阅读全文

posted @ 2025-03-03 21:20 joken1310 阅读(368) 评论(0) 推荐(0)

threejs 动画混合器介绍

摘要：动画混合器介绍，用于加载模型动画，动画片段的控制在 Three.js 中，THREE.AnimationMixer 是用于管理和播放模型动画的核心类。它允许你加载、控制和混合多个动画剪辑（Animation Clip），从而实现复杂的动画效果。以下是关于 AnimationMixer 的详细介绍，阅读全文

posted @ 2025-03-03 21:08 joken1310 阅读(241) 评论(0) 推荐(0)

threejs 实现看车车内车外全景图

摘要：在 Three.js 中实现全景看车内车外功能，可以通过加载两张不同的全景图（一张代表车外视角，另一张代表车内视角），并根据用户交互动态切换这两张全景图来实现。以下是详细的实现步骤和关键概念。结论通过加载两张全景图（车外和车内），结合用户交互（如点击按钮或热点）动态切换场景背景，可以实现全景看车阅读全文

posted @ 2025-03-03 21:00 joken1310 阅读(135) 评论(0) 推荐(0)

threejs 热点创建、点击捕捉事件

摘要：在 Three.js 中，热点（Hotspots）通常用于增强交互体验，例如在全景图中添加可点击的区域或图标，用户点击后可以触发特定事件（如切换视角、显示信息等）。以下是关于如何实现和使用热点的相关 API 和方法的详细介绍。结论 Three.js 本身没有专门的“热点 API”，但可以通过结合阅读全文

posted @ 2025-03-03 20:59 joken1310 阅读(345) 评论(0) 推荐(0)

joken-前端工程师