setStyle

Category: Style Management

Namespace: web.styles.setStyle

Description

Sets the active VCL style by name. Important: This restarts the application to apply the new style.

Syntax

const result = await web.styles.setStyle('Windows10');

Parameters

• styleName (required) - Name of the style to activate (case-insensitive)

Returns

Promise<string> - Returns a promise that resolves with the style name if successful, empty string if failed

Examples

Simple example

const result = await web.styles.setStyle('Glow');

if (result) {
    console.log('Style changed to:', result);
    // Application will restart automatically
} else {
    console.log('Failed to change style');
}

Switch to dark theme

// Switch to a dark theme
const result = await web.styles.setStyle('Amakrits');

if (result) {
    console.log('Switched to dark theme');
    // App restarts with new style
}

Style selector with validation

async function changeStyle(styleName) {
    // Get list of available styles first
    const styles = await web.styles.listStyles();
    
    // Check if style exists
    if (!styles.includes(styleName)) {
        console.error('Style not available:', styleName);
        return false;
    }
    
    // Apply the style
    const result = await web.styles.setStyle(styleName);
    return result !== '';
}

await changeStyle('Windows10');

Use Cases

• Allow users to change application theme
• Switch between light and dark themes
• Apply user's saved style preference on startup
• Implement theme selection in settings
• Change appearance based on time of day

Notes

• IMPORTANT: Application automatically restarts to apply the new style
• Current URL is preserved and restored after restart
• Style name is case-insensitive (converted to uppercase internally)
• Returns empty string if style doesn't exist or can't be loaded
• Only styles embedded in the application at compile time can be used
• The restart happens immediately after successful style change