# Bina Suis Lampu 3D dengan Interaksi - Spline Academy (https://spline.design/ms/academy/tutorials/build-a-3d-light-switch-with-interaction)

> Dalam tutorial ini, kita akan meninjau semula idea interaksi togol menggunakan ciri baharu 'Toggle' yang tersedia dalam peristiwa Mouse dan Key.

1. [Academy](https://spline.design/ms/academy)
2. [Tutorial](https://spline.design/ms/academy/tutorials)
3. Bina Suis Lampu 3D dengan Interaksi

# Bina Suis Lampu 3D dengan Interaksi

Spline 3DPertengahan13 min

Dalam tutorial ini, kita akan meninjau semula idea interaksi togol menggunakan ciri baharu 'Toggle' yang tersedia dalam peristiwa Mouse dan Key.

Ciri ini memudahkan penciptaan kesan togol dengan satu peristiwa sahaja.

Versi langsung: <https://my.spline.design/switchtutorial-70a23dd070513899912c011c202b0368/>

## Apa yang akan anda pelajari

1. [0:00Pengenalan](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=0s)
2. [0:55Mencipta asas suis](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=55s)
3. [3:00Mencipta bentuk suis](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=180s)
4. [7:20Menambah bingkai suis](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=440s)
5. [8:40Menambah peristiwa togol tetikus](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=520s)
6. [9:55Perincian akhir](https://www.youtube.com/watch?v=lJIDSiDlhvw&t=595s)

## Sumber berkaitan

- [Switch ToggleTemplat](https://app.spline.design/academy/tutorials/build-a-3d-light-switch-with-interaction?redirect-duplicate-template-uuid=10f3c48a-c074-4e8d-bea0-607edaa22121&is-2d-file=false)
- [3D Modeling ToolsDokumen](https://docs.spline.design/designing-in-3-d/3d-modeling-tools)
- [Materials & ShadingDokumen](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)
- [Events & InteractivityDokumen](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)
- [Transition ActionDokumen](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)

## Gambaran keseluruhan

- Spline 3D
- 13 min
- Pertengahan

## Sebahagian daripada

- [Asas Pemodelan dalam Spline](https://spline.design/ms/academy/collections/modeling-essentials-in-spline/build-a-3d-light-switch-with-interaction)

## Tutorial berkaitan

[Semua tutorial](https://spline.design/ms/academy/tutorials)

[Bina Papan Kekunci Interaktif Gelap dalam 3DSpline 3DPertengahan16 min](https://spline.design/ms/academy/tutorials/build-a-dark-interactive-keyboard-in-3d)[Reka Bentuk Papan Kekunci 3D InteraktifSpline 3DPertengahan17 min](https://spline.design/ms/academy/tutorials/design-an-interactive-3d-keyboard)[Bina Planet 3D Realistik dengan Bahan & PencahayaanSpline 3DPemula7 min](https://spline.design/ms/academy/tutorials/build-a-realistic-3d-planet-with-materials-lighting)

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

Editor 3D dan 2D untuk pasukan dan ejen mereka. Terbitkan ke web, iOS dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Reka Bentuk 3D](https://spline.design/ms/3d-design)
- [Hana](https://spline.design/ms/hana)
- [Omma](https://omma.build)
- [Penjanaan 3D AI](https://spline.design/ms/ai-generate)
- [Spline MCP](https://spline.design/ms/mcp)
- [Spline Arena](https://spline.design/ms/arena)
- [Harga](https://spline.design/ms/pricing)
- [Perusahaan](https://spline.design/ms/enterprise)

#### Runtime

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

#### Aplikasi

- [Muat Turun](https://spline.design/ms/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Muat turun Spline Mirror](https://spline.design/download-mirror)

#### Belajar

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/ms/academy)
- [API Spline](https://www.npmjs.com/package/@splinetool/runtime)
- [Penyelesaian](https://spline.design/solutions)

#### Komuniti

- [Komuniti Spline](https://community.spline.design)
- [Blog](https://spline.design/ms/blog)
- [Log Perubahan](https://spline.design/ms/changelog)
- [Pendidikan](https://spline.design/ms/education)
- [Contra](https://spline.design/contra)
- [Afiliat](https://spline.design/ms/affiliate)

#### Syarikat

- [Pelanggan](https://spline.design/ms/customers)
- [Kerjaya](https://www.ycombinator.com/companies/spline/jobs)
- [Keselamatan](https://spline.design/ms/security)

#### Undang-undang

- [Terma & Syarat](https://spline.design/terms)
- [Privasi](https://spline.design/privacy)

#### Hubungi

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

© 2026 - Spline, Inc.