[PLUGINS] Touch Interface Designer

Distribution UE Marketplace
, ,
1

Touch Designer
Touch Designer1920Ă—1080 145 KB

Touch Interface Designer - Unreal Marketplace

DESCRIPTION
Setup Touch Interface for mobile can be a slow and annoying process because Touch Interface Asset is data only. Touch Interface Designer is a plugin that lets you create a mobile touch interface in your project with an visual editor. With the WYSIWYG user interface, Touch Interface Designer speeds up the process of adjusting virtual button, joystick and other control type for mobile. The Virtual Control Setup asset contains all the data to display the necessary widget and the Virtual Control Manager component allows to modify in game the widget (Touch Interface) which contains the mobile controls (Virtual Control).

MANY INTEGRATED FEATURES
Touch Interface Designer also adds many features that the basic Touch Interface lacks such as modifying the properties of a virtual control in real time, the necessary to detect gestures (Tap, Double Tab, Long Press, Drag, Swipe, Rotate, Zoom) or useful fonctionnality like Auto Move, Drag To Sprint, Touch Region, Enhanced Input compatibility, Material Dynamic Instance compatibility and many more features…

EASY TO SETUP EASY TO USE
Touch Interface Designer is easy to integrate, configure and use. We try to develop software that simplifies your work and allows you to work faster while having access to a high level of functionality and customization.

EXAMPLE
Lyra Integration Example

WELL DOCUMENTED
You have access to complete documentation which explains in detail the different components of Touch Interface Designer. It will guide you to configure and use Touch Interface Designer.

SUPPORT
You have a problem? Don’t worry, we’ll help you! Ask any question about Touch Interface Designer and we will be happy to help you and provide a solution. In case you are stuck, you can contact us by mail or on the support thread on unreal dev community.

REGULARLY UPDATED
Touch Interface Designer is updated regularly and improvements and new features are added with each update. See roadmap! If you wish, you can follow the development of Lost in Game Studio software on Ko-fi or Twitter.

FEATURES
Editor Features

  • Convert EPIC Touch Interface Asset with preview
  • Add a curve on the joystick to adjust the returned value
  • Use a preset to quickly create your virtual controls
  • Create and save your own preset
  • Preview your Touch Interface in different screen size and format
  • Preview your Touch Interface in pre-integrated smartphone mockup (Experimental)
  • Overview of the different scaling mode
  • UMG Helper for designer

Runtime Features

  • Show/Hide Touch Interface or individual virtual control
  • Add/Remove control
  • Change all properties of control
  • Gestures Recognizer
  • Enable/Disable Input/Gestures
  • Choose between Two scaling mode
  • Key Rebinding
  • Auto Move
  • Drag to Sprint
  • Press/Release Event on Joystick
  • Compatible with Enhanced Input plugin
  • Touch Region
  • Gamepad detection

Documentation
Roadmap
Support Thread

1 Like
2

New! v2.1.0

  • The main contribution of this update is the addition of the Gestures Recognizer! I implemented a first version of the Gestures Recognizer which allows to manage gestures on mobiles such as tap, double tap, long press or drag. New gestures will be supported soon. This feature is still experimental.
  • Latest improvements and bug fixes bring Touch Designer out of beta!

Don’t hesitate to contact me if you find a bug or to request a new feature!

3

New Update! v2.2.0 (released 08/19/2022)

News

  • You can now modify the scale of the virtual controls (without impacting the rest of the user interface) thanks to a parameter “ScaleMultiplier” which can be modified at runtime.
  • Smooth input for joystick : You can now modify a curve used to indicate what value returns the virtual joystick according to its position, which allows a better control of the character or the camera.
  • Gesture Recognizer goes into beta! This allows him to manage more gestures. Here are all the gestures recognized in version 2.2.0 of Touch Designer: Tap, Double Tap, Long Press, Drag, Swipe in 4 directions, Rotate, Zoom in/out.
  • Virtual controls can now have a different visual style depending on their state (Pressed or released).
  • When a button is pressed, a sound can be launched. You can set this sound in the button settings (detail panel). Supports all sound types supported by Unreal Engine (Meta sound, Sound CUE, Sound Wave…).
  • A material can now be used for the visual of the virtual controls. The material domain must be of type User Interface. In a future update, I will bring the possibility to recover the instance of the material in order to manipulate the parameters of this material.

