iT邦幫忙

2024 iThome 鐵人賽

DAY 12
0
Mobile Development

Flutter基礎入門系列 第 12

【Day 12】太多import? 用export試試!

  • 分享至 

  • xImage
  •  

export: 複數檔案的匯入

在前一篇中,談到如何分類應用程式的各個子檔案,那麼有沒有想過,建立成子檔案後,要如何將他們import至其他檔案中呢?
最直觀的方法,就是將每個檔案一一匯入,如以下範例:

import 'presentation/pages/schedule.dart';
import 'presentation/pages/settings.dart';
import 'presentation/pages/timetable.dart';
import 'presentation/pages/todo.dart';
import 'presentation/widgets/widget1.dart';
import 'presentation/widgets/widget2.dart';

此時的資料夾結構如下:

lib/
├── main.dart
└── presentation/
   ├── pages/
   │  ├── schedule.dart
   │  ├── settings.dart
   │  ├── timetable.dart
   │  └── todo.dart
   ├── presentation.dart
   └── widgets/
      ├── widget1.dart
      └── widget2.dart

以上這種import方式,若是我們的子檔案再更多,那麼究竟要有多少行重複的內容啊!不覺的反而讓程式看起來有點亂了嗎?這個時候,就有一個很好用的東西出現了,那就是export

export光看他的名字,應該可以猜到是個與import有著相關功能的保留字。想一次性匯入多個檔案到程式中,接續上述的範例,我們便需要另外建立一個檔案 presentation.dart,而在這個檔案中export presentation 資料夾中我們所想匯入程式的檔案。這麼一來,我們只需要import presentation.dart這個檔案即可。

// presentation.dart
export 'pages/schedule.dart';
export 'pages/settings.dart';
export 'pages/timetable.dart';
export 'pages/todo.dart';
export 'widgets/widget1.dart';
export 'widgets/widget2.dart';

// main.dart
import 'presentation/presentation.dart';

如此一來,程式是不是就變得乾淨許多呢。

Schedrag專案進度

未來,這個schedrag專案的內容將以顯示筆者現在進度報告的方式顯示在此篇文章。
以下為今日進度:

  1. 為各個page製作獨立檔案,並將原本於main.dart中顯示在各個頁面的文字移至該頁面的檔案中。
  2. 建立blocks.dart的model,用於儲存「todo/timetable's block」
    此檔案中,含有3個class: _Time, _Block, Blocks,其中,前兩個僅會在blocks.dart中使用,因此將他們設為private(加底線)。
    _Time之中,利用DateTime的資料結構來儲存日期、時間,並利用Duration來儲存共花費的時間。
// data/blocks.dart
class _Time {
  DateTime startTime, endTime;
  late Duration diffTime;
  _Time(this.startTime, this.endTime, this.diffTime);
  _Time.noParams()
      : startTime = DateTime.now(),
        endTime = DateTime.now() {
    updateDiffTime();
  }

  void setStartTime(DateTime newStart) => startTime = newStart;
  void setEndTime(DateTime newEnd) => endTime = newEnd;
  void updateDiffTime() => diffTime = startTime.difference(endTime);
}

class _Block {
  String name;
  String? category, notes;
  _Time time;

  _Block(this.name, this.time);
}

class Blocks {
  final Map<String, List<_Block>> categories = {};

  void addBlock() {}
  void removeBlock() {}

  // TODO: create file storing api
  void write2Json() {}
}

目前的資料夾結構:

lib/
├── data/
│  └── models/
│     ├── blocks.dart
├── main.dart
└── presentation/
   ├── pages/
   │  ├── schedule.dart
   │  ├── settings.dart
   │  ├── timetable.dart
   │  └── todo.dart
   ├── presentation.dart
   └── widgets/

明日,將開始嘗試將建立起的block存入裝置上的檔案,並使用map將各個不同categories的blocks分類並儲存。


謝謝讀到這裡的人,有任何想法都歡迎留言或email,明天再繼續加油!
Schedrag: nnyjan02426/schedrag
email: nnyjan02426@gmail.com


上一篇
【Day 11】如何將檔案分類?程式的資料夾結構
下一篇
【Day 13】 SQlite: 快速輕便的資料庫
系列文
Flutter基礎入門30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言