-Emulator -OS Support -Other Features -Guides

Transcription

1

2 Subject Smart TV Apps SDK Tools App Programming What is Smart TV App? -IDE -Emulator -OS Support -Other Features -Guides Focus -App Types -API Framework API -Web Device API -AllShare API -Convergence API -Smart Interaction (Voice/Gesture) API -Installing on a TV

3 What is Smart TV App?

4 SmartTV Applications are web-based software programs that run on digital TVs connected to the Internet Digital TV Big screen Video + Audio Channel + Volume Remote Control Device Discovery More Internet Web Browsing Web Services Streaming Video Social Networking HTML More Smart TV Apps

5 Smart TV Apps are composed of HTML, CSS, JavaScript, and additional resources. HTML Page Shows the application s structure. Samsung Smart TV SDK supports HTML5. CSS Files Defines the application s style. Javascript Source Controls the application s behavior Config.xml Environment and application information. Example Application in SmartTV SDK IDE (Optional) Flash Files

6 Full Screen Application The application fills the entire TV screen. Single-wide application The application is displayed only on a part of the screen. Ticker The application remains on the screen while you do other things with your TV. Ticker apps run at a higher priority. Please contact Samsung if you would like to develop a ticker app. Set in config.xml file

7 Application Manager Functions Install, Run, Delete Applications Manage User Accounts SSO to encrypt and save user account information. Run and Manage Applications Application Manager provides the common modules that enable applications to run normally on the screen, recognize and identify remote control button events, use plugins, and communicate with the Application Manager. Webkit Browser Application Manager provides the modules for processing all the details of device-side Samsung Application Push (SAP). Application Manager Views Samsung Apps Settings Sort By Edit Mode

8 SDK Tools

9

10 The IDE and Emulator are the two primary tools for app development. App Editor IDE Rich Text Editor - HTML, CSS, JavaScript, JSO N, XML Visual Editor Application Packaging Eclipse-based Emulator Rapidly test apps Debug apps WebKit-based Supports 2011, 2012, and 2013 Models

11 Projects Smart TV SDK Menu Text Editor

12 Visual Editor GUI Components Properties of Selected Component

13 Application Remote Control UI Menu JavaScript Console

14 Developers can test video-based applications in the Emulator.

15 Launch the debugger in the IDE. The Emulator launches the debugger. The debugger is WebInspector. (It will be familiar to web programmers who use Google Chrome and Apple Safari)

16 OS Tools Release Windows Mac OS X Linux IDE Emulator (Windows) Cloud Emulator : Server IDE Emulator (Linux/VBox) Cloud Emulator : Client IDE Emulator (Linux/VBox) All Releases New in 4.0 New in 4.0 Mac & Linux support is newly added with 4.0 (Jan 13) release. Some of the advanced features from Windows are missing and are still being improved.

17 The Mac/Linux Emulators are supported by using VirtualBox. The VirtualBox tool easily allows software to run on various platforms by using a Virtual Machine guest OS.

18 Not all functions of the TV are supported in the Emulator. Additionally, app performance may be different (better or worse). Some Differences Between The Emulator and a Real TV Less memory available on the TV. Remote Control response time. Real TV has picture blending Video, audio, and network behavior may vary Browser behavior may differ if TV and Emulator use different versions. Screen Size

19 Developers can develop and test their apps on a PC using the IDE and Emulator. The next step is to test on a real TV. Finally, the app can be submitted for approval. IDE Emulator TV Samsung D Forum Editor Edit App TV Test App on TV Submit App for Approval Emulator Test App on Emulator

20 The Smart TV Development Info Source

21 Articles, Tutorials, API Listings

22 Help Forums in English, Russian, Korean, and Chinese

23 App Programming

24 The API is accessed though JavaScript interfaces CSS3 is supported. Common HTML5 tags are supported, including: <video> <audio> <canvas> Flash 11.1 supported

25 -Visual Editor -Generated Code -Uses Scenes -Write code by hand -More freedom - Add a.swf file to your app * SWF files cannot be edited in the SDK. You must create them in a Flash editor. AIR is not supported.

26 Basic Projects use scenes. A scene is a page in an application. Scene 1 Scene 2 Scene 3 Scene 4 HTML HTML HTML HTML CSS CSS CSS CSS JS JS JS JS Use Case: A newspaper app with different sections (news, weather, sports, etc )

27 Scenes {HTML/CSS/JS} Editing a scene in the visual editor.

28 JavaScript projects allows the developer to have more freedom (and less guidance) to implement their app. The Visual Editor is not enabled in a JavaScript Project. JavaScript App JavaScript Files HTML Files CSS Files Resources Use Case: A video app with a complex GUI

29 JavaScript Project Text Editor

