校務通系列介面與函式共用(施工中) #

長期校務通相關系列的app，介面與相關功能都極為相似，將相關的介面與函式庫，製作此套件以方便維護。

展示網頁

相關專案 #

• 高科校務通
• 中山校務通
• 台科校務通

套件使用要求 #

• Flutter v1.20 以上

目前共用項目 Todo List #

• 資源
  • 主題色
    • 基本顏色
    • 淺色主題
    • 深色主題
  • 圖示
    • Outline
    • Filled
  • 圖片資源(97KB)
• 工具類
  • 多國語言
  • 共用函式
  • 提示訊息(Toast - Flutter Level)
  • SharePreferences 包裝
• 元件
  • 抽屜 ap_drawer.dart
  • 一般對話框 default_dialog.dart
  • 選項對話框中選項 dialog_option.dart
  • 頁面提示 hint_content.dart
  • 選項對話框 option_dialog.dart
  • 進度對話框 progress_dialog.dart
  • 設定頁元件 setting_widget.dart
  • 是或否對話框 yes_no_dialog.dart
• 頁面(pages)
  • 關於我們 about_us_page.dart
  • 開放原始碼 open_source_page.dart
  • 使用者資訊 user_info_page.dart
  • 最新消息詳細資訊 news_content_page.dart
• 頁面骨架(scaffold)
  • 課表
  • 成績
  • 首頁
  • 校園資訊
    • 教務處最新消息
    • 學校電話
    • 行事曆
  • 空堂教室查詢
  • 登入頁

Getting Started #

在 pubspec.yaml 中加入 package

    # 官方多國語套件
    flutter_localizations:
        sdk: flutter
    ap_common: ^0.4.0

執行加入套件

  $ flutter package get

主題色設定 #

在MaterialApp 上一層加入主題色模式(ThemeMode)設定 否則無法正常顯示
此功能只支援flutter v1.9 以上的SDK

    ThemeMode themeMode = ThemeMode.system;

    @override
      Widget build(BuildContext context) {
        return ApTheme(
            themeMode,
            child: MaterialApp(
              // (選擇)是否加入 
              theme: ApTheme.light,
              darkTheme: ApTheme.dark,
              themeMode: themeMode,
            ),
        );
    }

多國語言支援列表 #

• 繁體中文(zh-TW)
• 英文(en-US)

在 MaterialApp 加入多國語言支援

    ThemeMode themeMode = ThemeMode.system;

    @override
      Widget build(BuildContext context) {
        return MaterialApp(
              // 在此設定使用的語言，否則會按照系統提供語言，若為不支援語言 預設為英文
              localeResolutionCallback:
                    (Locale locale, Iterable<Locale> supportedLocales) {
                  return locale;
                },
               localizationsDelegates: [
                const ApLocalizationsDelegate(),
              ],
              supportedLocales: [
                const Locale('en', 'US'), // English
                const Locale('zh', 'TW'), // Chinese
              ],
            );
    }

widgets #

此項目必須加入主題色設定，否則會無法正常使用

//TODO 文件

pages #

此項目必須加入多國語言設定，否則會無法正常使用

//TODO 文件

Scaffold #

首頁骨架 ScoreScaffold #

課表骨架 CourseScaffold #

提供顯示課表(Course Table)骨架，另將課表CourseContent與課程列表CourseList另拆成兩個Ｗidget

• 支援響應式介面
• 支援上課通知(Android & iOS & MacOS)
• 將課表加入至行事曆App(Android & iOS)

手機介面

平板 or 桌面版介面

CourseData #

CourseDetail #

此類別會影響課程列表中的介面

Coursetables #

Course #

Date #

成績骨架 ScoreScaffold #

登入骨架 LoginScaffold #