Flutter

Flutter – StreamBuilder 邏輯與應用情境

Widget 邏輯 – 就記住一句話 The StreamBuilder widget connects to a Stream and asks Flutter to rebuild every time it receives an event using the given builder() function.也就是說,每次收到新的 async 通知都會 rebuild 一次。(根據 builder function 行動。) 因此 只要有需要「即時性」更新畫面、有所反應,我們就會使用到 StreamBuilder。 小故事 和各位分享一個小故事,我曾聽聞 StreamBuilder 用在 Authentication。當下我思索了腦中 Authentication 的結構模樣,實在想不出為什麼身份驗證需要透過 StreamBuilder 這等即時性驗證的東西來完成。 透過 http request 也可以實現 Authentication 啊?只要存取 Client Session 就可以知道使用者是否為登入狀態。 …

Flutter – StreamBuilder 邏輯與應用情境 Read More »

2023/6/17 每日筆記

每日筆記 前言 以下是今天的主題: 數位行銷 & 數據行銷 數位行銷 & 數據行銷 來到公司後,規劃中有一項目標是「協助公司進行內部數據系統彙整」,每一個系統的開發、設計,背後都有其相應的理由。目前預計使用 Google Sheet、AppSheet、AppScript 來協助公司彙整、分析已有的數據。 因此,有幾個目標需要學習: 如何進行 數據分析(包括 取得、處理清理、彙整、創新、呈現) Google AppSheet、Google AppScript 使用、開發的學習。 數位行銷 & 數據行銷 我還不是很清楚這兩者的差異,以及其內容「大概」在做什麼,因此先調查相關資訊。 digitspark – 淺談數位行銷 & 數據行銷  電子豹 – EDM 行銷為什麼還是這麼夯?再行銷:抓住老顧客、增加黏性、提升客戶終生價值 EDM(Electronic Direct Mail) 目的大致可以歸類為: 加強印象延長關係 電子商務增加營收 提高實體活動參與 訊息傳遞 -> 客戶點閱 -> 點擊信件內的 CTA 連結而成功轉換。 以「新客戶」來說 => 潛在客戶 -> 使用廣告簡訊、廣告聯播、FB、Line@、IG、Youtube等 準客戶 -> …

2023/6/17 每日筆記 Read More »

2023/6/15 每日筆記

每日筆記 前言 今天有以下幾個主題: Networking & http JSON & serialization Networking & http 使用 http package Future is a core Dart class for working with async operations. A Future object represents a potential value or error that will be available at some time in the future. The http.Response class contains the data received from a successful http call.  “If …

2023/6/15 每日筆記 Read More »

2023/6/16 每日筆記

每日筆記 之後應該不太會在這裡寫詳細的 Flutter 學習內容了,就紀錄一些自己讀過的東西,又或是當隨手筆記來做。 前言 今天有以下幾個主題: Flutter Networking & http & JSON & background process  (Flutter) Application Development Standard Operation Procedure(SOP) Flutter Error handling CTO、CIO? Flutter Networking & http & JSON & background process [1] Flutter – Networking – Fetch data from the internet[2] Flutter – Networking – Make authenticated requests[3] Flutter – Networking – …

2023/6/16 每日筆記 Read More »

2023/6/14 每日筆記

每日筆記 前言 今天有以下幾個主題: 上台報告的準備 Flutter Learning 上台報告的準備 今天花了很多時間在處理簡報,以及練習如何報告。 簡報在製作時是一種資訊的主觀詮釋,要知道如何控制焦點,視覺上應該有反差點,反差點是想暗示的部分。除此之外,當版面有點混亂時,可以先拿掉次要插圖、框下減少雜訊,再針對講解重點增強資訊。 Flutter Learning Debugging Debugging 可以分為 Breakpoints 和 Stack Trace,詳細的內容可以參考以下的影片。 https://www.youtube.com/watch?v=O0UvfT5bUPg State Management 接下來要進入 API Call 的部分,不過在實際進入之前,應該先好好了解一下「State Management」。 和 Android SDK or ios UIkit 不同,在 Flutter 中,我們可以重建部分 UI 而不是修改它。Flutter 有足夠的速度可以每次都做這件事(甚至每一個 frame)。 Flutter is declarative. This means that Flutter builds its user interface to reflect the current state of …

