# Kích hoạt tương tác theo khoảng cách với sự kiện Distance - Spline Academy (https://spline.design/vi/academy/tutorials/trigger-interactions-with-proximity-using-the-distance-event)

> Trong hướng dẫn này, chúng ta khám phá cách tạo các sự kiện tương tác được kích hoạt theo khoảng cách bằng sự kiện Distance.

1. [Academy](https://spline.design/vi/academy)
2. [Hướng dẫn](https://spline.design/vi/academy/tutorials)
3. Kích hoạt tương tác theo khoảng cách với sự kiện Distance

# Kích hoạt tương tác theo khoảng cách với sự kiện Distance

Spline 3DCơ bản6 phút

Trong hướng dẫn này, chúng ta khám phá cách tạo các sự kiện tương tác được kích hoạt theo khoảng cách bằng sự kiện Distance.

Chúng tôi sẽ chỉ cách khiến một đối tượng di chuyển về phía đối tượng khác khi chúng lại gần, và để tương tác đó tự động kích hoạt một hành động, như phát hoạt ảnh hoặc hiệu ứng âm thanh. Đây là cách tuyệt vời để tạo ra những cảnh có cảm giác sống động và phản hồi với những gì diễn ra xung quanh.

Demo: <https://app.spline.design/file/29466ae6-7e47-4edc-8198-0ce78b80eead>

\---

Khám phá thêm nhiều nhà sáng tạo và dự án tuyệt vời #MadeInSpline tại <https://community.spline.design/>

## Bạn sẽ học được gì

1. [0:00Giới thiệu](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=0s)
2. [0:43Thêm điều khiển game](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=43s)
3. [1:15Tạo hoạt ảnh cho khối lập phương](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=75s)
4. [1:58Tạo nhóm chứa](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=118s)
5. [2:10Thiết lập sự kiện Distance](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=130s)
6. [2:21Kiểm tra thiết lập sự kiện Distance](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=141s)
7. [4:23Ví dụ mini-game](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=263s)
8. [4:58Mẹo: thêm hiệu ứng âm thanh](https://www.youtube.com/watch?v=9U0l2%5FeKVMQ&t=298s)

## Tài nguyên liên quan

- [Distance Event logicMẫu](https://app.spline.design/academy/tutorials/trigger-interactions-with-proximity-using-the-distance-event?redirect-duplicate-template-uuid=59acf8de-0d15-4f58-9719-f032a3b6d702&is-2d-file=false)
- [How state-based animation worksTài liệu](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Distance EventTài liệu](https://docs.spline.design/interaction-states-events-and-actions/events/distance-event)

## Tổng quan

- Spline 3D
- 6 phút
- Cơ bản

## Thuộc

- [Spline 101 | Xây dựng cảnh tương tác đầu tiên của bạn](https://spline.design/vi/academy/collections/spline-101-build-your-first-interactive-scene/trigger-interactions-with-proximity-using-the-distance-event)

## Hướng dẫn liên quan

[Tất cả hướng dẫn](https://spline.design/vi/academy/tutorials)

[Thêm tương tác bằng chuột cho đối tượng 3DSpline 3DCơ bản14 phút](https://spline.design/vi/academy/tutorials/add-mouse-based-interactions-to-3d-objects)[Cách xây dựng quả cầu 3D phản hồi với chuyển động và tương tácSpline 3DTrung cấp7 phút](https://spline.design/vi/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[Cách tạo trực quan hóa dữ liệu 3D trong Spline bằng biến và API thời gian thựcSpline 3DNâng cao15 phút](https://spline.design/vi/academy/tutorials/how-to-create-3d-data-visualizations-in-spline-using-variables-and-real-time-apis)

[Spline](https://spline.design/vi)

Trình chỉnh sửa 3D và 2D cho các nhóm và tác nhân AI của họ. Xuất bản lên web, iOS và Android.

#### Hỏi AI về Spline

#### Sản phẩm

- [Thiết kế 3D](https://spline.design/vi/3d-design)
- [Hana](https://spline.design/vi/hana)
- [Omma](https://omma.build)
- [Tạo 3D bằng AI](https://spline.design/vi/ai-generate)
- [Spline MCP](https://spline.design/vi/mcp)
- [Spline Arena](https://spline.design/vi/arena)
- [Bảng giá](https://spline.design/vi/pricing)
- [Doanh nghiệp](https://spline.design/vi/enterprise)

#### Runtime

- [Web](https://spline.design/vi/web)
- [iOS](https://spline.design/vi/ios)
- [Android](https://spline.design/vi/android)

#### Ứng dụng

- [Tải xuống](https://spline.design/vi/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Tải Spline Mirror](https://spline.design/download-mirror)

#### Học

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/vi/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Giải pháp](https://spline.design/solutions)

#### Cộng đồng

- [Cộng đồng Spline](https://community.spline.design)
- [Blog](https://spline.design/vi/blog)
- [Changelog](https://spline.design/vi/changelog)
- [Giáo dục](https://spline.design/vi/education)
- [Contra](https://spline.design/contra)
- [Tiếp thị liên kết](https://spline.design/vi/affiliate)

#### Công ty

- [Khách hàng](https://spline.design/vi/customers)
- [Tuyển dụng](https://www.ycombinator.com/companies/spline/jobs)
- [Bảo mật](https://spline.design/vi/security)

#### Pháp lý

- [Điều khoản & Điều kiện](https://spline.design/terms)
- [Quyền riêng tư](https://spline.design/privacy)

#### Liên hệ

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.
