XHXIAIEIN's Recent Forum Activity

  • I think it's straightforward to have translatable flowcharts: instead of an actual piece of text in a value, put the translation key, and look it up for the current language when displaying it.

    It may not be necessary to fill in the translation key, but to find a better way to manage the path. When obtaining output content, point to the translation file based on the relative path.

    But the question now is, how to organize this structure?

    strings.nodes[NodeIndex].outputs[OutputIndex].value
    

    Especially for this NodeIndex, Once it can be identified, localization can be achieved by directly editing the JSON source file of Flowchart, utilizing its existing structure.

  • How should Flowcharts solve the localization?

    If I Duplicate a flowchart file for each language, If I want to change Something, I have to edit it again n times, which is obviously unreasonable and error prone.

    If working with i18n plugin, I need to create a JSON file to manage it. This means that I need to maintain a path similar to flowchart in the JSON file again. And fill in the placeholder for this path in the flowchart.But this obviously loses the convenience of visualizing flowcharts. What better way to cooperate with the i18n plug-in?

    For example: #open=flowchart-questionnaire

    • Tab 1

      I extracted the JSON file of Flowchart from the project file and cleaned up other data: file.json

    • Expand
      {
      	"name": "Questionnaire",
      	"locale": "en-GB",
      	"strings": {
      		"nodes": [
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "What kind of content do you want to make?"
      					},
      					{
      						"name": "Option1",
      						"value": "Games"
      					},
      					{
      						"name": "Option2",
      						"value": "Animations"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "Try Construct Animate! Use the timeline to build sequences of movements and changes over time, and export as a video, GIF, or image sequence."
      					},
      					{
      						"name": "Link",
      						"value": "https://animate.construct.net/"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "Are you interested in using coding to develop games?"
      					},
      					{
      						"name": "Option1",
      						"value": "Yes"
      					},
      					{
      						"name": "Option2",
      						"value": "No"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "Try using Construct 3 with its event block system. It's a drag-and-drop alternative to programming languages which is easy to learn and yet powerful enough to build sophisticated games with."
      					},
      					{
      						"name": "Link",
      						"value": "https://editor.construct.net/"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "Do you already know how to code with JavaScript or TypeSript?"
      					},
      					{
      						"name": "Option1",
      						"value": "Yes, I know JavaScript"
      					},
      					{
      						"name": "Option2",
      						"value": "Yes, I know TypeScript"
      					},
      					{
      						"name": "Option3",
      						"value": "No"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "See our tutorial 'Construct for JavaScript developers quick start guide' for an introduction on how to use your existing JavaScript coding knowledge with Construct."
      					},
      					{
      						"name": "Link",
      						"value": "https://www.construct.net/en/tutorials/construct-javascript-2866"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "See our tutorial 'Using TypeScript in Construct' for a guide on how to use your existing TypeScript coding knowledge with Construct."
      					},
      					{
      						"name": "Link",
      						"value": "https://www.construct.net/en/tutorials/using-typescript-construct-3003"
      					}
      				]
      			},
      			{
      				"outputs": [
      					{
      						"name": "Message",
      						"value": "See our free 13-part course 'Learn JavaScript in Construct', which teaches the basics of JavaScript coding in Construct!"
      					},
      					{
      						"name": "Link",
      						"value": "https://www.construct.net/en/courses/learn-javascript-construct-79"
      					}
      				]
      			}
      		]
      	}
      }
      
  • It makes sense to support connecting to parent nodes and own nodes

    For example, in some games there are some "trap" or "ask" options that will return to the current node when player select.

    What do you want to know?
     - What is {quest}?
     - Who is {npc}?
     - Option 3
     - Option 4
    
    what do you do first
     - use hand			-> die
     - use tools		-> survive
     - shout for help	-> die
     - do nothing		-> die
    

    After their process ends, they will return to the parent node.This is common in many games.

    Currently, although it is possible to manually add an special Output Name to record the parent node, And through the eventsheet and then position it. But it is not a convenient visualization solution, Just an auxiliary field. it would be more convenient if it could be supported directly.

    But supporting this function will also face a problem, the lines will become confusing.

    a by flowchart demo Adrian Raudaschl

  • You can edit the CSS style.

    for example

    textarea
    {
    	font-family: 'Lato', sans-serif;
    	font-size: 35px;
    	line-height: 40px;
    	color: #ecf0f1;
    	background-color: #34495e;
    }
    
  • You can check this example: #open=multiplayer-chat. In fact, the user client page part of this example is completed by just a few textarea components.That is the custom html page you want.

    Or if you want to access the SDK of multiplayer objects through Javascript

    #open=multiplayer-scripting

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • You can use BBcode

    [outlineback=#FFFFFF]Hello World[/outlineback]
    [outline=#FFFFFF]Hello World[/outline]
    
    [lineThickness=2][outlineback=#FFFFFF]Hello World[/outlineback][/lineThickness]
    
  • There doesn't seem to be a good way to check wrapping characters. So can only manually calculate the position where you want to wrap the line.

    cdn.discordapp.com/attachments/1115561404754305024/1187628614246727750/Scroll_Text.c3p

    This is based on this Example by dop2000.

  • try to use FILE (WEBVIEW2)

  • Here is a example

  • You can check this example.

    #open=touch-zooming

    ---

    If you want it to be bound to the the viewport, you can add this section

    {"is-c3-clipboard-data":true,"type":"events","items":[{"eventType":"comment","text":"Viewport"},{"eventType":"variable","name":"boundLeft","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"boundRight","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"boundTop","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"boundBottom","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"comment","text":"ZoomScale"},{"eventType":"variable","name":"UseWidthScale","type":"boolean","initialValue":"false","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"WidthScale","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"HeightScale","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"minZoomScale","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"variable","name":"maxZoomScale","type":"number","initialValue":"0","comment":"","isStatic":false,"isConstant":false},{"eventType":"block","conditions":[{"id":"on-start-of-layout","objectClass":"System"}],"actions":[{"type":"comment","text":"Viewport Bound"},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"boundLeft","value":"(ViewportLeft(\"UI\") + ViewportMidX(\"UI\")) / LayoutScale"}},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"boundRight","value":"LayoutWidth - (ViewportRight(\"UI\") -ViewportMidX(\"UI\")) / LayoutScale"}},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"boundTop","value":"(ViewportMidY(\"UI\") - ViewportTop(\"UI\")) / LayoutScale"}},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"boundBottom","value":"LayoutHeight - (ViewportBottom(\"UI\") - ViewportMidY(\"UI\")) / LayoutScale"}},{"type":"comment","text":"Viewport Aspect Ratio"},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"WidthScale","value":"ViewportWidth(\"UI\") / LayoutWidth"}},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"HeightScale","value":"ViewportHeight(\"UI\") / LayoutHeight"}},{"type":"comment","text":"Zoom Scale"},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"minZoomScale","value":"UseWidthScale ? max(WidthScale, HeightScale) : min(WidthScale, HeightScale)"}},{"id":"set-eventvar-value","objectClass":"System","parameters":{"variable":"maxZoomScale","value":"minZoomScale * 3"}}]}]}

    Used:

    clamp(scrollx, boundLeft, boundRight)
    clamp(scrolly, boundTop, boundBottom)
    clamp(LayoutScale, minZoomScale, maxZoomScale)
    

    And uncheck the Unbounded scrolling property

  • construct.net/en/tutorials

    Tom The delete button is placed here and it is very easy to press it by mistake, Please make it a text hyperlink and Swap the their position.

    OR placed on the tutorial page.

XHXIAIEIN's avatar

XHXIAIEIN

Member since 26 Mar, 2016

Twitter
XHXIAIEIN has 9 followers

Trophy Case

  • 8-Year Club
  • Jupiter Mission Supports Gordon's mission to Jupiter
  • Forum Contributor Made 100 posts in the forums
  • Coach One of your tutorials has over 1,000 readers
  • Regular Visitor Visited Construct.net 7 days in a row
  • Steady Visitor Visited Construct.net 30 days in a row
  • Enduring Visitor Visited Construct.net 90 days in a row
  • RTFM Read the fabulous manual
  • x46
    Quick Draw First 5 people to up-vote a new Construct 3 release
  • x10
    Lightning Draw First person to up-vote a new Construct 3 release
  • x9
    Great Comment One of your comments gets 3 upvotes
  • Delicious Comment One of your comments gets 10 upvotes
  • Email Verified

Progress

20/44
How to earn trophies