30 The Flash Project allows the developer to import a.swf file into their application. Flash App JavaScript Files HTML Files CSS Files Resources Flash File Use Case: A Flash game.

31 Import.SWF file into the project. Link to the.swf file in your HTML code. (Use external editor to create/edit SWF files)

32 Framework API - Basic Functionality - Scene Manager - App init and terminate - Loading of config data - Loading files dynamically - Event Handlers - Variables Application Framework UI Component API - UI Components (based on Jquery) - IME (input method editor) for text entry Service API - DTV-specific functionality - Video Player - Image Player - SmartRemote - USB

33 Apps Framework API Framework API SmartTV API Core API Scene Manager API Util API AllShare API AppsFramework API Common Modules API UI Component API Convergence Framework API Service API Core UI Button UI Label UI KeyHelp UI UI Components API In-Application Purchase API Image UI Loading UI Checkbox UI Scroll UI Interactive Remote API Advertisement Service File API Service API Web Device API List UI Popup UI Datepicker UI Maps UI ToggleButton UI Common Web Device API Hscroll UI TextInput UI DTV Web Device API ProgressBar UI Tooltip UI PageIndicator UI Slider UI Core Service API AVSetting Service API ImageViewer API VideoPlayer Service API SmartRemote Service API USB Service API

34 -AllShare Framework (ASF) Cloud Extension -Convergence S/W Platform for Multi-Device/Multi-OS -21 APIs available -USE CASE: Watching a video from your PC on your TV.

35

36 [JS Example: Find Content Providers] var devfinder = serviceapis.mediasharing.mediaproviderfinder; var providerlist = devfinder.getmediaproviders();

37 -Direct communication between mobile and TV app using REST API (Max Connections: 4) -File Upload (up to 3MB file size) -Broadcast/Multicast with HTTPS USE CASE: A multiplayer SmartTV app using a Smartphone for input TV TV Applications OCI API N-Service Framework Web Server TV à Client Long polling GET request Client à TV POST request TV à Client Long polling GET request Client à TV POST request Multiple User Game Client Application... Architecture Client Application

38 What is the difference? Feature AllShare Convergence Content Flow Device à TV Mobile à TV Content Video, Music, Images Text, Images Standards DLNA Application defined # Clients No limitation 4 Miscellaneous Only Samsung Devices officially supported WiFi for all devices

39 Provides a new way to interact with TV by voice, motion, and face recognition. Intuitive and Convenient way to use TV by Voice Control without a remote control Smart Interaction to easily adjust channel/volume or navigate web browser with Motion Control Easy and Fast Access to your favorite services by Voice Control & Face recognition TV Power On/Off Channel Up/Down, Volume Up/Down Access to Smart Hub by Voice Control Channel Up/Down, Volume Up/Down Navigating Web Browser Log-in by Face recognition

40 The SDK provides the ability for users to test gesture-based applications. Gesture Simulator *Windows Emulator Only

41 The mouse is used to simulate gesture movement. Click and drag with mouse to similar hand gesture *Windows Emulator Only

42 1) Check for Voice Recognition Support 2) Subscribe To Voice Events 3) Handle Events 4) Application Logic

43 Module for connecting MIDI devices USE CASE: A MIDI keyboard connected to the TV through a USB *Windows Emulator Only

44 1) Register callbacks 3) App Logic Example: Get Device Info 2) Handle Connections

45 Developers can easily add multi-language support to their applications. Language Files JavaScript Code

46 Easily integrate gamepads into your application. GamePad API is part of the Web Device API. Gamepad API Test App Available on Web

47 Testing on a TV

48 Development PC Web Server MyApp.zip Download Test TV

49 Development PC SmartTV 1) Package the app SDK Web Server MyApp Package 2) Setup TV network settings 3) Create develop user 4) Set IP of development PC 5) Sync with development machine MyApp_1_0_0_America_ zip Sync MyApp_1_0_0_America_ zip

50

51

52 Check that the widgetlist.xml file is accessible Check the.zip file is in the Apache directory

53 Configure TV network so that the TV has access to your web server.

54 Create develop account

55 Go to the Smart Hub Login

56 Enter the IP of your development Apache server Reboot TV and login as develop

57 App is now installed & ready to test. (Notice the USER label.)

58 Once the test environment is setup, applications can be modified on the PC and quickly updated on the TV by packaging & choosing the App Synchronization option.

59 Edit app s config.xml by adding the setting: <type>user</type> Copy the app folder on to a USB and insert into the TV. The app will automatically be loaded in the apps list.

60 Summary

61 HTML / CSS / JavaScript / Flash IDE, Emulator, Documentation (Win/Mac/Linux) HTML5 & JavaScript-based. Video, Voice/Gesture, AllShare, Convergence, MIDI TV downloads app from the development PC.

62 마스터제목스타일편집