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
CSC305 Lecture 06
javiergs
PRO
0
220
Conquering Massive Traffic Spikes in Ruby Applications with Pitchfork
riseshia
0
160
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
490
iOSエンジニア向けの英語学習アプリを作る!
yukawashouhei
0
190
私はどうやって技術力を上げたのか
yusukebe
43
18k
Cloudflare AgentsとAI SDKでAIエージェントを作ってみた
briete
0
140
育てるアーキテクチャ:戦い抜くPythonマイクロサービスの設計と進化戦略
fujidomoe
1
170
NetworkXとGNNで学ぶグラフデータ分析入門〜複雑な関係性を解き明かすPythonの力〜
mhrtech
3
1.3k
XP, Testing and ninja testing ZOZ5
m_seki
3
610
iOSエンジニア向けの英語学習アプリを作る!
yukawashouhei
0
190
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
0
140
overlayPreferenceValue で実現する ピュア SwiftUI な AdMob ネイティブ広告
uhucream
0
180
Featured
See All Featured
Music & Morning Musume
bryan
46
6.8k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
The Pragmatic Product Professional
lauravandoore
36
6.9k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
61k
Documentation Writing (for coders)
carmenintech
75
5k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
970
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]
хࢎפ