slint/examples/energy-monitor/ui/desktop_window.slint

// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT

import { Theme } from "theme.slint";
import { SmallMain } from "small_main.slint";
import { BigMain } from "big_main.slint";
import { MidMain } from "mid_main.slint";
import { BarTileModel } from "widgets/widgets.slint";
import { Images } from "images.slint";
import { Theme } from "theme.slint";
import { HeaderAdapter } from "blocks/blocks.slint";
import { Navigation, MenuButton, Menu, Value } from "widgets/widgets.slint";
import { BalanceAdapter, OverviewAdapter, UsageAdapter, WeatherAdapter, MenuPageAdapter, MenuOverviewAdapter, SettingsAdapter } from "pages/pages.slint";
import { KioskOverlay } from "blocks/kiosk_overlay.slint";

export { OverviewAdapter, UsageAdapter, Value, WeatherAdapter, MenuPageAdapter, MenuOverviewAdapter, SettingsAdapter,
    BarTileModel, Images, HeaderAdapter }

export component MainWindow inherits Window {
    private property <length> big-break-point: 1366px;
    private property <length> mid-break-point: 799px;

    private property <bool> show-big: root.width >= big-break-point;
    private property <bool> show-mid: root.width >= mid-break-point && root.width < big-break-point;
    private property <bool> show-small: !show-big && !show-mid;

    title: "EnergyMNG Demo";
    min-width: 320px;
    min-height: 240px;
    background: Theme.palette.pure-black;
    preferred-width: 800px;
    preferred-height: 480px;

    /* The design is not finished yet
    if show-big : BigMain {
        preferred-width: 100%;
        preferred-height: 100%;
    }
    */

    if show-mid || show-big : MidMain {
        preferred-width: 100%;
        preferred-height: 100%;
    }

    if show-small : SmallMain {
        preferred-width: 100%;
        preferred-height: 100%;
    }

    if SettingsAdapter.kiosk-mode-checked : KioskOverlay {}
}