loadStyleFromFile

Category: Style Management

Namespace: web.styles.loadStyleFromFile

Description

Loads a VCL style from an external .vsf file and applies it. Important: This restarts the application to apply the new style.

Syntax

const success = await web.styles.loadStyleFromFile('C:\\Styles\\MyTheme.vsf');

Parameters

• filePath (required) - Full path to the .vsf (VCL Style File) to load

Returns

Promise<boolean> - Returns a promise that resolves with true if successful, false if failed

Examples

Simple example

const success = await web.styles.loadStyleFromFile('C:\\Themes\\Custom.vsf');

if (success) {
    console.log('Custom style loaded');
    // Application will restart automatically
} else {
    console.log('Failed to load style file');
}

Load style with file picker

// Let user select a style file
// NOTE: openFile returns a string path directly, or "" if cancelled
const filePath = await web.dialogs.openFile({
    title: 'Select VCL Style File',
    fileTypes: 'VCL Style Files (*.vsf)|*.vsf'
});

if (filePath) {
    const loaded = await web.styles.loadStyleFromFile(filePath);

    if (loaded) {
        console.log('Style loaded from:', filePath);
    } else {
        alert('Failed to load style file');
    }
}

Load style with validation

async function loadCustomStyle(filePath) {
    // Check if file exists
    const exists = await web.files.fileExists({ filePath });
    
    if (!exists) {
        console.error('Style file not found:', filePath);
        return false;
    }
    
    // Check file extension
    if (!filePath.toLowerCase().endsWith('.vsf')) {
        console.error('Invalid file type. Must be .vsf');
        return false;
    }
    
    // Load the style
    const success = await web.styles.loadStyleFromFile(filePath);
    return success;
}

await loadCustomStyle('C:\\MyStyles\\theme.vsf');

Use Cases

• Load custom themes from external files
• Allow users to import downloaded themes
• Support theme marketplace or downloads
• Load organization-specific branding themes
• Enable theme customization without recompiling

Notes

• IMPORTANT: Application automatically restarts to apply the loaded style
• Current URL is preserved and restored after restart
• File must be a valid VCL Style File (.vsf format)
• Returns false if file doesn't exist or is invalid
• The style file path is passed as a parameter on restart
• External styles allow theme customization without recompiling the app
• Ensure the .vsf file is compatible with your Delphi version