how to open a new window?

[cicada1993]

i tried to add a new view on current window as follow,successed
import CustomView from "./CustomView .svelte"; let viewContainer= document.createElement("view") viewContainer['setStyle']("width", "400px") viewContainer["setStyle"]("height", "400px") document.body.childNodes[0].childNodes[0].appendChild(viewContainer) let viewInstance = new CustomView ( { target: viewContainer, props: {} } )
i tried to create a new window as app.ts done but failed

[shirakaba]

This'll work:

<script lang="ts">
    import { onMount } from 'svelte';
    import type { NSVElement, RNWindow } from "@nodegui/svelte-nodegui";

    let win;
    let anotherWin;
    function showAnotherWindow(checked: boolean): void {
        (anotherWin as NSVElement<RNWindow>).nativeView.show();
    }
    function hideAnotherWindow(checked: boolean): void {
        (anotherWin as NSVElement<RNWindow>).nativeView.hide();
    }
    onMount(() => {
        // Prevent garbage collection of both of these references to the windows.
        (window as any).win = win;
        (window as any).anotherWin = anotherWin;

        (win as NSVElement<RNWindow>).nativeView.show();
        
        return () => {
            delete (window as any).win;
        };
    });
</script>

<window bind:this={win} windowTitle="Main window">
    <view class="container" style="background-color: '#41444A';">
        <text style="color: white;">Main window</text>
        <button
            on:clicked={showAnotherWindow}
            text="Show the other window"
        />
    </view>
</window>

<window bind:this={anotherWin} windowTitle="Another window">
    <view class="container" style="background-color: 'orange';">
        <text style="color: black;">Another window!</text>
        <button
            on:clicked={hideAnotherWindow}
            text="Hide this window"
        />
    </view>
</window>

<style>
    .container {
        align-items: 'center';
        justify-content: 'space-around';
    }
</style>

Note that the new window will open in exactly the same place as the old one. You'll have to explore the NodeGUI and Qt APIs to see how to open the window in a more suitable position.

To better organise your code, you may prefer to wrap up each window as a separate Svelte component. The Svelte docs show how to do that here: https://svelte.dev/tutorial/nested-components