주요 내용으로 건너뛰기

Creating a TouchGFX Board Setup

TouchGFX Board Setups(TBS)는 TouchGFX 애플리케이션이 실행되는 플랫폼을 정의하는 .tpa 파일입니다. This approach is for developers who wish to distribute easy-to-use TBSs separately from the UI code that runs on top of them. 이 문서에서는 기본 제공 도구인 tgfx.exe를 사용하여 기존의 TouchGFX 프로젝트를 재배포가 가능한 TBS로 패키징하는 방법을 설명합니다. This tool can be found in the TouchGFX installation directory which is C:/TouchGFX/4.25.0/designer if it is installed in the default directory. For the duration of this article, examples are based on an application called "MyApplication" and on TouchGFX version 4.25.0.

Once you have a fully functional TouchGFX project the following steps are required to create a TBS.

  1. Clean up the project: Remove generated files
  2. Create description files: Call tgfx.exe to generate the zip and json file
  3. Describe the TBS: Edit the json file
  4. Generate .tpa: Call tgfx.exe to finalize .tpa
  5. Test & Verify: Create a new project with the TBS in TouchGFX Designer and verify that it works

Clean up the project​

When generating code (F4) in TouchGFX Designer, multiple files and folders are created. These files are not needed in the TBS because you will generate code again when creating a UI. Therefore, removing these files and folders will significantly reduce the size of the .tpa file. The following files and folders can be removed from the project:

The following TouchGFX related folders can be removed:

.\TouchGFX/assets
.\TouchGFX/build​
.\TouchGFX/config​
.\TouchGFX/generated​
.\TouchGFX/gui
.\TouchGFX/simulator​
.\TouchGFX/screenshots
.\Middleware/ST/touchgfx​
.\Middleware/ST/touchgfx_components
Note
  • If you have a dual context project (for example CM4/CM7 or Boot/Appli), the TouchGFX folder will be placed in the CM7 or Appli folder. In this case, you should also remove the CM4/TouchGFX/build or Boot/TouchGFX/build folder during the cleanup process.
  • If you wish to keep the GUI inside the .tpa when distributed, you should not remove the .\TouchGFX/gui and .\TouchGFX/assets folders.

The following STM32CubeIDE folders can be removed:

.\STM32CubeIDE/.settings
.\STM32CubeIDE/Debug
.\STM32CubeIDE/Drivers
.\STM32CubeIDE/Middlewares
.\STM32CubeIDE/Release

In the EWARM folder (relating to the IAR IDE), we only need to keep the following files:

