Fancy and Fast GUIs on Embedded Devices Using the Enlightenment Foundation Libraries to achieve maximum performance on embedded devices. Gustavo Sverzut.

Slides:



Advertisements
Similar presentations
FireMonkey Deep Dive The Next Generation of Business Application Development.
Advertisements

Android architecture overview
Android Platform Overview (1)
Basics. OpenGL. “Hello world” George Georgiev Telerik Corporation
DSA Processing. Links Processing.org My Processing page Ben Fry Ben Fry’s Thesis on Computational Information DesignThesis Casey Reas siteCasey Reas Casey.
Mobile Application Development
Chapter 3 Software Two major types of software
3D Rendering with JOGL Introduction to Java OpenGL Graphic Library By Ricardo Veguilla
Asst.Prof.Dr.Ahmet Ünveren SPRING Computer Engineering Department Asst.Prof.Dr.Ahmet Ünveren SPRING Computer Engineering Department.
An Overview of Qt - asankar1. Agenda About Qt –A brief intro of Qt Qt development tools –Tools used for building Qt application Qt Architecture –The underlying.
MULTIMEDIA TECHNOLOGY SMM 3001 MEDIA - GRAPHICS. In this chapter how the computer creates, stores, and displays graphic images how the computer creates,
11 Games and Content Session 4.1. Session Overview  Show how games are made up of program code and content  Find out about the content management system.
Chapter 4 Dreamweaver: Part II The Web Warrior Guide to Web Design Technologies.
Antigone Engine Kevin Kassing – Period
A Jumpstart to WPF by Kevin Grossnicklaus ArchitectNow.
Overview Embedded Linux Graphics Typical desktop Linux graphics stack SystemRAMDisk X Window System5MB16MB GNOME14MB95MB KDE11MB96MB Mozilla12MB95MB.
A Spring 2005 CS 426 Senior Project By Group 15 John Studebaker, Justin Gerthoffer, David Colborne CSE Dept., University of Nevada, Reno Advisors (CSE.
Introduction to Interactive Media Interactive Media Tools: Software.
Week 2 - Wednesday CS361.
® Copyright 2008 Adobe Systems Incorporated. All rights reserved. ® ® 1 INTRODUCTION TO ADOBE FLASH CS3.
® Copyright 2010 Adobe Systems Incorporated. All rights reserved. ® ® 1 INTRODUCTION TO ADOBE FLASH PROFESSIONAL CS5.
OpenGl Graphics Programming. Introduction OpenGL is a low-level graphics library specification. It makes available to the programmer a small set of geomteric.
Institute of Informatics & Telecommunications – NCSR “Demokritos” TileQt and TileGtk: current status Georgios Petasis Software and Knowledge Engineering.
Object Oriented Software Development 9. Creating Graphical User Interfaces.
ROOT Team Meeting October 1 st 2010 GUI thinking and testing ideas OpenGL GUI Root Team meeting 01/10/2010.
Making Python Pretty!. How to Use This Presentation… Download a copy of this presentation to your ‘Computing’ folder. Follow the code examples, and put.
Created By. Jainik B Patel Prashant A Goswami Gujarat Vidyapith Computer Department Ahmedabad.
Computer Graphics: Programming, Problem Solving, and Visual Communication Steve Cunningham California State University Stanislaus and Grinnell College.
3D Engine II December 17, computer graphics -dpi.
Chapter1 The flash interface and action script 3.0.
LCG AA Meeting 30 June 2004 Ilka Antcheva Graphics User Interface in ROOT.
GPU Computing for GIS James Mower Department of Geography and Planning University at Albany.
By Adam Reimel. Outline Introduction Platform Architecture Future Conclusion.
OpenGL: The Open Graphics Language Technology and Historical Overview By Ricardo Veguilla.
Working in a Mobile App Development Environment Lesson 2.
Qt Development Frameworks Past, Present and Future by Knut Yrvin – Dec 2009.
From VIC (VRVS) to ViEVO (EVO) 3 years of experiences with developing of video application VIC for VRVS allowed us to develop a new video application.
CS 501: Software Engineering Fall 1999 Lecture 23 Design for Usability I.
Building GUI applications with Python, GTK and Glade
TIZEN Native UI Builder Fajri Koto
Android Mobile Application Development
7 Ways To Use iPad For Workplace Learning.
Khang Lam Daniel Limas Kevin Castillo Juan Battini
Lecture 1-Part 2: Operating-System Structures
The world’s most advanced mobile platform
Introduction to Computer CC111
Computer Graphics Lecture 32
Java Look-and-Feel Design Guidelines
Java FX.
Event Driven Programming Dick Steflik
Introduction to .NET Framework Ch2 – Deitel’s Book
CHAPTER 8 Multimedia Authoring Tools
Application Development Theory
Building beautiful and interactive apps with HTML5 & CSS3
CMPE419 Mobile Application Development
TerraForm3D Plasma Works 3D Engine & USGS Terrain Modeler
User Interface Design and Development
Chapter 2: Operating-System Structures
Introduction to MATLAB
WPF AKEEL AHMED.
.NET and .NET Core 7. XAML Pan Wuming 2017.
Software Defined Networking (SDN)
Applications Software
Tutorial 6 Creating Dynamic Pages
What's New in eCognition 9
So you were told to make a video
The Basic Usage and The Event Handling in Glade.
Graphics and FLTK CSCE 121 J. Michael Moore
CMPE419 Mobile Application Development
What's New in eCognition 9
Presentation transcript:

Fancy and Fast GUIs on Embedded Devices Using the Enlightenment Foundation Libraries to achieve maximum performance on embedded devices. Gustavo Sverzut Barbieri CELF Embedded Linux Conference - November 3rd, 2007 INdT/Recif e

Now costumers are used to fancy devices and expect newer to be even fancier...

Users Expectations ● Quick feedback: responsive; ● Natural animations: – Matches real life; – Clarifies the work flow; – Clue whenever device is working or frozen; – Quick distraction while system is processing; ● Beauty.

Technologies

X11 Window System ● Input/Output communication with Hardware; ● Networked protocol to communicate with Apps; ● Used in every UNIX system since 1987; ● Very basic primitives; ● Very difficult to get right; ● Often used through high-level abstraction libs: – GTK, Qt, SDL, Evas, Tk, Xaw, Motif,...

OpenGL - Open Graphics Library ● Industry standard for Hardware and Software; ● Focus on 3D (2D is handled as consequence); ● Fast triangle/rectangle/polygon drawing; ● Fast matrix transformations (scale, rotate, shear, perspective); ● Fast alpha blend; ● High-end cards support programs-per-pixel (pixel shaders): advanced render, light and effects;

GTK - The GIMP Toolkit ● Created in order to help development of The GIMP (Photoshop-like tool) with X11; ● Focus on visual widgets (buttons, text box,...); ● Some efforts to run on non-X11 platforms; ● Basic free-drawing operations; ● Adopted by GNOME project due its LGPL license; ● No OpenGL support;

SDL - Simple Direct Layer ● Created to aid port of Windows games to Linux; ● Multi-platform by design; ● Framebuffer and events abstraction layer; ● Almost no drawing primitives; ● Easy to draw images everywhere (nothing more); ● Low entry barrier; ● Developer must care about everything; ● OpenGL "support";

Evas ● Created to aid development of graphical appealing Window Manager and File Manager; ● Focus on animation and alpha blending; ● Efforts to run on non-X11 platforms; ● Easy to draw objects everywhere; ● Powerful and extensible drawing system; ● State-full canvas; ● GUI stack built upon Evas and Edje (ETK, EWL); ● OpenGL support;

Scene Renderer/Manager - Concept ● Every screen can be thought as a scene; ● Someone (or something) must manage scene contents (objects); ● Keep object state (color, opacity, position, size and layer) ; ● Old states must be cleared; ● New states must be draw; ● Avoid painting unnecessary areas; ● On events, translate (x,y) coordinate to object.

Scene Renderer/Manager - Role

Scene Renderer in SDL or GtkDrawingArea ● Moving 2 balls over a background image: – Calculate ball_1 and ball_2 positions (x,y); – Repaint old (dirty) regions with background; – Paint ball_1 and ball_2; – Update screen on repainted (cleared) and new areas. ● Problems: – Same background area may be repainted more than once; – If images are opaque and overlap, you should not paint the lower image; – Screen may have the same area updated more than once; – Make number of items variable and you must write your own scene manager; – This does not cover properties like opacity, size or clipping.

Scene Renderer with Evas ● Moving 2 balls over a background image: – Calculate ball_1 and ball_2 positions (x,y); ● Solutions: – Evas remember what is dirty and need to be repainted; – No opaque area is draw more than once; – No screen area is updated more than once; – Opacity, size, clipping and other properties are also handled!

Theme Ability Enables application look and feel to be changed without being rewritten. Basic: change colors, font and images Advanced: change colors, font, change layout, animations

Theme Ability

Why not SDL? ● Too much burden on developers with mundane tasks; ● Error prone; ● Not scalable (both graphical and development); ● Barebones; ● Building upon will lead to Evas (which run on SDL by the way); ● Too much work and difficult to get right.

Why not GTK? ● Too much focus on Forms; ● Rigid layouts; ● Lack of transparency support; ● Too tied to X11; ● No OpenGL acceleration; ● No animation support; ● Poor theme capabilities; ● Difficult to get beautiful.

Why Evas? ● Edje theme system; ● ETK widget toolkit (themed by Edje); ● Optimized core engine; ● Excellent X11 and OpenGL support; ● Small footprint (about 600Kb the whole stack); ● Few external dependencies; ● BSD license enables to build closed source products (if required!); ● Designers will depend less on developers; ● Rich view applications made easy;

Artists do not depend on developers ● Without Evas: – Artist design a new layout and animation; – Developer write code to load images, remember position, remember current, draw them, compile, debug, test, run; – Artist validates result. ● With Evas/Edje: – Artist design a new layout and animation using Edje, already visualize with edje_viewer or edje_editor, validating result as it's created. Like web development, which most artists are used to!

EFL Stack ● Evas: drawing canvas; ● Ecore: events & main loop; ● Ecore_Evas: glue of Evas with various I/O; ● Edje: High-level management of Evas objects (Theme/Script support); ● ETK, EWL: toolkits built on top of Evas, Ecore and Edje.

Technology Showroom ● Rage 0.2 on desktop; ● Enlightenment E17 on desktop; ● Expedite on desktop; ● Expedite (x11 and x11-16) on N800; ● Canola folder view on desktop; ● Canola folder view on N800; ● etk_test on destkop; ● ewl_embed_test on desktop.

Rage 0.2 ● Multimedia application for set-top boxes; ● Visual appealing with shiny overlays on video; ● Less than 7K lines of C, 1K lines of style desc.; ● Mostly written by one person in one weekend.

Enlightenment E17 ● Main project using Evas, Edje and others; ● Provides requisites and test case; ● Huge WOW! Effect; ● Resource efficient.

Edje Editor ● What-You-See-is-What-you-Get Edje editor; ● Target at artists/designers; ● Still in early stages.

Expedite ● Benchmark toolbox; ● Used to compare various engines.

Contact ● INdT: ● Personal: ● Mail: ● MSN, Jabber: ● IRC: freenode, gimp.net, oftc...