iT邦幫忙

鐵人檔案

2019 iT 邦幫忙鐵人賽
回列表
自我挑戰組

使用flutter建構Android和iOs APP 系列

我是一個網頁前端工程師,一直很想要寫APP,Survey過Cordova.React Native以及Weex,最後決定用用看Google最新出的Flutter框架,因為可以不用寫太多樣式、編譯的速度快、經國外講師Maximilian Schwarzmüller介紹得知他也有不錯的效能,於是想要好好來鑽研,開發出一個有產品列表、登入、討論區、購物車等等功能的APP。

參賽天數 23 天 | 共 25 篇文章 | 26 人訂閱 訂閱系列文 RSS系列文
DAY 11

頁籤

目前檔案架構 pages/products.dart import './products_admin.dart'; ... return Scaf...

2018-10-11 ‧ 由 Jerry 分享
DAY 12

使用名稱管理route,並移動state到main.dart

使用名稱管理route,並移動state到main.dart,會使程式的重用性更高,並且不會因為切換頁面而將剛剛加好的state洗掉。 一樣的檔案結構 mai...

2018-10-12 ‧ 由 Jerry 分享
DAY 13

提示框與光箱

目標:1.按下刪除按鈕時,會跳出提示框提醒是否要刪除2.按下product_create頁面的save時,會跳出光箱 如此gif pages/product....

2018-10-13 ‧ 由 Jerry 分享
DAY 14

使用者輸入框

import 'package:flutter/material.dart'; class ProductCreatePage extends Statefu...

2018-10-14 ‧ 由 Jerry 分享
DAY 15

將新增功能移到admin頁面

今天的目標是將新增功能移到admin頁面如此連結 檔案結構越來越複雜我畫了整理圖如下, main.dart pages/products.dart...

2018-10-15 ‧ 由 Jerry 分享
DAY 16

做一個toggle按鈕以及為文字加新字體

再度回顧一下檔案結構 目標是在登入頁面加一個toggle按鈕並且在商品列表頁面,將標題字體換成Oswald 如此動畫 main.dart route...

2018-10-16 ‧ 由 Jerry 分享
DAY 17

橫向排版與圓角背景和邊框

目標如圖 橫向排版的標題與價格圓角邊框的地址 Widget _buildProductItem(BuildContext context, int...

2018-10-17 ‧ 由 Jerry 分享
DAY 18

背景圖片,上透明度,增加icon按鈕

目標:登入頁有個圖片背景,並有透明度收合式選單的list旁邊有iconheader的最右邊有icon 如此連結 pubspec.yaml asset...

2018-10-18 ‧ 由 Jerry 分享
DAY 19

整理檔案架構:把組件跟公版拆出來

檔案結構: pages/ auth.dart //登入頁 product_create.dart //管理者的新增商品頁 product...

2018-10-19 ‧ 由 Jerry 分享
DAY 20

橫向手機時的樣式,使用者手勢監聽器

pages/auth.dart希望橫向時,input不要太長如此連結 Widget build(BuildContext context) {...

2018-10-20 ‧ 由 Jerry 分享