제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)
-
Upload
daniel-juyung-seo -
Category
Software
-
view
497 -
download
7
Transcript of 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)
![Page 1: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/1.jpg)
Elm Theme Viewer
Daniel Juyung Seo OCT. 26, 2014.
<2nd EFL Korea Seminar>
![Page 2: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/2.jpg)
발표자 소개
서주영
삼성전자 SW센터 소속
책임 연구원
닉네임
천재태지, SeoZ
@seojuyung
하는 일/한 일
Tizen 코어 UIFW EFL 개발자 (2010/01 ~) Enlightenment/EFL 오픈소스 커미터 (2011/02 ~) TDC 2014, OSCON 2014 EFL의 Scalability 기술 발표 SOSCON 2014 타이젠 EFL 앱 개발 발표 임베디드월드 Tizen 연재 (총 10회 중 8회), 마이크로소프트웨어 EFL 연재 (총 5회 중 2회)
![Page 3: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/3.jpg)
What is Elm Theme Viewer?
![Page 4: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/4.jpg)
What is Elm Theme Viewer?
An EFL(Enlightenment Foundation Libraries) elementary widget preview program.
Lists all widgets and styles from the theme.
Actually creates widgets with a proper code.
![Page 5: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/5.jpg)
Terminology
![Page 6: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/6.jpg)
How to write your GUI application?
![Page 7: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/7.jpg)
How to write your GUI application?
Pixel
Text, Line, Rectangle, Image, …
![Page 8: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/8.jpg)
How to write your GUI application?
Text, Line, Rectangle, Image, …
Pixel
Use widgets!
![Page 9: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/9.jpg)
Widget
A commonly used GUI component
a.k.a component, control, module, …
Button, Calendar, Check, Clock, File Selector, Frame, Grid, Icon, Image, Index, Label, List, Menu, Popup, Progressbar, Scroller, Slider, Spinner, Text Entry, Toolbar, Window, …
![Page 10: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/10.jpg)
Style
Different look and feel of a widget
Check
default
toggle
![Page 11: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/11.jpg)
Theme
A set of styles of widgets
actionslider: default, bar, …
buttn: default, anchor, …
check: default, toggle, …
frame: default, pad_large, …
![Page 12: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/12.jpg)
Elm Theme Viewer
![Page 13: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/13.jpg)
Useful To
Elementary application programmers
Elementary theme creators
Elementary widget developers
Etc.
![Page 14: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/14.jpg)
History
Started on September 18, 2012
Git Hub
-> git.e.org devs/seoz/elm-theme-viewer
-> git.e.org tools/elm-theme-viewer
![Page 15: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/15.jpg)
Developer
Daniel Juyung Seo: 529 commits
Jiyoung Choi: 18 commits
Hosang Kim: 1 commit
![Page 16: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/16.jpg)
Features
Widget preview
Finger Size change
Scale change
Force resize object
Widget disable
Focus highlight enabled on/off
Focus highlight animation on/off
Each widget's description
Each widget's specific option change
Widget search
![Page 17: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/17.jpg)
Usage
Usage 1 $ elm_theme_viewer
It loads default theme (default.edj from /usr/local/share/elementary/themes) by default. But you can see the preview of other themes with the following instruction.
Usage 2 $ elm_theme_viewer -t ./darkness.edj
Set the theme file
Usage 3 $ elm_theme_viewer -h
See the help
![Page 18: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/18.jpg)
Usage
Usage 4
$ elm_theme_viewer -m
Set the mobile mode
Usage 5
$ elm_theme_viewer -T
Set the Tizen platform style. This enables mobile mode (-m) automatically.
Usage 6
$ elm_theme_viewer -s 1280x720
Set the window size
![Page 19: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/19.jpg)
Usage
Usage 7
$ elm_theme_viewer -F
Set the full screen mode. This overrides window size setting.
Usage 8
$ elm_theme_viewer -w check
Set the widget name to start with.
![Page 20: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/20.jpg)
Demo
![Page 21: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/21.jpg)
TODO
Code generation
GUI widget resize
Easy navigation
Preview object align
Scroller for preview
Edc layout preview
E theme preview
Finish all the widgets preview
Implement open menu with file selector
![Page 22: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/22.jpg)
Web Site
https://git.enlightenment.org/tools/elm-theme-viewer.git
Source Code
git://git.enlightenment.org/tools/elm-theme-viewer.git
![Page 23: 제 2회 한국 EFL 세미나 - 5. Elm Theme Viewer (서주영)](https://reader033.fdocuments.net/reader033/viewer/2022042702/55d57901bb61eba42f8b45d7/html5/thumbnails/23.jpg)
Thank you