Skip to main content

Clean Qt WebView widgets for hosting modern web UIs without styling conflicts

Project description

Soren-N Qt Web Bridge

PyPI version Python versions License: GPL v3

Clean Qt WebView widgets for hosting modern web UIs without styling conflicts. Features robust automated CI/CD with comprehensive multi-backend testing and fully automated PyPI publishing.

✨ Features

  • 🎨 Zero Qt Styling Conflicts - No interference with your web content's CSS
  • 🔗 Clean Python-JavaScript Bridges - Simple bidirectional communication via WebChannel
  • 🚀 Easy Integration - Drop into any Qt application with minimal setup
  • 🛠️ Development Friendly - Support for both development and production content loading
  • 📦 QtPy Compatible - Works with PySide6, PyQt6, PySide2, and PyQt5
  • 🎯 Minimal API - Small, focused API surface for easy learning

🚀 Quick Start

Installation

# Install the package
pip install soren-n-qt-web-bridge

# For examples and development
pip install soren-n-qt-web-bridge[examples]

Basic Usage

from qtpy.QtWidgets import QApplication, QMainWindow, QVBoxLayout, QWidget
from qt_web_bridge import BridgedWebView

app = QApplication([])

# Create main window
window = QMainWindow()
central_widget = QWidget()
window.setCentralWidget(central_widget)
layout = QVBoxLayout(central_widget)

# Create and setup WebView
webview = BridgedWebView()
webview.set_web_content("path/to/your/web/dist")
layout.addWidget(webview)

# Load content
webview.load_content()

window.show()
app.exec()

With Python-JavaScript Bridge

from qt_web_bridge import BridgedWebView, DataBridge, ActionBridge

# Create WebView
webview = BridgedWebView()
webview.set_web_content("web-content")

# Create bridges
data_bridge = DataBridge()
action_bridge = ActionBridge()

# Set up data
items = [
    {"id": "1", "name": "Item 1", "description": "First item"},
    {"id": "2", "name": "Item 2", "description": "Second item"}
]
data_bridge.set_items(items)

# Register action handler
def handle_button_click(params):
    print(f"Button clicked with params: {params}")
    return {"status": "success", "message": "Button click handled"}

action_bridge.register_action_handler("button_click", handle_button_click)

# Register bridges with WebView
webview.register_bridge_object("data", data_bridge)
webview.register_bridge_object("actions", action_bridge)

# Load content
webview.load_content()

JavaScript Side

<!DOCTYPE html>
<html>
<head>
    <title>My Web UI</title>
    <script src="qrc:///qtwebchannel/qwebchannel.js"></script>
</head>
<body>
    <div id="app">Loading...</div>
    
    <script>
        new QWebChannel(qt.webChannelTransport, function(channel) {
            // Access Python bridges
            const data = channel.objects.data;
            const actions = channel.objects.actions;
            
            // Get data from Python
            const itemsJson = data.get_all_items();
            const items = JSON.parse(itemsJson);
            console.log('Items from Python:', items);
            
            // Call Python action
            function handleClick() {
                actions.execute_action('button_click', JSON.stringify({
                    button: 'test',
                    timestamp: Date.now()
                }));
            }
            
            // Listen for data updates from Python
            data.items_loaded.connect(function(itemsJson) {
                const items = JSON.parse(itemsJson);
                updateUI(items);
            });
        });
    </script>
</body>
</html>

🔧 Core Components

BridgedWebView

Main WebView widget with zero Qt styling interference.

WebViewBridge

Base class for Python-JavaScript communication.

DataBridge

Specialized bridge for data synchronization.

ActionBridge

Specialized bridge for handling user actions.

WebViewPanel

Optional panel wrapper for host application integration.

🎯 Use Cases

  • Houdini Plugin UIs - Integrate React/Vue UIs into Houdini panels
  • Maya Tools - Modern web UIs without Qt styling conflicts
  • Desktop Applications - Hybrid Qt/Web applications
  • Data Visualization - Interactive charts and dashboards

🔍 Examples

Run the included examples:

# Simple WebView demo
python examples/simple_webview_example.py

# Bridge communication demo  
python examples/bridge_communication_example.py

📄 License

GPL v3 or later - see LICENSE file for details.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

soren_n_qt_web_bridge-1.1.10.tar.gz (22.1 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

soren_n_qt_web_bridge-1.1.10-py3-none-any.whl (13.8 kB view details)

Uploaded Python 3

File details

Details for the file soren_n_qt_web_bridge-1.1.10.tar.gz.

File metadata

  • Download URL: soren_n_qt_web_bridge-1.1.10.tar.gz
  • Upload date:
  • Size: 22.1 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.12.9

File hashes

Hashes for soren_n_qt_web_bridge-1.1.10.tar.gz
Algorithm Hash digest
SHA256 2bfb9b76ade15e91293802b0b53106ee299e69fba00af6546824534add0525b5
MD5 109b5272adab41e5adf25ab515892cb1
BLAKE2b-256 8b2d5f74249eaa757bf537bcda998752dc68fa7a1c9eaa248ebc69cd38db601a

See more details on using hashes here.

Provenance

The following attestation bundles were made for soren_n_qt_web_bridge-1.1.10.tar.gz:

Publisher: release.yml on soren-n/qt-web-bridge

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file soren_n_qt_web_bridge-1.1.10-py3-none-any.whl.

File metadata

File hashes

Hashes for soren_n_qt_web_bridge-1.1.10-py3-none-any.whl
Algorithm Hash digest
SHA256 76b12aac238fb531fd65d6feeeca53c8e53a7a4b4c4e3effc584cd36e2244387
MD5 4b16d9ff235435a217691e3d864ad3d1
BLAKE2b-256 c3654647d80cf19c027e131d8be54ed4f0a067c39fc7f67ee3cf37ef5a33c6a8

See more details on using hashes here.

Provenance

The following attestation bundles were made for soren_n_qt_web_bridge-1.1.10-py3-none-any.whl:

Publisher: release.yml on soren-n/qt-web-bridge

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page