CAPH : Tizen TV Web UI Framework

[Pages:23]CAPH : Tizen TV Web UI Framework

Yang Yang

Samsung Electronics

Agenda

Overview

Key Navigation Scrollable Grid & List Demo

2

What is CAPH ? CAPH: a Web UI Framework

Easy and quick development of web apps for Samsung Tizen TV Custom made for TV High performance Rich UI components

3

System Metaphor

CAPH Web UI Framework

CAPH Modules

Key Navigation

jQuery AngularJS

Scrollable Grid & List

UI Components

(Button, Dialog, Checkbox, Input, Dropdown Menu, ...)

Velocity.js

(Fast Animation)

Lodash

(Utility)

Tizen TV SDK

CAPH Package Sample & Tutorial API Documents

TC & Test suite Web App Scaffolding

4

With Open Source Frameworks

Based on popular frameworks (Presently jQuery and Angular JS) Support more frameworks in the future

App Code caph-angular.js

Angular JS

App Code caph-jquery.js jQuery

5

CAPH Modules

All modules support AngularJS and jQuery All modules work with Key Navigation All UI Components are customizable

Button

Radio Button

Toggle Button

Key Navigation

Scrollable Grid & List

UI Components

Dialog Check Box

Context Menu

Drop Down Menu

Input

...

6

 Overview

Key Navigation

Scrollable Grid & List Demo

7

Key Navigation

Handle the focus of UI elements easily by arrow keys of remote controller An attribute `focusable' which represents the focusable element Support Mouse, Keyboard as well

1

4

7

8

2

3

5

6

9

10 11

Find the nearest focusable element automatically

8

 ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download