• 課程時長

    10 小時 0 分

  • 課程級別

    初級

  • 授課語言

    中文

這堂課你將會學到

  • 能夠熟悉並使用 Dart 語言進行開發
  • 了解 Flutter 框架和重要的 Widget
  • 熟悉 App 的開發流程
  • 了解 Widget 間資料傳遞的邏輯
  • 能自行設計 Flutter 響應式程式

章節目錄

  • 1

    第 1 章 補充：Dart有始以來最大升級- Null Safety 最新功能和舊專案升級

    • 單元 1 - 什麼是 Null Safety及升級進程

    • 單元 2 - 在null safety下的變數宣告

    • 單元 3 - Null Safety對程式的影響

    • 單元 4 - 新的關鍵字 late

    • 單元 5 - 手動遷移舊程式

    • 單元 6 - Dart 所提供的工具、專案遷移步驟及注意事項
  • 2

    第 2 章 第一章 flutter 安裝與開發環境準備

    • 單元 1 - 安裝 flutter

    • 單元 2 - 安裝與設定android studio
  • 3

    第 3 章 第二章 蹲好馬步基本功，dart 語言和 flutter 基本 Widgets

    • 單元 1 - 看看我們要做啥?

    • 單元 2 - 創建 flutter 專案

    • 單元 3 - 來看看專案內有什麼東西--專案檔案結構

    • 單元 4 - 出發嘍! flutter 和 dart 的程式起點

    • 單元 5 - 認識第一個Widget Material App

    • 單元 6 - 二個最重要的Widget - StatefulWidget and statelessWidget

    • 單元 7 - ScaffoldWidget

    • 單元 8 - TextWidget 和 dart 類別寫法

    • 單元 9 - 改變字的顏色和大小 TextStyle

    • 單元 10 - 顯示網路上的圖片 image.network

    • 單元 11 - 讓你可以在垂直方向加入多個widget - Column

    • 單元 12 - 讓彼此多點空間 - Padding

    • 單元 13 - 另一種方試加入空間-Container的Margin and padding

    • 單元 14 - 用BoxDecoration來顯示圖片

    • 單元 15 - 取得螢幕大小

    • 單元 16 - 固定長度寬度比例AspectRatio

    • 單元 17 - 把圖片加上框框

    • 單元 18 - 右下方加上文字 Alignment

    • 單元 19 - 把程式整理一下， dart function寫法

    • 單元 20 - 深入了解dart 的 function(private, public and static)

    • 單元 21 - 再一次把重減少重複的程式碼 ， List and List.build

    • 單元 22 - 用自已的比較安心，使用本地端照片Assets and AssetsImage

    • 單元 23 - 就是要不一樣，使用自已的字型

    • 單元 24 - 第二章 程式原始碼
  • 4

    第 4 章 第三章 flutter的瞬間移動術，頁面間的移動與資料傳遞

    • 單元 1 - Widget 的領航者 Navigator

    • 單元 2 - 要去那，怎麼走 MaterialPageRoute

    • 單元 3 - 把Navigatior和Route套到 PhotoShow

    • 單元 4 - 帶個東西去吧! 傳遞資料到下一個頁面

    • 單元 5 - 來自未來的星星? Dart 的非同步機制

    • 單元 6 - 禮尚往來， 帶資料回上一頁

    • 單元 7 - 把影像檔傳到下一個Page

    • 單元 8 - 站在巨人的肩膀上，使用第三方程式套件

    • 單元 9 - 好用的圖片Widget, PhotoView

    • 單元 10 - 使用MaterialApp來管理路由

    • 單元 11 - 第三章原始碼

    • 單元 12 - 補充教材: 共用資料InheritedModel
  • 5

    第 5 章 第四章 帶你做一個 COVID-19 App(各國冠狀病毒感染資訊App)

    • 單元 1 - Covid-19連結網址

    • 單元 2 - 了解一下COVID-19 App

    • 單元 3 - 全球感染人數UI解析

    • 單元 4 - 深入了解Container、Column 和 Row 的排版技巧

    • 單元 5 - 一起來完成全球冠狀病毒資訊區

    • 單元 6 - 去蕪存菁，整理程式碼

    • 單元 7 - 一堆資料的顯示利器 ListView, builder, separated

    • 單元 8 - 客制化清單資料Widget

    • 單元 9 - 網路資料取得&來自網路消息， Response 物件

    • 單元 10 - StatefulWidget 的生與死， StatefulWidget生命週期

    • 單元 11 - 更新畫面 StatefulWidget ，狀態更新

    • 單元 12 - 用非同步的方式來更新畫面

    • 單元 13 - 客制化彈跳資訊框

    • 單元 14 - 來學如何操作一推資料 Dart 中的 Collection

    • 單元 15 - 另一種展現資料的方式 AlertDialog
  • 6

    第 6 章 第五章 會員限定，登入表單制作及資料驗證

    • 單元 1 - 本章節重點說明

    • 單元 2 - 來一點不一樣的底色，制做漸層底圖

    • 單元 3 - 中文直書行不行-帶你做一個中文直書Widget

    • 單元 4 - 來把登入標題區完成

    • 單元 5 - 使用者的輸入介面，TextField各部位元件說明

    • 單元 6 - 在登入頁中加上Textfield

    • 單元 7 - 資料都正確了嗎？　輸入資料取得和驗證

    • 單元 8 - 你的就是我的，在flutter共享資料，商業邏輯元件Bloc

    • 單元 9 - 登入頁的資料架構和LoginBloc

    • 單元 10 - 用事件驅動畫面更新，來串起整個登入流程

    • 單元 11 - 本章節投影片
  • 7

    第 7 章 第六章 好東西和好朋友分享，發佈你的Android App

    • 單元 1 - App的門面(App Icon)

    • 單元 2 - 給他獨一無二的簽章(制作App金鑰)

    • 單元 3 - 編譯資料設定

    • 單元 4 - 打包apk並用實機測試

    • 單元 5 - 本章投影片
  • 8

    第 8 章 第七章 iOS App 編譯與發佈

    • 單元 1 - iOS App 編譯與發佈

    • 單元 2 - 本章投影片
  • 9

    第 9 章 補充教材

    • 單元 1 - 類別、物件、建構子