Improvements

  • Touch events (Began, Moved, Ended) are no longer linked to the Gesture Recognizer and can therefore be used without this system.
  • I added in the settings of the editor the possibility to activate / deactivate by default the outline for the canvas.
  • I added to the ActivateTouchDesignerInterface() function the possibility to activate or deactivate inputs, gesture recognition or widget visibility.

Fix

  • Fixed a bug related to the garbage collector.
  • Fixed a bug that function SetVirtualControlWidgetVisibility() do not block gesture recognition even if parameter “BlockGesture” is at true.

Don’t hesitate to contact me if you find a bug or to request a new feature!

4

New Update! v2.3.0 (released 09/01/2022)

News

  • AutoMove (Joystick Drag to Sprint) : If you hold the joystick in one direction, then it can stay in that direction until the user touches it. This joystick will send a value every frame. This feature can be disabled by recentering the joystick. Also, an event that can be bind from Touch Designer Controller is sended when AutoMove is triggered or stopped.

  • Key Rebinding : You can now change the key associated with the control at runtime. Warning! It is not saved yet and this modification is erased if you change Touch Designer Interface or when stopping the game / application. Save function coming soon!

  • More Utility function : I added some functions that might be useful. List:

    • Show all buttons
    • Hide all buttons
    • Show all joysticks
    • Hide all joysticks
    • Get all buttons
    • Get all joysticks

Improvements

  • Gesture Recognizer work in Game And UI Input Mode : Until v2.2.0, Gesture Recognizer work fine only in UIOnly Input Mode. With this v2.3.0, Gesture Recognizer now works fine with GameAndUI Input Mode.

Bug Fix :

  • Fixed: Brush Tint is not applied to control and remains white
  • Fixed: Interface is displayed even if « Show in desktop platform » is disabled
5

New Update! v2.3.1 (released 09/09/2022)

New

  • Drag to sprint : Drag to sprint sends an event (Key) when the player/user slides the thumbstick out of the planned area and forwards. It is generally used for sprinting. You can block this state by dragging the thumbstick to a value defined in the settings. It is represented by a button that you can customize.

Improvement

  • Auto Move : When the automatic movement is triggered, a new visual appears in the center of the joystick to warn the user that the movement is « locked ». You can choose the visual in the joystick settings.

Bug Fix

  • Fixed! Multi-Selection notification appear on all selected asset.

Don’t hesitate to contact me if you find a bug or to request a new feature!

6

New Update! v3.0 (released 11/15/2022)

Touch Interface Designer v3.0 is a major update which required the rewriting of part of the code in order to improve and add new features. Although extensive testing has been done, there may still be a few bugs here and there. Therefore, it has been released as beta!

If you find a bug or a feature is missing or unsatisfactory, you can go to the support thread to let me know.
Note: this beta 1 version has not been tested on the unreal engine 5.1!

News

  • Layer System for visual of virtual control : You can now stack textures and materials to get the look you want for your virtual controls.
  • Recenter on touch for each virtual control individually : on previous versions, the « recenter » parameter was applied globally to all virtual controls. On this new version, the « recenter » parameter can be applied individually to each virtual control. So you have the possibility to choose which virtual control should be recentered when the user touches it.
  • Turn rate parameter for joystick : You now have the option to enable the Turn Rate feature on the joystick and set the turn rate so you don’t have to do it in your pawn, character or player controller class.
  • Gamepad Detection : By activating this new feature, Touch Interface Designer is able to detect the connection/disconnection of a game controller. When a game controller is connected, the touch interface is hidden. When the game controller is disconnected, the touch interface is displayed again. Touch Interface Designer is also able to detect whether an input comes from a game controller or not, which allows you to display or hide the touch interface depending on the type of input. Warning ! On some devices, connection/disconnection detection may take a little time or even not work at all.
  • Debug in runtime : Display useful informations on the touch interface to help you debug.
  • UMG Helper : UMG Helper allows you to get a preview of the touch interface on your game’s user interface in order to better design the interface.
  • Build-in save system : The built-in save system lets you save and load different configurations of your Touch Interface in runtime.
  • Gesture Manager Component : on previous versions, you had to bind a function to the event in Touch Designer Controller component in order to retrieve the gestures performed on the touch interface. On version 3.0, gestures are managed by a new component « Gesture Manager ». You can add as many as you want, wherever you want! This component integrates all the necessary parameters such as the configuration of gestures and a priority system
  • Touch Region : Touch Region is a new type of virtual control which is an alternative to virtual joystick. It works much the same but allows to rotate a camera only when the finger moves. It was designed primarily for camera movement, but you can use it for whatever you want!

