Cypress S6E2DH series User manual

www.infineon.com
Please note that Cypress is an Infineon Technologies Company.
The document following this cover page is marked as “Cypress” document as this is the
company that originally developed the product. Please note that Infineon will continue
to oer the product to new and existing customers as part of the Infineon product
portfolio.
Continuity of document content
The fact that Infineon oers the following product as part of the Infineon product
portfolio does not lead to any changes to this document. Future revisions will occur
when appropriate, and any changes will be set out on the document history page.
Continuity of ordering part numbers
Infineon continues to support existing part numbers. Please continue to use the
ordering part numbers listed in the datasheet for ordering.

www.cypress.com Document No. 002-04388 Rev. *B 1
AN204388
Getting Started For FM4S6E2DH (GAT-D)
Associated Part Family: S6E2DH Series
The purpose of this guide is to provide a brief introduction of the graphics resolution of S6E2DH designated by
Cypress.
Contents
1Preface.....................................................................1
1.1 About This Guide.............................................1
2Overview ..................................................................1
3Utilization of GAT-D Tool Step by Step ....................2
3.1 Create a New Project.......................................3
3.2 Import Images..................................................4
3.3 Page Creation..................................................6
3.4 Flow Design Table Creation...........................17
3.5 Source Generation.........................................21
3.6 Add Generated Source to IAR project ...........22
3.7 Download and Run after Build.......................24
4Application of GAT-D..............................................26
4.1 Event Management........................................26
4.2 User’s Source Code.......................................27
4.3 Display Simulation .........................................29
4.4 Sprite Special Effect ......................................30
4.5 Touch Panel Resolution.................................31
4.6 Source Generate Option................................32
5GAT-D API .............................................................34
5.1 Interface Description......................................35
5.2 Join with Source ............................................37
6Program..................................................................38
6.1 Debugging Mode ...........................................38
6.2 Product Mode ................................................39
7Sample Project Instruction......................................39
7.1 Construction ..................................................39
7.2 Function Overview.........................................41
Document History............................................................42
1 Preface
1.1 About This Guide
The purpose of this guide is to provide a brief introduction of the graphics resolution of S6E2DH designated by
Cypress. This guide explains:
1. How to work with Graphics Authoring Tool for S6E2DH (GAT-D).
2. Advanced application of GAT-D.
3. How to integrate the generated source and Graphics Driver to embedded software.
4. Program to internal Flash and external Flash.
5. Construction of sample.
Note: This guide is described with example while using EWARM of IAR Systems AB. For other IDE please refer it
properly.
2 Overview
Follow figure shows the exact relationship of each component.

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 2
Figure 1. Overview
GAT-D Tool and GAT-D API Library could be found in S6E2DH-Graphics resolution-Ver1.0.zip.
GAT-D Tool: S6E2DH-Graphics resolution-Ver1.0\01. GAT-D Tool\01. Installer\GAT-D_xxx.exe
GAT-D API Library: S6E2DH-Graphics resolution-Ver1.0\02. GAT-D API Library\01. IAR\01. bin\GAT-D API.a
Graphics Driver: In the package of S6E2D-2DGraphicsDriver-v1.00.798-IAR.zip
S6E2D-2DGraphicsDriver-v1.00.798-IAR \01_bin\arm_none_iar\release\basic_graphics.a
S6E2D-2DGraphicsDriver-v1.00.798-IAR \01_bin\arm_none_iar\release\util.a
3 Utilization of GAT-D Tool Step by Step
The follow steps explain how to use GAT-D Tool to arrange a video (a series of frame) to display on S6E2DH Series
based LCD device.
1. Create a new project
2. Import images
3. Page creation
4. Flow Design Table creation
5. Source generation
6. Add generated source to IAR project
7. Download and run after build
Also assumed conditions:
1. GAT-D Tool installed
2. IAR Embedded Workbench installed (ver.7.10 or upper)
3. Image material prepared
4. A S6E2DH series based LCD device and ICE (I-Jet recommend) prepared
PC
environment
GAT-D
Tool
Images
.Bmp
.Jpeg
.Png
.Gif
.etc. I
m
a
g
e
s
.
B
m
p
.
J
p
e
g
.
P
n
g
.
G
i
f
.
e
t
c
.
Project creation
Image convert
Display configuration
Display simulation
Source generation
IAR EW
IDE
Generated source
GAT-D API.a
.a
GAT-D API
Library
Graphics
Driver
basic_graphics.a
util.a
Other function source
User
edited
Flash image
(.Mhx)
Embedded
device
External flash
Program
S6E2DH internal
flash
Build/Program

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 3
3.1 Create a New Project
Step1: Open GAT-D Tool, the tool will open as follow.
Figure 2. Opened GAT-D Tool Window
Step2: Click “Project” menu and click “new” as follows
Figure 3. New Project Menu
Step3: Input the name and select LCD Size.

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 4
Figure 4. New Project Step 1 of 2
Step4: Click “Next” and then click “Finish” a new project will create as follow.
Figure 5. New Project
3.2 Import Images
Step1: Click “Image Library”

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 5
Figure 6. Image Library Tab
Step2: Right click “Stencil” in “Image Library”, and Click “Add New Image” in the menu.
Figure 7. Add New Image Menu
Step3: Go to the path and select images, image will list as follow.
Note: Image’s file type support bmp, png, jpeg, gif, psd.
Figure 8. Added Image List

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 6
3.3 Page Creation
3.3.1 Create a new Page
Step1: Right click “Page” folder, and click “New Page” in the menu.
Figure 9. New Page Menu
Then a new page is created as follow.
Figure 10. Created New Page

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 7
3.3.2 Page Configuration
Step1: Right Click “Page1” and click “Properties…” in menu
Figure 11. Page Property Menu
Step2: Check “Enable”, the background color of page could be changed.
Select RGB Color, if there is nothing on the page, LCD will display background color.
Figure 12. Page Property Window

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 8
3.3.3 Add Window to Page
Step1: Select window from drawn tool bar, left click to work area, window is added as follow.
If want to add several window to a layer, you have to set the layer option to multi-window layer, otherwise could only
add one window to a layer
Figure 13. Add Window
Step2: Double click window in work area, window configuration window will displays. Configure them.
Figure 14. Window Property

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 9
If want add several image to one window, you have to check “Blend Operator”
Figure 3-14 shows difference of image in windows that are set to “Blend Operator” or not
Figure 15. Blend Operator
The setting of “Alpha-blending”, will effects blend result of image on the window with background.
Figure 16. Window Alpha Blend Illustrations
Illustrations A:
External
Flash
Image in
window set to
“Blend
Operator”
Image in window
not set to “Blend
Operator”
S6E2DH
MCU
GDC Blend
Engine
VRAM
GDC Display
Engine
LC
D

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 10
Illustrations B:
Illustrations C:
Illustrations D:

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 11
Illustrations E:
Illustrations F:
Above illustration are from page1 of sample in S6E2DH-Graphics resolution-Ver1.0\03. Sample\01. GAT-D_Tool\01.
Training\Training.zip.
3.3.4 Add Images to Window
Step1: Select image from “Image Library”, drag it to a selected window and drop, image is added as follow.
Figure 17. Added Image to Window
Step2: Double click image, image configuration window will displays. Configure them

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 12
Figure 18. Image Property Window
For behavior of Alpha Blend configuration, refer to following illustrations.
Figure 19. Alpha Blend Illustrations
Image used:
Illustration A:
RGBA : (255, 255, 255, 0)
Opaque

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 13
Illustration B:
Illustration C:

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 14
Illustration D:
Illustration E:
Illustration F:
Illustration G:

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 15
Illustration H:
Illustration I:
Illustration J:
Illustration K:

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 16
Illustration L:
Illustration M:
Illustration N:
Above illustration are from page4 of sample in S6E2DH-Graphics resolution-Ver1.0\03. Sample\01. GAT-D_Tool\01.
Training\Training.zip.

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 17
Step3: Add needed images and configure them.
Note: After configuration of a page, could preview it from “View” -> “Page Preview Window”.
Figure 20. Edited Page View
3.3.5 Create All Pages
Create more pages if needs.
Figure 21. Edited All Pages View
3.4 Flow Design Table Creation
3.4.1 Add a Flow Design
Step1: Right click “FlowDesignTable” folder, and click “New Flow Design” in the menu.

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 18
Figure 22. Add New Flow Design Menu
Step2: Double click the new Flow Design, window displays as follow, click “Action Table” directly because don’t use
event if display startup only.
Figure 23. Flow Design Window Action Table Tab
Step3: Click “+” to add actions, and select page for action to display.
Note: Action is something like a small video (a series of frame),

Getting Started for FM4 S6E2DH (GAT-D)
www.cypress.com Document No. 002-04388 Rev. *B 19
Figure 24. Add Action View
Step4: Select “Startup Action”, which to decide the action to be displayed after power on.
Step5: Click “Object Timeline Editor”, “Timeline Editor” window will display.
Figure 25. Timeline Editor Window
Step6: Select the frames where want to display the image, double click then select “Frame Insert.”
Note: The head number is frames.
Figure 26. Frame Insert Menu