23
Elm Theme Viewer Daniel Juyung Seo OCT. 26, 2014. <2 nd EFL Korea Seminar>

[KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Embed Size (px)

Citation preview

Page 1: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Elm Theme Viewer

Daniel Juyung Seo OCT. 26, 2014.

<2nd EFL Korea Seminar>

Page 2: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

발표자 소개

서주영

삼성전자 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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

What is Elm Theme Viewer?

Page 4: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Terminology

Page 6: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

How to write your GUI application?

Page 7: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

How to write your GUI application?

Pixel

Text, Line, Rectangle, Image, …

Page 8: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

How to write your GUI application?

Text, Line, Rectangle, Image, …

Pixel

Use widgets!

Page 9: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Style

Different look and feel of a widget

Check

default

toggle

Page 11: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Theme

A set of styles of widgets

actionslider: default, bar, …

buttn: default, anchor, …

check: default, toggle, …

frame: default, pad_large, …

Page 12: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Elm Theme Viewer

Page 13: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Useful To

Elementary application programmers

Elementary theme creators

Elementary widget developers

Etc.

Page 14: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Developer

Daniel Juyung Seo: 529 commits

Jiyoung Choi: 18 commits

Hosang Kim: 1 commit

Page 16: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Demo

Page 21: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

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: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Web Site

https://git.enlightenment.org/tools/elm-theme-viewer.git

Source Code

git://git.enlightenment.org/tools/elm-theme-viewer.git

Page 23: [KOR][E-Kor-Seminar 2014][4/8] Elm Theme Viewer (SeoZ)

Thank you