Is there a way to set min-width of a LabelField?

[Wei Zhang]

Is there a way to set min-width of a LabelField?

[Maribeth Moffatt]

Block layouting is done with svg, not with css, so not in the way you're asking. If you provide more details about what you want & why, we might be able to provide more help. A picture would be great!

The label field is designed not to truncate and just holds text, so I'm curious why you want to change the minimum width and your reason would impact my next suggestion.

Best,

Maribeth

[Wei Zhang]

I have finish it by changing geras rendering.  The reason is just because of UI design.  The shadow blocks need a least width even if there's no action or information.   I think this feature could be very common.

--
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 visit https://groups.google.com/d/msgid/blockly/c91ea0cf-831b-44df-bce4-6bf2218938e0n%40googlegroups.com.

[Christopher Allen]

Hi Wei,

I have finish it by changing geras rendering.  The reason is just because of UI design.  The shadow blocks need a least width even if there's no action or information.   I think this feature could be very common.

Are all four of the things you've circled shadow blocks, rather than just empty connectors?  If so, you are using shadow blocks in a manner very different from that which we intended.  We normally expect a shadow block to be a normal value block (e.g., math_number), because their purpose is to allow users to enter a value without having to first attach a block.  All the spots you've circled don't look like blocks that evaluate to a value, but instead seem to be just placeholders to show some text or symbol in what otherwise looks like it is just an empty (unconnected) input connection.

Since you have already written a custom renderer, I would recommend that if you want to change the way empty input connectors are displayed—to make the open space bigger, or to add some special indications like "Any type" or "+"—that you do that by changing how the renderer draws empty connectors, rather than using shadow blocks that are just placeholders.

Or alternatively and even easier: just fill those spots with shadow value blocks (e.g. math_number, text, etc.), so that the user can enter a value without having to first create a new, non-shadow block.

That said, however, you should be able to add padding to a `FieldLabel` by adding non-breaking spaces ('\u00A0', also available for convenience as Blockly.Field.NBSP).

Best wishes,

Christopher

[Wei Zhang]

It's much easier to change the renderer itself.  So that I don't need to calculate how many '\u00A0's should be added to the Label Field, and its precision can be 1pixel.  And even it can be any type of Field. 


And I have also set the length of an Empty Input in case there's no shadow block to the input.

Both make sures we render 'input' with a minimum size since it's very important for a mobile screen when a human's finger always covers some part of the block.

--
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 visit https://groups.google.com/d/msgid/blockly/CAN0w5ebSF-O4SMWMOTF7ud1CEdMSHqJdgwX2qfA79VgFvg2DZA%40mail.gmail.com.

[Christopher Allen]

Hi Wei,

It's much easier to change the renderer itself.

Great—though I am laughing a little because I think you might be the first person to describe modifying the renderers as in any way easy—they are one of the most complex parts of Blockly and even some of us on the Blockly team are pretty nervous about making changes there.

Both make sures we render 'input' with a minimum size since it's very important for a mobile screen when a human's finger always covers some part of the block.

That's a really good point.  It will obviously depend on screen size and workspace scale (zoom), but if you think there are situations where Blockly by default renders particular parts of the UI way too small for touch-screen use then that is something that we'd be interested in hearing your feedback about—either here or in the form or a bug report.  We're doing a lot of work on accessibility at the moment, and although our main focus is improving keyboard navigation and screen reader support it's important we not neglect touch-screen accessibility either.

Christopher