.\EWARM/*.eww​
.\EWARM/*.ewd​
.\EWARM/*.ewp​
.\EWARM/*.icf​
.\EWARM/startup_*.s

In the MDK-ARM folder (relating to the Keil IDE), we only need to keep the following files:

.\MDK-ARM/startup_*.s​
.\MDK-ARM/*.sct​
.\MDK-ARM/*.uvoptx​
.\MDK-ARM/*.uvprojx

Create description files​

tgfx.exe 도구는 TBS의 내부를 설명하는 구성 파일(.json)을 생성합니다. This information is read by TouchGFX Designer and presented in the description pane on the right when selecting the TBS.

TouchGFX Environment 콘솔을 열고 애플리케이션의 상위 디렉토리에서 다음 명령을 실행합니다.

$ /c/TouchGFX/4.25.0/designer/tgfx.exe pack -d MyApplication

.tpa를 위한 파일 준비

명령이 실행된 디렉토리에 다음과 같은 파일이 생성됩니다.

생성된 파일의 목록

Describe the TBS​

Before creating the final .tpa, edit MyApplication.json to control how the TBS is displayed to users in TouchGFX Designer. The following sections should be updated:

  • Author Author 섹션의 필드를 사용하여 저자 이름, 연락처 이메일 및 URL을 지정합니다. You can delete some fields or keep them empty.
  • PathToDotTouchGFX Specify the path to the .touchgfx file usually located in the TouchGFX folder.
  • Data Use the fields in the Data section to specify TBS version, images, board name, type (TGAT for a TBS) vendor, description, and link to further information.

The available types and how each type is placed in TouchGFX Designer is shown below.

**TGAT** is for TBSs. The TBS will be placed in 'Create' in TouchGFX Designer.

**TGUI** is for GUIs. If it is a simple GUI, set the category to **example**, which will place it in 'Examples'.

**TGUI** is for GUIs. If it is a complex GUI, set the category to **demo**, which will place it in 'Demos'.

**TGAPP** is for a TBS combined with a GUI. It will be placed in 'Board Specific Demo' under 'Demos'.

An example of a json description file for a TBS is shown below.

MyApplication.json
   ...
    "Author": [
      {
        "Name": "Chad Brody",
        "Contact": "chad.brody@mycompany.com",
        "URL": "http://mycompany.com/"
      }
    ],
  ...
  "PathToDotTouchGFX": "",
  "EmbeddedOs": "FreeRTOS"
  ...
  "Data": {
    "Version": {
      "Major": 1,
      "Minor": 0,
      "Build": 0
    },
    "Name": "MyApplication",
    "HumanFriendlyName": "MyApplication",
    "BoardName": "Custom STM32 Board",
    "Type": "TGAT",
    "Vendor": "MyCompany",
    "Description": "This is a working project on which to base your UI on top of.",
    "DocumentationLink": "",
    "Category": "",
    "Images": [
      "http://mysite.com/MyCustomBoard-front.png"
    ],
    "Tags": [],
    "AvailableResolutions": [
      {
        "Height": 480,
        "Width": 480
      }
    ],
    "TargetBpp": [
      24
    ]
  }
}
Note
If the TouchGFX folder is not placed in the root of the project directory, you need to specify the path to the .touchgfx file in the PathToDotTouchGFX field. For example, if it is placed in .\MyTouchGFXFolder/TouchGFX, you need to write:
"PathToDotTouchGFX": "MyTouchGFXFolder/TouchGFX"
Tip
In order to include an image in your TPA, you need to provide a link to the image stored online.

Generate .tpa​

다음 명령을 실행하여 최종 '.tpa' 파일을 생성하고 TouchGFX Board Setup을 완료합니다.

$ /c/TouchGFX/4.25.0/designer/tgfx.exe pack -rc -d MyApplication

TouchGFX Board Setup 생성

테스트 및 확인​

To verify that the .tpa file can be seen by TouchGFX Designer as a TBS and used to create new applications, perform the following steps:

  1. You can rename the .tpa file if you want to.
  2. Copy or move the .tpa file to C:\TouchGFX\4.25.0\app\packages. This allows users to import TBSs, GUIs, and BSDs into TouchGFX Designer from a local folder.
  3. Open TouchGFX Designer and select the TBS under the By Partners tab.

TBS 정보

최종 노트​

The following section contains tips about what to consider when distributing TBSs.

일반 팁​

일반적으로 .tpa를 배포하기 전에 다음과 같이 해야 합니다.

  1. 공급된 모든 IDE 프로젝트가 예상대로 작동하는지 확인합니다.
  2. TouchGFX 프로젝트 파일 .touchgfx에 정의된 맞춤형 명령(PostGenerate- 등)이 예상대로 작동하는지 확인합니다.
  3. TBS가 TouchGFX Designer에서 읽기가 가능하고 새 애플리케이션을 생성하는 데 사용할 수 있는지 확인합니다.
Tip
Be sure to re-pack the application template after modifying the content of either the TouchGFX project or the `.json` file.

After distributing the .tpa one should instruct users to copy the .tpa file into C:\TouchGFX\4.25.0\app\packages and restart TouchGFX Designer.

버전 관리​

일반적으로 개발자는 동일한 리포지토리에 전체 개발 프로젝트(TouchGFX Board Bringup, TouchGFX AL, TouchGFX UI)를 보관하기 때문에 배포 가능한 .tpa 파일이 필요하지 않습니다. 하지만 통합 플랫폼 코드는 팀 구성원이 새로운 TouchGFX 애플리케이션을 시작할 수 있도록 테스트 및 확인을 수행하는 데 효과적입니다.

.tpa 파일을 배포하거나 repo, git submodules와 같은 도구를 사용해 코드베이스를 모듈화하는 경우에는 TBS 부품의 버전이 앞서 설명한 .json 디스크립터에 지정된 버전을 따르도록 하는 것이 좋습니다. 모듈화된 접근 방식을 사용하는 경우, 플랫폼 코드는 배포 가능한 .tpa 파일을 생성하는 것 외에 주요 프로젝트 구조에서 모듈로도 사용될 수 있습니다.

  "Data": {
    "Version": {
      "Major": 3,
      "Minor": 0,
      "Build": 0
    },
$ git tag
v1.1.0
v2.0.0
v2.1.0
v3.0.0