Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
한번 쓰고 우려먹는 플러터
Search
Ben
July 27, 2019
Programming
0
150
한번 쓰고 우려먹는 플러터
Ben
July 27, 2019
Tweet
Share
More Decks by Ben
See All by Ben
2019년의 플러터: 모바일을 넘어
justive
1
40
Other Decks in Programming
See All in Programming
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
980
組込みだけじゃない!TinyGo で始める無料クラウド開発入門
otakakot
1
310
Go Conference 2025: Goで体感するMultipath TCP ― Go 1.24 時代の MPTCP Listener を理解する
takehaya
9
1.7k
Introduce Hono CLI
yusukebe
6
2.8k
テーブル定義書の構造化抽出して、生成AIでDWH分析を試してみた / devio2025tokyo
kasacchiful
0
170
monorepo の Go テストをはやくした〜い!~最小の依存解決への道のり~ / faster-testing-of-monorepos
convto
2
500
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
uma31
0
200
ALL CODE BASE ARE BELONG TO STUDY
uzulla
25
6.3k
bootcamp2025_バックエンド研修_WebAPIサーバ作成.pdf
geniee_inc
0
120
Six and a half ridiculous things to do with Quarkus
hollycummins
0
180
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
220
あなたとKaigi on Rails / Kaigi on Rails + You
shimoju
0
170
Featured
See All Featured
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Music & Morning Musume
bryan
46
6.8k
Raft: Consensus for Rubyists
vanstee
140
7.1k
KATA
mclloyd
PRO
32
15k
The Pragmatic Product Professional
lauravandoore
36
6.9k
Large-scale JavaScript Application Architecture
addyosmani
514
110k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
Typedesign – Prime Four
hannesfritz
42
2.8k
Designing Experiences People Love
moore
142
24k
Embracing the Ebb and Flow
colly
88
4.9k
Transcript
ೠߣॳҊ ۰ݡח ۞ఠ ٘݃ੋ٘() ӣ࢚
ӣ࢚ ࣽୌೱҮ ੌ߈ਗ ஹೊఠ Ӓېझ ҕ ٘݃ੋ٘() SW োҳࣗ োҳਗ
JUSTIVE Google I/O Extended Pangyo Flutter in 2019: Beyond Mobile
[email protected]
Google I/O Extended Suwon 2019֙ ۞ఠ: ݽ߄ੌਸ ֈয Unity / Electron / Flutter Vue.js /Physics Simulation / Android etc..
۞ఠۆ Dart ҳӖ Fuchsia ۽झ ۖಬ Hot reload Hot restart
۞ఠۆ? Flutter is Google’s portable UI toolkit for building beautiful,
natively-compiled applications for mobile, web, and desktop from a single codebase.
Native Performance Theming Widgets Rendering Animation Painting Gestures Foundation Framework(Dart)
Engine(C++) Skia Dart VM Text Android/iOS runner Hardware
Stateful hot reload
Material Design Material Theming Cupertino Design
ࢶ UI b.setColor(red) b.clearChildren() ViewC c3 = new ViewC(...) b.add(c3)
return ViewB( color: red, child: ViewC(...), ) Imperative style Declarative style
None
নೠ ѐߊ ജ҃ Windows MacOS Linux ChromeOS Android Studio Visual
Studio Code IntelliJ
Dart?
Dart ݽ؍ - ݣ౭ ಁ۞ য JavaScript / Java /
C# যܳ ೧ࠁ࣑ݶ য࢝ೞ ঋਸ য Flutterח UIࠗఠ ۽ө Dart۽ ҳࢿ
Dart Hello world main( ) { var words = ['Hello',
'world']; print('${words.join(", ")}!'); }
Dart ёೱ ېझ ё ࢚ࣘ ङച ੋఠಕझ ೣࣻഋ ۽Ӓې߁
ۈ Ҋରೣࣻ ۽ઉ ఋੑ ఋੑ Ѩࢎ ઁ֎ܼ झ݀ য ಞউೣ ఋੑ য উх
۽झ ۖಬ
None
Android iOS Web Raspberry pi(Android Things) Windows MacOS Linux …
Android iOS Web Raspberry pi(Android Things) Windows MacOS Linux …
Android iOS Web Raspberry pi(Android Things) Windows MacOS Linux …
Flutter for web
Themeing Widgets Rendering Animation Painting Gestures Foundation Framework(Dart) Browser(C++, JS)
Canvas DOM Skia ূਸ ܖ ঋҊ DOM / HTML5 Canvasܳ ਊೞৈ ۪؊݂ (HTML/CSS -> Canvas (fallback) Dart2js compiler Your code JS Engine
Flutter for web https://flutter-web-demo.firebaseapp.com/#/ >Flutter : new web project >pub
global activate stagehand >pub global activate webdev
mobile web https://github.com/flutter/flutter https://github.com/flutter/flutter_web
dependencies: flutter: sdk: flutter … dependencies: flutter_web: flutter_web_ui: … pubspec.yaml
mobileRepo/lib -> webRepo/lib
import 'package:flutter/material.dart'; import ‘package:flutter_web/material.dart’;
for Material Icons /web/assets/FontManifest.json [ { “family:”MaterialIcons”, “fonts”:[ { “asset”:”https://fonts.gstatic.com/s/materialicons/v42/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2"
} ] } ]
main() async{ await ui.webOnlyInitializePlatform( assetManager: engine.AssetManager( assetDir: “asset_dir” ) );
app.main(); }
Animation Network Gesture Route
None
Adaptive Components э ਗٜ۽ ܲ ࠙ܳ ٜ݅ӝ +
Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet image title subtitle Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet
Adaptive Components झѱ౭ܳ ೖೞࣁਃ styles : color / padding /
alignment … -> э ਤઇ layouts : column / stack … -> ܲ ਤઇ
Adaptive Components MediaQuery.of(context). aspectRatio width height
None
Interactions ::hover
Interactions Listener onPointerEnter onPointerExit onPointerDown onPointerUp onPointerMove
Interactions RawKeyboardListener RawKeyboardListener( focusNode: _focusNode, onKey: (RawKeyEvent event){ … }
)
None
Q & A
[email protected]
хࢎפ