Step4: App

After Signin Page and MainView Page finish, add it into App Window

use ROOT-GLOBAL.state.is-signin to manage signin state and use if to switch page

Global is-signin

write a State struct to manage user state, now it only need is-signin

#![allow(unused)]
fn main() {
export struct State {
    is-signin: bool,
}

export global ROOT_GLOBAL {
  in-out property <length> window-height : 844px;
  in-out property <length> window-width : 390px;
  in-out property <length> font-size : 16px;
  in-out property <length> padding : 0px;
  out property <brush> theme-color: #0078D4;
  // use is-signin to manage signin state
  in-out property <State> state: {
    is-signin: false,
  };
}

App Source Code

#![allow(unused)]
fn main() {
import { MainView, Signin} from "./index.slint";
import { ROOT_GLOBAL } from "./global.slint";
import { SText, SIcon } from "modules/surrealism-ui/index.slint";

export component App inherits Window {
  height: ROOT-GLOBAL.window-height;
  width: ROOT-GLOBAL.window-width;
  title: @tr("Outlook Example");

  if !ROOT-GLOBAL.state.is-signin : singin:= Signin {}
  if ROOT-GLOBAL.state.is-signin : main-view:= MainView {}
}
}