2023/6/14 每日筆記 Read More »

2023/6/12 每日筆記

每日筆記 前言 今天有以下主題: Flutter Practice Flutter Learning Note Flutter Practice 將 Flutter 官方的 Cookbook 中的 Form Part 看完後,決定根據先前的經驗還有 Form part 中的教學來實作一個 Register Form。 在開始 Coding 前,少不了草稿上的預先設計! 一個簡易的表單就出來了! 在這個表單中,包括: Email 輸入欄位: 這個欄位需要驗證輸入資料是否符合 Email 的格式。 Username 輸入欄位: 這個欄位需要確定輸入資料的長度小於 20 個 character。 Password 輸入欄位: 這個欄位需要驗證密碼是否包含 1 個大寫字母,1 個特殊符號,以及密碼長度大於 6 個 character。 每個欄位都需要 Focus 的能力,在輸入資料有誤時,Focus 在該欄位上。 除了功能性外,盡量使用了一個 TextFormField 能夠使用到的外觀設計。 …

2023/6/12 每日筆記 Read More »

Flutter! 從0開始的學習之旅 – Users Inputs & Forms(大綱)

小介紹 歡迎來到 Flutter 從零開始系列的 “Users Inputs & Forms” 主題。本篇文章的內容為 學習 “Users Inputs & Forms” 的 Roadmap。 Users Inputs & Forms 大綱 Users Inputs & Forms 有幾個概念一定要懂:  TextField 和 TextFormField:先了解在 Flutter 中,有哪些 Widget 可以使用。 onChanged method:了解如何監聽文本欄位的更改(監聽後 -> 可以有所反應)。 controller:了解更強大的工具 -> 控制器,來追蹤文本欄位的值和進行相關的操作。《案例我應該想一下》 Form Validation:使用 validator 或 FormField 來驗證表單輸入的有效性。 Form Submission:處理表單提交的資料,例如將資料傳送到伺服器或執行其他後續操作。 Keyboard and Focus Management:管理鍵盤的顯示和隱藏,以及焦點的轉移。 Custom Form Widget:創建自定義的 …

Flutter! 從0開始的學習之旅 – Users Inputs & Forms(大綱) Read More »

Flutter! 從零開始的學習之旅 – How do I make my first Flutter app (筆記)

從基本概念該使學習Flutter! 嘿嘿,是不是有騙到你去點擊圖片呀XD 別緊張,影片我會放在文末。這篇文章主要的目的便是用來記錄在影片中學到的相關知識和技術,方便未來可以回來複習。 Widget Widget是Flutter的核心概念。不誇張的說,Flutter框架內的物件都有用到Widget的概念。 至於Widget是什麼概念?影片中的舉例是寫書。 我們把書看成一個大Widget,書中會有許多的章節,所以我們會說書是由文章所組成,而文章則是結構更小的Widget,文章又由句子Widget組成,句子則由詞、標點符號等更小的Widget組成。 也就是說,Flutter 框架寫出來的App都是透過這樣的方式去設計跟構想的。 在設計一個App的頁面時,我們也可以透過Widget的概念去解析一個頁面。 宣告每個widget時,都會有一個build function,用來建構這個widget。 main.dart package:flutter/material.dart 這個Library可以說是剛開始學Flutter時,唯一需要知道的Library,就像剛開始學C++時只會用到<iostream>。懂了程式基本概念後,則會用到其他更深的演算法Library或資料型別Library。在Flutter框架下,”package:flutter/material.dart”就有著類似的地位。   main function 沒什麼好說的,程式會從這裡開始運行。 runApp()函數會將傳遞進去的widget放在整個結構的root上,也就是最上層的widget。 Hot Reload Hot Reload是Flutter框架的一個特色,可以幫助我們在不重開應用的情況下將修改或新增的程式碼表現在已經開啟的應用中。 影片分享