Match Lines Component
#Content Editor #Template Content Creation #Blank Canvas
Last updated
#Content Editor #Template Content Creation #Blank Canvas
Last updated
✨Entrance of Template Content Creation：Work Preview Area>>>Match Lines Component button / Layer Area>>>Match Line Component
✨Entrance of Blank Canvas：Gameplay Template>>>Component>>>Match Lines Component
Related case tutorial can refer to Match Lines Component - Blank Canvas Tutorial
Currently, both "Template Content Creation" and "Blank Canvas" support the use of the "Match Lines Component." With "Template Content Creation," you can make adjustments to the components based on the original template's gameplay. With "Blank Canvas," you can create assets for connection gameplay from scratch.
Based on the existing 「Match Lines Component」 , you can adjust the template's connectable area, start and end regions, line style, pairing relationships, line types,etc
Note: Only one component can be added per scene, but component can be added across scenes or copied.
It is suitable for gameplay with fixed connected areas or fixed pairing combinations, such as 'Line And Solve'.
The adjustable parameters of 「Match Line Component」 are divided into three parts: "exterior", "start and end regions", and "event".
[Show&Hide] Separate Setting：Same as appearance parameters for each layer. You can adjust whether the 「Match Line Component」 is displayed separately in landscape/portrait mode.
Position&Size：You can modify the width, height, and position of the 「Match Line Component」. They determine the range where lines can be drawn (as shown in the example below, the green overlay indicates the playable area for drawing lines).
Screen adaptation：Same as appearance parameters for each layer, you can adjust the screen adaptation method for the 「Match Line Component」.
Scale：Same as appearance parameters for each layer, you can adjust the scale ratio of the 「Match Line Component」.
The "Start and End Regions" is a unique parameter of the Match Line Component. A 「Match Line Component」 consists of multiple start-end Regions and their pairing relationships.
In this component, set several regions of arbitrary size and position, which will be used in conjunction with "Pairing Relationships" to generate specific drawing effects.
In the [Draw to home] template, there are a total of 4 start and end regions:
Support modifying the line style (color and thickness) of existing "start and end regions."
Support applying the line style of a specific start and end region to all.
Support adding new start and end regions.
For each start and end region, you can adjust its size and position on the canvas.
Support deleting a specific start and end region (but it is not recommended as it may cause issues with gameplay functionality).
Note: The Line Style represents the style of lines drawn from that region.
Pair relationship determine whether a line can be drawn from a specific region. Only start and end regions with a pairing relationship can draw lines. Start and end regions without a pairing relationship cannot draw lines, even if they have the required areas.
In the [Draw to home] template, there are a total of 4 Pairing Relationships:
Each pairing relationship requires the configuration of a "Start region" and "End region," along with the setting of the "Matching Category" parameter.
Only one start region can be selected, while the end region supports single or multiple selections.
The "Matching Category" is divided into two categories: true or false. (Blank Canvas supports custom creation, detailed explanation below)
Support modifying the name of each pairing relationship.
Support deleting a pairing relationship (but it is not recommended as it may cause issues with gameplay functionality).
Support "Previewing All Lines"
Note: Completed connections can't be redrawn
Taking the template "Draw to home" as an example.
There are 4 Pairing Relationships in total：1->3, 2->4, 1->4, 2->3.
Among them, 1->3 and 2->4 are set as "True" pairs, while 1->4 and 2->3 are set as "False" pairs.
Using these pair relationships, in the material, dragging to draw a line can start from regions 1 and 2. If the final finger release position is within regions 3 and 4, the drawn line is retained, triggering corresponding events; otherwise, the drawn line is not retained.
Note: When using [Blank Canvas] with the Match Lines Component, you need to add the [Matching Category] manually. You can add multiple Matching Categories based on the actual creation needs.
Click the settings button in the illustration to open the [Matching Category] popup. Click [Add Pairing Category], enter the name, and the setup is complete. Once added successfully, you can select the Pairing Category.
Affects the pairing relationships.
If configured as "One-way", lines can only be drawn from the region before each pairing, and it is not possible to draw lines from the subsequent region. Taking the first pairing relationship in the "Draw to home" template as an example, you can only draw lines starting from region 1 and ending at region 3; it is not possible to draw lines starting from region 3.
If configured as "Two-way",lines can be drawn from either region of each pairing relationship. Taking the first pairing relationship in the "Draw to home" template as an example, you can draw lines from region 1 to region 3 or from region 3 to region 1, both options will successfully complete the line.
It determines the specific type of lines drawn in the material.
Free-hand Drawing: Simply put, Free-hand Drawing is the curve that follows the trajectory of the finger's drawing line.
Straight Line: Not affected by the trajectory of fingers during the drawing process, only forming a straight line in the end.
Two types of trigger events can be configured on the Match Line Component："Begin Drawing" and "Finish Drawing".
Response events related to the Match Line Component include "Erase Lines," "Edit Line Style" "Enable/Disable Pairing", "Edit the Style of Paired Lines","Enable/Disable Start and End Regions."
It is necessary to select the regions where you want to start drawing lines (supports single or multiple selection) and set response events.
The triggering condition is: when drawing a line from the selected "start and end regions
For example, when setting the trigger event as "Begin Drawing," and configuring the Start and End Regions as 1 and 2, with the response event being playing music. Pressing down in region "1" or region "2" to start drawing a line will initiate the playback of music.
It is necessary to select "Match or Not Match" and "Pairing Relationship" or "Matching Category" under "Pairing Method"
If you choose "Match" - "Pairing Relationship" (supports single or multiple selection), also need to choose which specific group or groups of pairing relationships it is
If you choose "Match" - "Matching Category", also need to select whether the matching category is true or false
Note: The true/false here corresponds to the pairing relationship attribute we set in the "Pairing Relationship" section earlier. In the [Draw to home] template, the categories for "Pairs 1->3" and "Pairs 2->4" are true, "Pairs 1->4" and "Pairs 2->3" are false.
The triggering condition is: when the selected pairing relationship(s) or matching category completes the drawing of lines.
Note: When multiple pairing relationships are selected or a specific matching category is chosen, the response event will be triggered as soon as any one of those pairing relationships finishes the drawing of lines.
Taking the template "Draw to home" as an example.
When setting "Match" -> "Pairing Relationship" -> "Pair 1 -> 3" and the response event is set as "Redirect to the next scene" ：it means that when a line is successfully drawn from region 1 to region 3, it will trigger the event to redirec to the next scene.
When setting "Match" -> "Matching Category" -> "true" and the response event is set as"Redirect to the next scene" ：it means that when either the pairing relationship "1->3" or "2->4" with the category set as true is successfully completed, it will trigger the event to redirec to the next scene.
If you choose "Not Match",you can directly add the corresponding response event.
The triggering condition is: when drawing starts and the finger is released outside of any pairing relationship region, indicating a non-match.
Taking the template "Draw to home" as an example.
When setting the trigger event as "Finish Drawing," with "Not Match" selected, and the response event as "Redirect to the next scene." In the provided material, as regions 1, 3, and 4 have pairings, starting to draw in region 1 and releasing the line outside regions 3 and 4 is considered "Not Match," triggering a redirect to the next scene.
Note: The difference between "Matching Category - False" and "Not Match"
"Matching Category -False": It is a type of "Pairing Relationship" (e.g., Pair 1 -> 4 in the template). "
Not Match": It does not include any specific "Pairing Relationship" (e.g., Pair 1 -> 2 in the template).
Select the "Pairing Relationship" to be erased.
The response of this event is that the completed lines within the selected pairing relationship will be erased.
Note: This response event only applies to "straight lines" ,not to "free-hand drawings."
Select the "Region" that you want to modify. Then set the line style.
The response of this event is that the lines starting from that region, including those already drawn, will have their styles modified to the specified style.
Note: This response event applies differently to "straight line" and "free-hand drawing"
For "straight line": Both drawn and undrawn lines work.
For "free-hand drawing": Only undrawn lines work.
Select the "Pairing Relationship" to be modified. Then set the line style.
The response of this event is that the completed lines within the selected pairing relationship will be modified.
Note: This response event only applies to "straight lines" ,not to "free-hand drawings."
Select the pairing to be enabled/disabled.
If "Disable" is selected, the response of this event is that the selected pairing relationship can no longer start or finish lines.
If "Enable" is selected, the response of this event is to cancel the "disabled" status of the pairing.
Select the Start and End Regions to be enabled/disabled.
If "Disable" is selected, the response of this event is that the selected Start and End Regions can no longer initiate drawing lines.
If "Enable" is selected, the response of this event is to cancel the "disabled" status of the region.
Sample1 -
Sample2 -
Sample3 -
Sample4 -
We will combine the template to provide instructions for using the 「Match Line Component」
