QmlSandboxExtension

KO | EN

gitlite — search

#python #go #android #machine-learning #rust #docker #nodejs #java #awesome #awesome-list #security #pytorch #ios #open-source

QmlSandboxExtension

(★ 10)

Live QML viewer for VS Code

QmlSandboxExtension Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

![Logo](https://raw.githubusercontent.com/SavenkovIgor/QmlSandboxExtension/main/resources/logo.png)

# QML Sandbox extension for Visual Studio Code

Welcome to QmlSandboxExtension, a specialized tool designed to streamline
the development process for QML experiments. This extension allows you
to preview your QML files directly within Visual Studio Code, eliminating
the need for context switching and enhancing your productivity.

[![Build status](https://github.com/SavenkovIgor/QmlSandboxExtension/actions/workflows/Build.yml/badge.svg)](https://github.com/SavenkovIgor/QmlSandboxExtension/actions/workflows/Build.yml)

## Quick start

![Quick start](https://raw.githubusercontent.com/SavenkovIgor/QmlSandboxExtension/main/resources/quick_start.gif)

To get started:

1. Open or create a file with QML content
1. Check at the bottom right corner that `QML` language is detected properly
1. Click on the `run` icon appeared at the top right corner of your QML file or
 press `Ctrl+Shift+Q` to open the preview window

## Features

- **Preview QML:** This extension allows you to preview standalone QML files in
a sandbox environment. To open the preview window, simply click on the `run`
icon located at the top-right corner of your QML file, use the
`Open QML Sandbox` command, or press `Ctrl+Shift+Q`.

> Make sure that VSCode properly identifies your file as QML; otherwise, the
icon won't appear. QML language support is provided through the `bbenoist.QML`
extension dependency.

- **Screenshot**: You can take screenshot of your QML scene by clicking on the
`camera` icon in the top-right corner of the preview window or by using
the `Screenshot QML Scene` command.

- **Live-Update**: The QML preview auto-updates with each file change. To
disable this updates, click the `QML Live-update` item in the status bar
when the QML WebView is open. After disabling live-update, an icon for manual
QML sandbox tab update will appear at the top of code editor.

- **Special Qml Engine modes**: You can switch between different QML engine
view modes like Overdraw, Batches and Clip, using dropdown menu in `run` button.
Overdraw mode shows the layers of your QML scene in 3D space.
Batches mode shows the separate batches that are rendered in your QML scene.
Clip mode shows the clipping regions of your QML scene.

![QML Live-update](https://raw.githubusercontent.com/SavenkovIgor/QmlSandboxExtension/main/resources/status_bar.png)

## Build dependencies

- Cmake/Ninja
- aqtinstall (optional script for Qt installation)
- Qt 6.6.3
- Emscripten 3.1.37

## Contributing

We welcome and appreciate contributions! If you would like to contribute to
QmlSandboxExtension, please fork the repository and submit a pull request.

QmlSandboxExtension

QmlSandboxExtension Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

QmlSandboxExtension

QmlSandboxExtension Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README