[Free] CompCreator - create component dynamically

This is kind of lite version of DynamicComponents extension, it create and return an component directly, you may save it to a variable, or into a list or a dictionary for later use.
Thanks for yusufcihan’s wonderful work, which inspired my a lot.

UPDATE HISTORY

v8 updatd:

Helper blocks added for component and property socket,
Now NO NEED to type the component name or property name, just select from the dropdown list:
ONLY USE THIS IN NEW PROJECT, THIS MAY DAMAGE YOUR PROJECT USING PREVIOUS VERSION.



v7.1
bug fixed (can not remove Sprite and Ball from Canvas)
Thanks for @sky.s.billow and @TIMAI2 for reporting this bug.

v7
Add OnClick and OffClick methods

v6

  1. add Children method and Parent method
  2. parameter name change

v5:

  1. fix bug for set Color relevant property. (big Thanks for @TIMAI2 )
  2. add method of CreateFrom.

BLOCKS

Create:

2022-01-20_192218
Create a visible component in a container.
component: String or Component. component Class Name.
in: Component. where the new component to be created inside.

Remove

2022-01-20_123711
remove the component from screen. if it's a container component, all his children will be removed.

Children

2022-01-21_195051
return a list of component container's children.
This can be used for native component containers.

Parent

2022-01-21_195055
return parent (container) of a component

Set

2022-01-21_195100
set the property of one specific component.
component: the component to set property. Not a String.
property: String. it can be the following 3 type:

  1. any in-build property name. even some property only show in Design pannel.
  2. "index", this tag will set the showing order of the component in his container.
  3. other string. this will give the component a user-defined property.

value: String. value of the tag.

Get

2022-01-21_195106
get the property's value of a component.

CreateFrom

2022-01-20_123726
create a batch of components with template.
template: String. a json string descriping the structure of the components. (see below for how to get a template)
in : Component. where the new components to be created inside.
values: properties to replace the template.

HOW TO GET A TEMPLATE

a template is a json string like:
Snipaste_2022-01-20_13-07-02

  1. At designer panel, you drag and drop the component, and make the layout as you wish, set all necessary properties.

  2. select the component (normally a container, but one single component is OK) in the Viewer or component tree, press Ctrl+C. (lools like this only work at MIT server, not Kodular)

  3. go to Blocks panel, drag out a "empty string" block, and presse Ctrl+V to paste the template inside the block.

  4. if we want to change the property in the template, replace the origin by {1}, {2}, {3}...
    for example, we want to change the Text and TextColor, we can change the template like this:
    image

  5. feed the values socket with new property values
    Snipaste_2022-01-20_13-09-25

v7 update:

Add OnClick and OffClick methods

OnClick will bind a click event to a component like label, button, or even an arrangement.

This one have high priority than native event.

1647234255331504

DOWNLOAD LINK

[take me download website]

EXAMPLE

21 Likes

good extension

Thanks for the color bug fix and the template option:+1:

now more confusing :upside_down_face:
component made sense...and prevents extension update to existing...

2 Likes

ok i will change back :joy: in one hour

edit: updated.

2 Likes

Does template work in kodular ?

I have a quick test, and found it's working in Kodular, but you need to write your template from scratch, since Kodular can not use CTRLC+CTRLV to get the template.

But what is button version and uuid

ok i forget to mention the $Name, $version, Uuid, $blocks are useless in this template, you can delete them, or just leave them there, they will be ignored anyway.

the $Components and $Type is needed. and other perperty name.

You can make extension for create from scratch , so that it will easy for kodular users

What do you mean? which function do you want to achieve?

Sorry, this is MIT App Inventor Community. It will get off topic if you talk about another builder in this forum. If you want to talk to the extension developer about Kodular, please private message him.

3 Likes

Ok sir @Gordon_Lu

1 Like

two methods (Children and Parent) added.

3 Likes

How can I jusfity all the sentences in order to be all lines in the same size. like this:
image
readerDisplayDynamic.aia (159.6 KB)

save all the buttons (or labels) to a list, then use for each item block and Any Button(Any Label) to set it's font size.

Would you please show me the block to know how to do that.

Osama asked for justifying, not for sizing

I noticed that for this app you have asked a lot of questions and every time you want a direct block.

Pls read some basic tutorial and do it by yourself. Already tell you how to do.

I am sorry to bother you Kevinkun.
Would you please give some more details to know the idea of how to justify the sentences

what's mean? TextAlignment for label? this is only for horizontally. there is no vertical alignment for label. You need to put label inside an arrangement and set arrangement's AlignVertical.