Improvements

  • Editor interface improvements : The editor interface has been redesigned to improve the user experience. There is now a drag&drop system to add a new virtual control. Allows you to place the virtual controls directly at the right position.
  • Opacity state set to « Enabled » on editor start : The editor allows you to preview the opacity of your virtual controls. By default, the parameter was set to « Inactive » which forced users depending on the value of the Inactive opacity to change the preview to « Active » each time the editor was launched. So I changed the default setting which is now « Active ».
  • [Enhanced Input] InputAction Rebinding : You can now modify the input action associated with your virtual control at runtime.
  • Virtual Control Previewer improvements : The window which allows to have a preview of the selected virtual control has been improved in order to display the state of the control (pressed or not), to play the sound for the button and to display the opacity of the control according to the parameters defined in the general parameters.

Deprecated

  • SetVirtualControlWidgetVisibility() is now deprecated : Use ShowWidget() or HideWidget() instead.
  • Touch Designer Interface is now deprecated : For new interface creation, you must use a VirtualControlSetup instead. You can convert the old interfaces by right-clicking on them and then selecting « Convert to v3.0 », Touch Interface Designer will convert your Touch Designer Interface to Virtual Control Setup.
7

Version 3.0 of the Touch Interface Designer plugin is out of beta and can be used in production. Due to a bug in version 5.1 of the Unreal Engine which prevents compiling a plugin for android, my plugin is currently only available for version 5.0. The bug should be fixed by Epic Game with the release of version 5.1.1

Improvements

  • Add Icon to components and widget class.

Deprecated

  • Get All Buttons, Get All Joysticks and Get All Touch Regions are deprecated.

Bug Fixes

  • Fixed! Editor crash when apply preset.
  • Fixed! Little background image is displayed when create new virtual control setup.

As always, if you find a bug or a feature is missing or unsatisfactory, you can go to the support thread to let me know.

8

Version 3.1 of Touch Interface Designer brings new features and welcome quality of life improvements. This new version is available for the Unreal Engine 4.27 and 5.0. Epic Game still hasn’t proposed a solution for the plugin compilation issue that targets android in the 5.1 version of the engine, so for the moment I can’t propose the 5.1 version of Touch Interface Designer to the marketplace team. It’s not an ideal solution but for those who would absolutely want a version compatible with version 5.1 of the engine, ask us in the questions on the marketplace to get it.

Finally do not hesitate to leave a review on the marketplace about Touch Interface Designer!

Video

News

  • Virtual Control Event : Event class that can be called by virtual control. You can create your own event based on this class in blueprint. Use case : extend virtual control behavior like play sound, Hold event… In the next versions, you should be able to make changes like hiding or showing the visual layer, changing the scalar value of a dynamic instance material… You can find an example of its use in the Example folder of the plugin

  • Circle Hit Test : Until now, to detect if the user’s finger is touching a virtual control, you had to specify a rectangular/square area. Now you can define a radius from the center of the virtual control. This will avoid overlaps when the virtual controls are very close and will better fit the circular design.

  • Link : Group several virtual controls together in order to move them all at the same time. With the « RecenterOnTouch » function during the first touch, allows you to recenter the whole group. Useful for buttons placed near a joystick and which must maintain the same offset, regardless of the resolution/screen ratio.

  • Multiplayer : Thanks to the use of the new subsystem based on the LocalPlayerSubsystem, Touch Interface Designer is now ready for multiplayer.

  • Custom Scaling Rules : You can now define your own scaling rules.

Improvements

  • Device Mockup now in beta : The parameter « bEnableDeviceMockup » which was in the parameters of the editor has been placed in the parameters of the background. The display of the model of the device being previewed is now in beta and is therefore activated by default.
  • Shortcut : When you have selected a virtual control in the editor, you can now press F2 on the keyboard to rename the virtual control.
  • Touch Interface preview in editor was reworked : The preview in the editor has been reworked to ensure better consistency between profiles, to avoid large size differences between profiles and to take into account changes in device profiles, such as device content scale factor. The editor now provides much more information about the selected device profile such as GPU, screen definition, rendering resolution and device content scale factor.
  • Negative ZOrder : The touch interface widget is now created with a negative ZOrder of -99 to avoid conflicts with other widgets added to the player screen.
  • Scaling Mode Preview : The editor correctly supports different scaling modes as well as the multiplier.
  • Touch Interface Subsystem : To facilitate the use of the plugin, the Virtual Control Manager component has been removed and all these functions have been integrated into the Touch Interface Subsystem. The old Virtual Control Designer Subsystem (the name is much too long) has been replaced by Touch Interface Subsystem.

