Table of Contents
- What Is Storyboard
- A New Way to Build Embedded User Interfaces
- Storyboard Designer and Storyboard Engine
- A Non-Compiled Solution
- Storyboard Software Updates
- Compatibility with Previous Versions
- Storyboard Architecture
- Application Model Hierarchy
- Event Driven Interaction Model
- Events to External Applications
- Data Binding for Dynamic Behavior
- Context and Variables
- Storyboard Model Internal Variables
- Layer variables
- Group variables
- Control variables
- Table variables
- Animation Definitions
- Typical Development Workflow
- Start a New Project: From Photoshop or from Scratch
- Create and Organize Screen Content
- Bind Events to Invoke Actions
- Simulate and Export Model for Engine
- Storyboard Designer Environment
- Storyboard Designer Workbench
- Anatomy of a Storyboard Designer Project
- Storyboard Designer Editor
- Editing Content
- Editor Toolbar
- Direct Editing
- Storyboard Resource Export Configuration Editor
- Managing Configurations
- Resource Tree
- Resource Export Options
- Application Footprint Preview
- Storyboard Designer Views
- Actions View
- Application Model View
- Animation Timeline View
- Working with Animations
- Images View
- Layers View
- Metrics View
- Navigator View
- Outline View
- Problems View
- Properties View
- Component View
- Variables View
- Variable Creation
- Generating Events on Variable Change
- Notes View
- Storyboard Designer Utilities
- Design Notes
- GoTo Dialog
- Storyboard Search Dialog
- Resize Storyboard Application
- Proportionally Scale Application and Contents
- Scale Application and Reposition Contents
- Custom resizing options
- Resizing GDE from the Command Line
- Resource Clean Up Wizard
- Consolidate Images Wizard
- Trim Images Wizard
- Split Images Wizard
- Merge Control Images
- Creating A Storyboard Project
- New Empty Storyboard Project
- New Project from a Photoshop PSD File
- New Project from a Storyboard Sample
- New Project from Storyboard Embedded Engine File
- Existing Project Import
- Working with Multiple Application Design Files
- Controlling Feature Enablement on Projects
- Adding Content to your Application
- Object Naming and Reserved Namespaces
- Working with Events
- Event Editor
- Opening the Event Editor
- Adding an Event Definition
- Data Element Types
- Changing Element Array Length
- Reordering Event Data Elements
- Editing Min and Max Attributes
- Using the Storyboard IO Connector
- Live Mode
- Saved Mode
- Data Element Editors
- Storyboard IO Event C/C++ Header Export
- Connecting Events to Actions
- Event and Action Matching Rules
- Using Variables to Create a Dynamic UI
- Table Variables
- Triggering Events on Variable Changes
- Creating and Applying Animations
- Animation Action
- Timer Keyframe Animations
- Screen Transition Animations
- Simulating your Application
- Scripting with Lua
- Lua Action Callback Function
- Passing Extra Parameters to Functions
- Lua Execution Environment
- Asynchronous Lua Support
- Lua Debugger
- Lua Executables
- Working with C Callbacks
- What are C Callbacks?
- C Callbacks on Windows
- Example C Callback
- Working with Design States
- What are Design States?
- Creating a Design State
- Editing a Design State
- Master/State Context
- Storyboard Editor
- Properties View
- Variables View
- Manually Editing Design States
- Animation Arguments
- Variable Change Argument
- Removing Changes From Design States
- Hiding/Showing Design States
- All Design States
- Individual States
- Converting a Design State
- Animation Preview with Design States
- Working with Images
- Image Rotation
- Rotate At Center
- Rotate At Custom Point
- Alpha and Transparency in Images
- Creating Scalable 9-Patch Bitmap Images
- Multi-Frame Animated GIF Images
- Working with Text
- Rich Text Styling and Markup
- Translation and Internationalization
- Text Translation View
- Translating a Storyboard Application
- Creating and Editing Translation Content CSV Files
- Script Specific Text Shaping and Layout
- Working with Touch, Gestures and User Input
- Configuring Touchscreen Input
- Windowed Applications
- Gesture Support
- Multi-Touch Gestures
gre.mtmovegre.mtpinchgre.mtrotate
- Enabling Gesture In Your Application
- Creating Lists and Tables
- Working with Scrolling Content
- Scroll Synchronization
- OpenGL and 3D Rendering
- Storyboard 3D Rendering Model
- 3D Rendering Fundamentals
- The Scene Graph and Transformations
- Material Support
- Animation and Variable Support
- Mapping FBX Animation data into meaningful structures
- Support for Animation Takes
- Troubleshooting 3D Problems
- Working with OpenGL Shaders, Transforms and Compressed Textures
- 3D Transforms and Custom Shaders
- Custom Shader Support
- Compressed Textures
- Working with Audio and Video
- Media Backend Services
- GStreamer Application
- GStreamer Pipeline
- FFmpeg Plugin
- Multi-File Application Development
- Simulating and Exporting Multiple Model Files
- Resolving Conflicts and Synchronizing Changes
- Reusable Graphical Components
- Creation Guidelines and Conventions
- Editing Components and Propagating Changes
- Collaboration and Team Development
- Revision Control System Integration
- Comparing and Merging Model Files
- Comparing and Merging Projects
- Exporting Storyboard Projects for Sharing
- Exporting and Running on your Embedded Target
- Export Workflow
- Selecting Files For Export
- Deployment Bundle Packages
- Storyboard Embedded Engine (GAPP)
- Storyboard Compressed Package (SBP)
- Native Android Application (APK)
- Native iOS Application
- Windows Standalone Launcher (EXE)
- Storyboard Embedded Resource Header (C/C++)
- Export Transfer Methods
- Filesystem
- SCP Transfer
- Exporting from the Command Line
- Exporting from the Command Line using Export Configuration
- Setting up Storyboard Engine
- Font Environment Variable
- QNX Screen Environment
- Running Storyboard Engine
- Target Specific Configurations
- Linux x86, armle
- FBDEV
- TSLIB
- MTDEV
- SBIO
- Microsoft WinCE, Compact7 win32, armle
- Requirements:
- Libraries:
- Yocto Jethro Linux kernel (3.14) OpenGL, FBDEV, armle
- Requirements:
- Working with Storyboard Lite Platforms
- What is Storyboard Lite
- Storyboard Lite Installers
- Design Considerations
- Working with Mobile Platforms: Android and iOS
- Exporting to iOS Devices
- Xcode
- iOS Developer Account
-
Code Signing Certificate
- Device IDs
-
Application IDs
-
Provisioning Profile
- Adding Extra Libraries for iOS
- Exporting to Android Devices
- Adding Extra Libraries for Android
- Storyboard Lua Android Integration
- Android Lua Java API
- Storyboard Lua Android Example
- Sending and Receiving Data with Storyboard IO
- Storyboard IO Transport protocols
- Connecting to a Storyboard Application
- Sending Events to a Storyboard Application
- Event Naming Conventions
- Serialized Data and the Event Format String
- Setting Application Data
- Receiving Events from a Storyboard Application
- Debugging Storyboard IO
- Debugging egress (Storyboard Engine sending to backend)
- Debugging ingress (Storyboard Engine receiving from backend)
- Storyboard IO Utilities
- iogen
- iorcv
- Optimizing Your Storyboard Application
- Measuring Performance
- Action Execution Performance Considerations
- Choosing the Right Image Format(s) Bit Depth
- Framerate (Frames Per Second)
- Scaling Images
- Reducing Output Verbosity
- Adjusting Engine Rendering Options
- Managing Resource Memory
- OpenGL Scene Graph Optimization
- Extending Storyboard Functionality
- User Defined Action Templates
- User Defined Render Extension Templates
- Structuring Your Photoshop Import Content
- PSD file Structure for Import into Storyboard
- PSD File Requirements
- Application Model Hierarchy
- Artboards
- Layer Effects and Blending Modes
- Naming Requirements
- Naming Conventions
- name_layer
- name_group
- name_control
- name_up and name_down
- Common Photoshop Elements
- Transparency
- Naming Convention Deviation
- Sub Group Folders
- Re-Importing Photoshop and Updating Content
- Re-Importing Photoshop Content
- Storyboard Lua API
- Storyboard Lua API
- gre.APP_ROOT
- gre.SCRIPT_ROOT
- gre.PLUGIN_ROOT
- gre.LOG_ constants
- gre.LEFT, gre.RIGHT, gre.CENTER, gre.TOP, gre.BOTTOM
- gre.OPAQUE, gre.TRANSPARENT
- gre.set_data
- gre.get_data
- gre.set_value
- gre.get_value
- gre.resolve_data_key
- gre.get_control_attrs
- gre.set_control_attrs
- gre.get_table_attrs
- gre.set_table_attrs
- gre.get_table_cell_attrs
- gre.get_group_attrs
- gre.set_group_attrs
- gre.get_layer_attrs
- gre.set_layer_attrs
- Render Effects:
- gre.set_layer_attrs_global
- gre.screen_attach_layer
- gre.move_control
- gre.move_layer
- gre.set_focus
- gre.get_focus
- gre.send_event
- gre.send_event_target
- gre.send_event_data
- gre.greio_disconnect
- gre.clone_object
- gre.delete_object
- gre.clone_control
- gre.delete_control
- gre.poly_string
- gre.get_string_size
- gre.load_resource
- gre.dump_resource
- gre.walk_pool
- gre.load_image
- gre.timer_set_timeout
- gre.timer_set_interval
- gre.timer_clear_timeout
- gre.timer_clear_interval
- gre.animation_create
- gre.animation_add_step
- gre.animation_destroy
- gre.animation_trigger
- gre.animation_stop
- gre.animation_pause
- gre.animation_resume
- gre.animation_create_tween
- gre.touch
- gre.key_up
- gre.key_down
- gre.key_repeat
- gre.redraw
- gre.quit
- gre.thread_create
- gre.receive_event
- gre.env
- gre.log
- gre.mstime
- gre.rgb
- gre.torgb, gre.to_rgb
- gre.to_alignment
- gre.to_alpha
- gre.rtext_text_extent
- Storyboard Lua Canvas API
- gre.get_canvas
- CANVAS:get_dimensions
- CANVAS:fill
- CANVAS:fill_rect
- CANVAS:fill_poly
- CANVAS:stroke_line
- CANVAS:stroke_rect
- CANVAS:stroke_poly
- CANVAS:clear_rect
- CANVAS:set_pixel
- CANVAS:set_alpha
- CANVAS:set_line_width
- CANVAS:draw_image
- CANVAS:draw_text
- Storyboard Lua DOM Module
- gredom
- gredom.get_application
- gredom.get_object
- gredom.get_control
- gredom.get_table
- gredom.get_group
- gredom.get_layer
- gredom.get_layer_instance
- gredom.get_screen
- DOMOBJECT
- DOMOBJECT:get_name
- DOMOBJECT:get_type
- DOMOBJECT:get_parents
- DOMOBJECT:get_children
- DOMOBJECT:get_variables
- DOMOBJECT:get_value
- DOMOBJECT:get_data
- DOMOBJECT:set_value
- DOMOBJECT:set_data
- DOMOBJECT:key
- CONTROL
- CONTROL:get_x
- CONTROL:get_y
- CONTROL:get_width
- CONTROL:get_height
- CONTROL:get_position
- CONTROL:get_size
- CONTROL:get_bounds
- CONTROL:get_hidden
- CONTROL:set_x
- CONTROL:set_y
- CONTROL:set_width
- CONTROL:set_height
- CONTROL:set_position
- CONTROL:set_size
- CONTROL:set_bounds
- CONTROL:set_hidden
- CONTROL:hide
- CONTROL:show
- CONTROL:clone
- CONTROL:delete
- TABLE
- TABLE:get_rows
- TABLE:get_cols
- TABLE:cell_key
- GROUP
- GROUP:get_x
- GROUP:get_y
- GROUP:get_hidden
- GROUP:set_x
- GROUP:set_y
- GROUP:set_hidden
- GROUP:hide
- GROUP:show
- GROUP:clone
- GROUP:delete
- LAYERINSTANCE
- LAYERINSTANCE:get_layer
- LAYERINSTANCE:get_x
- LAYERINSTANCE:get_y
- LAYERINSTANCE:get_width
- LAYERINSTANCE:get_height
- LAYERINSTANCE:get_position
- LAYERINSTANCE:get_size
- LAYERINSTANCE:get_bounds
- LAYERINSTANCE:get_alpha
- LAYERINSTANCE:get_hidden
- LAYERINSTANCE:set_x
- LAYERINSTANCE:set_y
- LAYERINSTANCE:set_width
- LAYERINSTANCE:set_height
- LAYERINSTANCE:set_position
- LAYERINSTANCE:set_size
- LAYERINSTANCE:set_bounds
- LAYERINSTANCE:set_alpha
- LAYERINSTANCE:set_hidden
- LAYERINSTANCE:hide
- LAYERINSTANCE:show
- Lua DOM Samples
- Storyboard IO API
- Storyboard IO API
- gre_io_add_mdata
- gre_io_close
- gre_io_free_buffer
- gre_io_grow_buffer
- gre_io_open
- gre_io_receive
- gre_io_send
- gre_io_send_mdata
- gre_io_serialize
- gre_io_size_buffer
- gre_io_unserialize
- gre_io_zero_buffer
- gre_io_get_error_codes
- gre_io_get_error_message
- Storyboard Engine and Plugin Options
- Storyboard Engine Plugin Options
- Standard Event Definitions
- Standard Event Definitions
- System Events
gre.initgre.quitgre.redrawgre.rendermgr.error
- Pointer Events
gre.pressgre.motiongre.releasegre.touchgre.mteventgre.mtpressgre.mtmotiongre.mtreleasegre.inboundgre.outboundgre.mtinboundgre.mtoutbound
- Keyboard Events
gre.keydowngre.keyup
- Screen Manager Events
gre.screenshow.pregre.screenshow.postgre.screenhide.pregre.screenhide.post
- Focus Events
gre.gotfocusgre.lostfocus
- Table Events
gre.table.viewportgre.cell.gotfocusgre.cell.lostfocus
- Table Scroll Events
gre.table.drag_startgre.table.drag_stopgre.table.scroll_triggergre.table.scroll_startgre.table.scroll_stopgre.table.scroll_cancelgre.table.scroll_complete
- Layer Scroll Events
gre.drag.startgre.drag.stopgre.scroll.triggergre.scroll.startgre.scroll.stopgre.scroll.cancelgre.scroll.complete
- Mobile Events (Android and iOS)
gre.mobile.on_pausegre.mobile.on_resumegre.mobile.on_background
- Android Events
android.onBack
- Windows Embedded Compact 2013 (WEC2013) Events
win.gesture.pinchwin.gesture.[up|down|left|right|unknown]
- Plugin Specific Event Definitions
- Timer Events
timer.[name] Timer Events
- Animation Events
gre.animate.complete.[name]gre.animate.stop.[name]
- Gesture Events
gre.gesture.upgre.gesture.downgre.gesture.leftgre.gesture.right
- Screen Display Capture (ScreenDump) Events
gre.screendump.completegre.screendump.failed
- Screen Event Capture/Playback Events
gre.capture.startedgre.capture.stoppedgre.playback.startedgre.playback.completegre.playback.stopped
- Media Events
- gre.media.exit
- gre.media.timeupdate
- gre.media.durationupdate
- gre.media.statechange
- gre.media.complete
- gre.media.error
- Logger Events
- gre.%perf_prefix%.start
- gre.%perf_prefix%.stop
- gre.%perf_prefix%.set.options
- Standard Action Definitions
- Built-in Action Definitions
- gra.screen
- gra.screen.fade
- gra.screen.hold
- gra.screen.release
- gra.sendevent
- gra.datachange
- gra.screen.focus.set
- gra.screen.focus.next
- gra.screen.focus.prev
- gra.screen.focus.direction
- gra.table.scroll
- gra.table.resize
- gra.table.navigate
- gra.scroll.stop
- gra.log
- gra.resource.dump_def
- gra.playback
- gra.capture
- Plugin Action Definitions
- gra.lua
- gra.ccallback
- gra.animate
- gra.animate.stop
- gra.audio
- gra.greio
- gra.perf_state
- gra.redirect
- gra.screen.path
- gra.screen.scale
- gra.screen.glswitch
- gra.screen.glrotate
- gra.screen.glflip
- gra.screen.gldoors
- gra.screen.gltip
- gra.screen.glcube
- gra.screen.rotate
- gra.screendump
- gra.system
- gra.timer
- gra.timer.stop
-
Media Actions
- gra.media.new.audio
- gra.media.new.video
- gra.media.volume
- gra.media.seek
- gra.media.stop
- gra.media.resume
- gra.media.pause
- Standard Render Extension Definitions
- Common Render Extension Options
- Canvas
- Circle and Arc
- External Buffer
- Fill
- Image
- Polygon
- Rectangle
- Text
- 3D Model
- Storyboard Engine Public API
- gr_application_create_args
- gr_application_create
- gr_application_free
- gr_application_run
- gr_application_quit
- gr_application_debug
- gr_app_log
- gr_application_set_data
- gr_application_set_data_variable
- gr_application_get_data
- gr_application_get_data_variable
- gr_application_add_event_listener
- gr_application_rem_event_listener
- gr_application_send_event
- gr_context_get_application
- gr_context_max_fqn
- gr_context_get_row
- gr_context_get_column
- gr_context_get_control
- gr_context_get_group
- gr_context_get_layer
- gr_context_get_screen
- gr_context_get_fqn
- gr_context_get_event_name
- gr_context_get_event_data
- Storyboard Tutorials
- Importing Sample Projects from Crank's Public SVN
- Working with Multiple Application Design Files
- Creating a Project
- Resolving Conflicts
- Creating a 3D Model Application
- New Project
- 3D Model Control
- Resize Model
- Storyboard Demo Images
- NXP
- i.MX 6QuadPlus
- Demo Details
- i.MX 6UltraLite
- Demo Details
- i.MX 6ULL
- Demo Details
- i.MX 6DualLite
- Demo Details
- i.MX 6SoloX
- Demo Details
- Toradex i.MX 7Dual SoM
- Demo Details
- Flashing the Image
- U-Boot
- Copying Image to an SD Card - Linux
- Copying Image to an SD Card - Windows
- Running the Image
- Turn On or Off the Console
- STMicroelectronics
- STM32F429
- Demo Details
- STM32F439
- Demo Details
- STM32 F7
- Demo Details
- Required Hardware and Software
- Package Contents
- STM32 ST-LINK Utility
- Running the Demo
- Importing the Demo into Storyboard Designer
- Creating Your Own Demo
- Microchip
- SAMA5D2
- Demo Details
- SAMA5D2 with 7 inch Display
- Demo Details
- Copying Image to an SD Card - Linux
- Creating an Image - Windows
- Running the Image
- Renesas
- RZ/A1
- Demo Details
- Flashing the Image
- Linux
- TI AM355 Starter Kit
- Step 1: Importing A Storyboard Sample
- Step 2: Exporting A Storyboard Application
- Step 3: Selecting The Storyboard Embedded Engine
- Step 4: Configuring The Target Platform
- Step 5: Running The Storyboard Application
- Raspberry Pi
- Release Notes
- Release Notes 6.1
- New Features and Functionality
- Storyboard Designer
- Storyboard Engine
- Lua Scripting
- Behavioural Changes and Deprecations
- Release Notes 6.0
- New Features and Functionality
- General
- Storyboard Designer
- Storyboard Engine
- Behavioural Changes and Deprecations
- Licensing
- Storyboard Licensing