Custom top-bottom connections depending on type

116 views
Skip to first unread message

Kate D

unread,
May 7, 2021, 11:52:58 AM5/7/21
to Blockly
Hi,
Could you please tell if it's possible to create different forms of top-bottom connections for different block types (to make connection validations depending on connection shape)? 

Beka Westberg

unread,
May 7, 2021, 3:09:56 PM5/7/21
to blo...@googlegroups.com
Hello,

You can definitely change the shapes of the top-bottom connections! Blockly now allows you to create custom renderers, which allow you to change all sorts of things about how a block is shaped. To learn more about it I recommend checking out the renderer codelab =)

As for connection validation, there's one thing I think I should clarify. By default all top/bottom connections can connect to the opposite type, and all input/output connections can connect to the opposite type. After that you set which connections within those two groups can connect to which other connections using connection checks. Then in your render, you change the shape of the connection *based on these checks* as well. IE the checks determine the shape, and what the block can connect to, the shape does *not* determine what a block can connect to.

I hope that gives you a place to start! If you have any further questions please reply =)
--Beka

On Fri, May 7, 2021 at 8:53 AM Kate D <dots...@gmail.com> wrote:
Hi,
Could you please tell if it's possible to create different forms of top-bottom connections for different block types (to make connection validations depending on connection shape)? 

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/911fac0f-c567-433b-ab82-f7b29f562d98n%40googlegroups.com.

Kateryna Dotsiuk

unread,
May 8, 2021, 3:02:13 PM5/8/21
to blo...@googlegroups.com
Thank you for your response, your clarification about connection shapes configuration order helps a lot :)

You received this message because you are subscribed to a topic in the Google Groups "Blockly" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/blockly/zuOxOwLJl8M/unsubscribe.
To unsubscribe from this group and all its topics, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/CAEBzR97CaPLM6NN3MSF9XMN3Kd6ykNnS2b-XJWkAFRxZc3yRJg%40mail.gmail.com.

Kate D

unread,
May 11, 2021, 12:01:08 PM5/11/21
to blo...@googlegroups.com
Hello,
Using your hints I managed to create custom shapes for connectors, thank you!
But now I have a problem with not having enough place for statements in the statement input block.
Haven't found yet where I can fix it, could you suggest something please?

Render bug.png


On Fri, 7 May 2021 at 22:09, Beka Westberg <bekawe...@gmail.com> wrote:

Beka Westberg

unread,
May 11, 2021, 5:49:10 PM5/11/21
to blo...@googlegroups.com
Hello,

Firstly, I love your custom connections :D Nice and simple, but they look really cool!

Secondly, I think it might be easier to work with the advanced playground rather than the normal playground. The advanced playground has some tools that allow you to highlight the different regions of your block (as the renderer understands them). This can help you find places where the size the renderer thinks something is isn't correct.

debug-rendering.png

Rachel talks about the debug rendering in this talk.

I think that importing your renderer to the advanced playground should be the same as the normal playground? But in case it is not I would start by checking that the sizes of your top and bottom rows, as well as your spacer rows, are being reported correctly.

I hope that helps! If you have any further questions please reply!
--Beka

Kateryna Dotsiuk

unread,
May 12, 2021, 10:51:14 AM5/12/21
to blo...@googlegroups.com
Many thanks! :D
I will try that :)

You received this message because you are subscribed to a topic in the Google Groups "Blockly" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/blockly/zuOxOwLJl8M/unsubscribe.
To unsubscribe from this group and all its topics, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/CAEBzR94xtB%3DbY1PTS_bi%2BHA4RL%2BmhBUMP_n6dTJ-DNK52NMLQQ%40mail.gmail.com.
Reply all
Reply to author
Forward
0 new messages