Deprecations

  • Compatibility with old Touch Interface Setup is dropped : The « TouchDesigner » and « TouchDesignerEditor » modules have been removed. Before upgrading to the 3.1 update, make sure you have converted your Touch Interface Setup to a Virtual Control Setup. You can always convert your touch interfaces integrated in the engine to the Virtual Control Setup format compatible with Touch Interface Designer.
  • Virtual Control Manager is deprecated : It is replaced by the Touch Interface Subsystem (previously named Virtual Control Designer Subsystem). Touch Interface Subsystem has the same functionality as Virtual Control Manager but it is easier to use and you don’t need to add any component to manage the touch interface. It is also multiplayer compatible since one subsystem is created per player.
  • SetVirtualControlVisibility function is deprecated. Use ShowVirtualControl or HideVirtualControl. These two functions take into account the related controls. When you want to show or hide a virtual control, you can also include virtual controls that are linked.
  • RemoveControl function is deprecated. Use RemoveVirtualControl. This function take into account the related controls. When you want to remove a virtual control, you can also include virtual controls that are linked.

BugFix

Nothing to report :slight_smile:

9

New Update! v3.2 (released 06/07/2023)

News

  • Touch Region send continuous inputs (Joystick Mode). This lets you control the camera or character using part of the screen.
  • Gesture Recognizer has two new events, OnMoveDelta to control the camera, for example, and OnDragEnd, which is called once the OnDrag event has ended.
  • [Experimental] First implementation of Motion Recognizer. This new component will manage the device’s IMU data. Camera control, 3D effects on the camera, detection of jolts or taps on the side of the device. For the moment, Motion Recognizer recognizes a tap on the side of the device. Bear in mind that this system is still in the experimental stage.
  • [Experimental] First implementation of Shape Recognizer. This new component allows to recognize a shape drawn on the screen. It recognizes basic shapes but the goal is to allow you to create your own complex shapes. If a pattern is recognized, then an event is sent.
  • Compatibility with Unreal Engine 5.2

Improvements

  • Multiplayer : Touch Interface Designer now works much better with online multiplayer.
  • Virtual Control Event : New functions have been added to retrieve the name of the virtual control associated with the VCE, retrieve and modify the virtual control’s visual layer and retrieve the player index (useful for multiplayer).
  • Complete rework of Preset

Bug Fixes

  • The editor can’t retrieve the presets
  • Layer Type flag name undefined
  • Touch Interface not displayed in Standalone PIE
  • [UE5.1] Enum flag name missing
  • Warning on package : The Config file XXX.ini will be staged, but not explicitly allowed or denied. Config folder of Touch Interface Designer is automatically included thanks to FilterPlugin.ini
  • LongPress Gesture not fired
  • Crash on Virtual Control init in some case when Virtual Control Event is used
  • Linked controls do not send input when Enhanced Input is used

As always, if you find a bug or a feature is missing or unsatisfactory, you can go to the support thread to let me know.

10

Update 2024.1 is now available for download on the marketplace! It includes many new features and quality-of-life improvements. The aim of this update is to facilitate visual layer management and significantly improve gesture recognizer stability and performance.

Overview

The touch interface editor has been redesigned, making it easier to modify the visual appearance of a virtual input. A library of functions has been added to make it easy to create a new visual layer at runtime. Also, the subsystem has been updated to simplify visual layer management.

A new virtual input system has been added. Eventually, it will replace the current system based on a structure table. These new virtual input have their own editor. Thanks to the Virtual Input Modifier, the value returned by a virtual input can be easily modified. No need to do it in your blueprints or c++ code.

The Gesture Recognizer component has been completely rewritten to improve performance and stability in gesture detection. New gestures are taken into account, the component can operate without a touch interface, and features an individual mode for detecting gestures on each finger.

The system for recognizing device movements has been drastically improved, and new events such as shaking are now taken into account.

The system for recognizing the user’s drawing has been completely overhauled. The editor is now perfectly usable and includes a number of interesting new features, such as new tools and the Drawer mode, which lets you test virtual shape recognition directly in the editor.

See the release note for a detailed description of the changes. The documentation has of course been updated to explain in detail how the new system works and to help you getting started with Touch Interface Designer!

Don’t hesitate to give us your feedback on this update and these new features!